Case Study: SYNCLY

Designing a saas landing page for conversions

This case study explores the design of Syncly’s website, a project management platform built for modern teams. The focus was on creating a clear, structured, and conversion-focused web experience that reflects the product’s simplicity and efficiency.

Role

Web designer

Tools

Figma

Industries

SaaS

Date

January 2025

Dashboard Sidebar Close Up
Dashboard Sidebar Close Up
Dashboard Sidebar Close Up

Overview

Syncly is a project management platform designed to help teams stay organized, aligned, and productive. The scope of this project focused on designing the marketing website experience from first impression to conversion. The website needed to clearly communicate Syncly’s value proposition within seconds, establish a professional and trustworthy brand presence, and guide users naturally toward sign-up and engagement across both desktop and mobile devices.

The Process

The process began with research into established SaaS websites to understand common user expectations around layout, content hierarchy, and conversion patterns. These insights informed the overall website structure, ensuring a clear and logical flow from discovery to feature understanding and finally to action. The emphasis at this stage was on clarity, scannability, and reducing cognitive load. With the structure defined, wireframes were created using Relume to explore layout options and refine content hierarchy. This allowed for rapid iteration while focusing purely on usability and flow, without the distraction of visual styling. The wireframes helped validate section order, spacing, and content priority before moving into high-fidelity design.

Full Dashboard
Full Dashboard
Full Dashboard

Once the layout was validated, the focus shifted to visual identity and UI design. A clean typographic system was introduced to support readability and hierarchy, paired with a minimal color palette and a strong accent color to guide attention. Consistent UI components and spacing rules were defined to ensure cohesion across the website. This design system was then applied to high-fidelity desktop and mobile mockups, resulting in a cohesive and polished website experience.

Home screen
Home screen
Home screen

Outcome and Key takeaways

The final website design presents Syncly as a professional, modern, and approachable project management solution. The structure allows users to quickly understand the product’s value, while the visual system reinforces clarity and trust throughout the experience. The responsive layouts ensure consistency across devices and support smooth user navigation from entry point to conversion. This project reinforced the importance of strong structure and hierarchy in SaaS website design. Focusing on layout and flow early in the process made visual decisions more intentional and effective. Establishing a clear design system also proved essential in maintaining consistency, scalability, and clarity across the entire website.

Create a free website with Framer, the website builder loved by startups, designers and agencies.