Skip to content

Website and app interface design

Screens are designed in Figma before coding and tried in a clickable prototype.

Typical targets; the real figure is measured in the pilot.

  • Mobile firstscreen design
  • Clickableprototype tested before coding
  • 1-3 weekstypical design time for a small site

The problem

You are about to commission a site or an app but cannot see how it will look beforehand. Asking for changes after building starts takes long and costs more. If users cannot find which button to press, your system does not work.

Who it is for

  • Those commissioning a new site or app
  • Companies with a confusing current interface
  • Software teams with no designer
  • Those who need to show a product to investors or customers
  • Those building an internal panel

What it does

  1. User flow

    We first draw the steps a visitor or user goes through. Unneeded steps are removed at the start.

  2. Phone-first screens

    Screens are designed at phone size first, then adapted to tablet and desktop.

  3. Clickable prototype

    We build a Figma prototype where buttons work and pages connect. You try it with your team or customer before coding.

  4. Readable, accessible design

    Text size, colour contrast and button size are chosen for comfortable use.

  5. Developer-ready handover

    Measurements, colours and components come in an organised Figma file. The developer builds without guessing.

  6. Fit with your brand

    We use your existing logo and colours. If you have none, we first set a simple brand base.

How we deliver it

  1. 01

    Goal and user

    We discuss what will be built, who will use it and what the most important action is. We look at competitors and examples together.

  2. 02

    Flow and wireframes

    We draw page structure and screen flow with simple wireframes. We get your approval before going into detail.

  3. 03

    Visual design and prototype

    We apply colour, type and imagery and complete the screens. We give you the clickable prototype.

  4. 04

    Handover

    We organise the Figma file so it is ready for developers. If you want, we can also code it.

Works with

  • Figma
  • FigJam
  • Next.js
  • Storybook

Questions

How long does design take?

It depends on screen count. A small site usually takes 1 to 3 weeks, an app takes longer. We write the scope down at the start.

Can I give the design to another developer?

Yes. We deliver the file in a layout a developer can use. You do not have to have us code it.

Can you redesign my current site?

Yes. We first look at the current screens and how they are used, settle what will change, then begin.

Does the prototype work like a real app?

No. It shows how screens flow, but there is no system behind it. Its purpose is to try things before building.

More from this service

Design

Website and app interface design