Start rough.

Scroll to watch one product, Vigilo, go from sticky notes to a working screen, with the decision made at every stage.

A card sort: sixteen sticky notes grouped by fielder, leader, manager and admin, with delete record and edit sealed crossed out

A flow from Today through pre-start and briefing to a certificate check, with a loop to a lesson, then verify and a sealed receipt

A gloved thumb pressing a large answer button, beside the same screen in four states: saved, syncing, received and offline

Example: Vigilo, a site-safety app we’re building.

01 / 04, Information architecture and content chunking

Who sees what?

Decision: We listed every screen the product needs and sorted them by who uses them: fielders, leaders, managers and admins. Two ideas were struck off for good: deleting a record and editing a sealed one.

You get: One signed-off list of every screen, by role and device.
Done when: Your safety lead confirms nothing is missing.

02 / 04, Low-fidelity wireframing and structural flow

Not certified?

Decision: The fielder’s day became one straight path from Today to a sealed receipt. A certificate check sits before the task: no valid certificate sends the worker to a short lesson first, then back.

You get: Flow diagrams per role and a permissions matrix.
Done when: Every screen maps to a role, and no role hits a dead end.

03 / 04, Mid-fidelity alignment and multi-state planning

Works in gloves?

Decision: Answers became big buttons a gloved thumb can hit, and every screen got four states: saved on the device, syncing, received and offline. The worker always knows where their record is.

You get: A principles sheet and a clickable mid-fidelity prototype.
Done when: 5 workers finish the core tasks wearing gloves, outdoors.

04 / 04, High-fidelity design and interaction prototyping

One design?

Decision: Colour never carries meaning alone: every status has an icon and a word. A sun theme for the field, a night theme for night shifts, and one set of tokens for phone, tablet and desk.

Status colours green, amber, red and blue, each with an icon and a word, and the same screen in a sun theme and a night theme — Every status pairs a colour with an icon and a word, in a sun theme and a night theme.

The same dashboard drawn on a phone, a tablet and a laptop — One set of tokens, three layouts: only the density changes.

You get: A design system in design files and code, then the live product.
Done when: One component library renders correctly on phone, tablet and desktop.

Your own identity.

Twelve steps in three phases, from finding an identity to the final files. This is where the time goes, and why the result looks like nobody else’s.

Find it

01Discovery interviews
Founders, staff and a few customers, so the brand starts from what is true.
02Audience and market audit
Who we are talking to, and what competitors already look like.
03Positioning
One sentence: who it is for, what it does, and why it is different.
04Personality and voice
Three traits, with words to use and words to avoid.

Shape it

05Moodboards and routes
Two or three visual directions to react to before any logo.
06Logo sketching
Dozens of pencil thumbnails, most of them thrown away on purpose.
07Logo construction
The chosen idea refined on a grid and tested at favicon size.
08Colour system
A palette with contrast checked for screens, print and bright sun.

Hand it over

09Typography
Two typefaces at most, with sizes set for headings and body text.
10Graphic language
Icons, patterns, illustration and photo style.
11Applications
App icon, social media, stationery, signage and packaging, as needed.
12Guidelines and handover
A brand guide, plus every file in every format, organised and named.

Revision included.

Better isn’t always the first line. It’s the one we choose to keep. Watch the eraser work, or grab it and rub out a draft yourself.

A cluttered first draft of a web page is erased to reveal a clean redraw.

Eraser. Drag it, or use the arrow keys, to rub out the draft.

First sketch
Three rough routes. ~~Blue logo~~ pencil yellow.
Your feedback
“~~Make it pop~~” becomes a clear brief we agree on.
Redraw
We erase what didn’t work and redraw with intent.
Signed off
Only the lines worth keeping. Nothing by accident.

Revision happens at every stage, not once at the end. Each stage closes with a gate you sign off before the next begins, so changes stay cheap.

Our promises.

The working promises behind every project, from the first message to the final file.

Ask us anything

1Drawn from scratch

No templates. Every brand and interface starts with a blank sheet and your problem.

2Phones first

Most of your customers are on a phone. We design for that screen and for slow data first.

3Talk to the makers

You speak directly with the people designing and building, on WhatsApp or email.

4You own it

Your files, your code, your domain. Handed over clearly at the end.

5Revision built in

Review rounds are part of the plan, not a favour. We erase and redraw until it is right.

6Made to last

Accessible, documented and easy to maintain long after launch.

Good questions.

01Why does it take longer than a template?

Because a template answers someone else’s problem. The time goes into understanding yours, and it shows in the result.

02How many revision rounds are included?

Review rounds are planned into each stage and agreed in the proposal, so feedback is expected, not extra.

03Can we skip stages?

We can make stages lighter for smaller projects, but not skip them. Each decision makes the next one cheaper.

04Who will we work with?

The people designing and building your project, directly. No account managers in between.

Start to finish.

Thoughtful work takes curiosity, revision and craft. Tell us where you want to start.

Fill in the note
Send it on WhatsApp or by email
We reply the same working day