Once the structure, content, and wireframes are clearly defined, website development moves into the design phase. This is where the website begins to take its final visual form and where structure, content, and tone are translated into a clear, consistent, and usable design. The goal of this phase is not decoration, but visual clarity, usability, and alignment with the brand.

Design as a continuation of structure and content

Design does not exist in isolation. It builds directly on the approved tree structure, content plan, wireframes, and defined tone of communication. Good design supports content, guides users through the website, and reinforces the intended message, visually and functionally.

Visual identity as an intermediate step (when needed)

Depending on the client’s needs and the state of existing materials, an intermediate step may be required before website design begins: defining or refining the visual identity. This step can take several forms:

• Using an existing visual identity – when brand guidelines already exist and can be applied consistently
• Creating a new visual identity – when no visual system exists or when starting from scratch
• Deriving a visual identity during a redesign – when no formal brand guidelines exist, but current materials provide a usable foundation

In redesign projects without a clear visual system, we extract what works from existing materials and enhance it with professional design decisions. This includes refining typography, defining color palettes, and aligning visual elements with the content tone and communication style.

Designing with content in mind

Whenever content is already available, it is integrated directly into the design. This allows us to design real layouts based on real messages, not placeholders. By working with actual content, we can deliver a 1:1 visual model of the website, giving the client a clear and realistic preview of the final result. This approach helps identify potential issues early and ensures that design decisions truly support the content and goals of each page.

The design phase thus covers all pages and subpages defined in the website structure. This ensures visual consistency across the entire site while allowing flexibility where different content types require different layouts. Shared components such as navigation, footers, buttons, and content blocks are designed as part of a coherent system, not as isolated elements.

Responsive design by default

Every website is designed with responsiveness in mind. Designs are created for both desktop and mobile views, ensuring usability and clarity across devices. Layouts are adapted, not simply resized. This means prioritizing content differently on smaller screens and making sure interactions remain intuitive.

Design created in Figma

All designs are created in Figma, which allows for efficient collaboration, clear feedback, and transparent version control.

For elements that require interaction or explanation, interactive prototypes are created. These help demonstrate user flows, transitions, and dynamic elements where static designs are not sufficient.

Validation before development

The design phase serves as a validation step before development begins. It allows us to confirm that:

• The structure works visually
• The content is clear and readable
• The tone is consistent across text and visuals
• The user experience supports the project goals

Fixing visual or structural issues at this stage is significantly faster and more cost-effective than addressing them during development.

From design to development

Once the design is approved, it becomes the visual blueprint for development. Developers work from a clear, detailed, and validated design system, reducing ambiguity and unnecessary back-and-forth.

This handoff ensures that what gets built matches what was designed — visually, structurally, and functionally.

Design as a bridge, not a bottleneck

Design connects strategy with execution. When done properly, it accelerates development rather than slowing it down.

Clear design decisions create confidence — for the team and for the client.

In the next article, we’ll explore the development phase and show how design is translated into a functional, high-performing website.