Phase 2 of 3

Design & Prototype

The approved wireframe structure is transformed into a fully realised visual experience, including high-fidelity design and a clickable Figma prototype you can navigate before a single line of code is written.

Where structure becomes experience

Phase 2 is where your brand comes alive on screen. With the UX blueprint approved in Phase 1, we now layer in visual design: typography, colour, hierarchy, imagery, spacing, and interaction. The result is a pixel-perfect, high-fidelity design and a clickable prototype that lets you experience the site before it's built. This phase is about refinement and confidence. By the time we're done, there are zero surprises in Phase 3.

1

High-Fidelity Design

We apply your brand identity: colours, typography, imagery, and visual language, to the approved wireframe structure. Every screen is designed with pixel-level precision in Figma.

2

Typography & Hierarchy

We define a clear typographic system: heading scales, body text, contrast ratios, and visual weight. This ensures readability and guides users naturally through each page.

3

Clickable Prototype

We connect the screens into a navigable Figma prototype. You can click through it like a real website, testing the flow, checking transitions, and experiencing the design before build begins.

4

Design Review & Feedback

We share the prototype and gather structured feedback. Feedback is most effective when it comes through the agreed decision-maker, referenced to specific screens or interactions.

5

Refinements Within Scope

We apply revisions based on your feedback within the agreed scope. This phase is iterative but bounded. The goal is refinement, not redesign from scratch.

6

Final Design Sign-Off

Written approval is required before moving to Phase 3. The approved design files become the exact specification for development, with no guesswork, no interpretation.

Why this matters

You click it before we build it

The clickable prototype is one of the most valuable things we deliver. It lets you experience the design as a user, not just review it as a static image. You can test the navigation, spot anything that doesn't feel right, and sign off with real confidence. Changes at this stage cost minutes. The same changes after build begins cost hours. The prototype is your safety net.

Phase 2 Deliverables

High-Fidelity Design Files Fully designed screens in Figma for every page and state. Desktop-first with mobile layouts included.
Clickable Figma Prototype A fully navigable prototype shared via Figma link. Test the entire user flow before we build anything.
Typography & Style Guide A defined visual system covering type scales, colour usage, spacing, and component styles.
Written Phase Approval Formal sign-off on the design files. This becomes the development specification for Phase 3.

What you pay at this stage

Phase 2 is triggered by a 40% milestone payment, the largest single payment in the project. This reflects the depth of work: full visual design plus a clickable prototype.

Plan

Basic Website

Total project €799
40% milestone €319.60

Due at Phase 2 approval

€319.60

Remaining after this: €239.40 (Phase 3, 30%)

Plan

Business Website

Total project €2,499
40% milestone €999.60

Due at Phase 2 approval

€999.60

Remaining after this: €749.70 (Phase 3, 30%)

Plan

Enterprise Website

Total project (from) €4,999
40% milestone €1,999.60

Due at Phase 2 approval

€1,999.60

Remaining after this: €1,499.70 (Phase 3, 30%)

Important notes for Phase 2

Your assets, please

All text content, product images, brand assets, and logos must be provided by you before Phase 2 begins. Placeholder content creates incomplete designs and delays sign-off.

Design is built on Phase 1

The visual design follows the approved wireframe structure exactly. Requests to change the page structure or navigation in Phase 2 are treated as scope changes and may affect timeline and cost.

Revisions are scoped

We include revisions within the agreed scope. Large-scale visual redesigns or direction changes after initial presentation are assessed separately. Clear, consolidated feedback keeps things efficient.

Sign-off locks the spec

Once Phase 2 is approved, the design files become the exact specification for development. Changes requested during Phase 3 that deviate from the approved design will require a scope review.

Explore other phases

Curious what your site could look like?

Let's start with a conversation.