Skip to content

Web & Digital · UI/UX Design services

UI/UX Design That Makes the Next Step Obvious

Good design is not decoration. It is the arrangement of information so that a visitor understands what you offer, believes it and knows what to do next. We design websites and products with that as the measure.

Get Your Growth AuditSee how it works

Reviewed by the SERPMOZ web team on

Best for
Teams redesigning a site or product, or building one without in-house design
Works alongside
Web development, CRO, content and brand
Typical horizon
Usually 4 to 10 weeks for a website; products run longer and continue in cycles
Measured in
Task completion in testing, conversion rate, accessibility conformance, build speed

In short

What is UI/UX design?

UI/UX design is the process of deciding how a website or digital product works and how it looks. UX, user experience design, covers research, structure and flow: what people need, how content is organised and which steps lead to a goal. UI, user interface design, covers the visible layer: layout, typography, colour, components and states. The two are done together, tested with real users where possible, and handed to developers as a documented design system.

The problem

Signs it is time to rethink UI/UX Design.

  • 01

    Visitors cannot tell quickly what the company does.

  • 02

    The site looks dated beside competitors.

  • 03

    Every page was designed separately and nothing matches.

  • 04

    Design decisions are settled by the loudest opinion.

A team in discussion around a meeting table by a window

Why UI/UX Design matters

People judge credibility within seconds, largely on design. After that, clarity decides whether they stay. Both are commercial outcomes.

What is included

What do our UI/UX Design services include?

Research, information architecture, interface design and design systems. The scope is set by the audit: you get the parts you need, in the order that pays back soonest.

  1. 01

    User research

    We begin with what can be learned about real users from the evidence available: analytics, recordings, search data, support queries and conversations. The depth of research is matched to the size of the decision.

    • User and stakeholder interviews
    • Analytics and session recording review
    • Competitor and pattern analysis
    • Audience needs and tasks defined
    • Findings summarised as design priorities
  2. 02

    Information architecture

    Information architecture is how content is grouped, labelled and linked. If visitors cannot predict where something lives, no amount of visual polish will help them find it.

    • Content inventory and grouping
    • Sitemap and navigation model
    • Labels tested with card sorting or tree testing
    • Page hierarchy and content priority
    • Search demand reflected in structure
    Technical SEO services
  3. 03

    Wireframes and prototypes

    Wireframes fix what goes on each page and in what order, without the distraction of colour and imagery. Clickable prototypes let us test a flow before anyone writes code.

    • Low-fidelity wireframes for key templates
    • User flows for main tasks
    • Clickable prototype in Figma
    • Usability testing on the prototype
    • Mobile layouts designed first
  4. 04

    Interface design

    The interface gives the structure a visual language: type, colour, spacing, imagery and motion. We design every state of each component, not only the ideal one shown in a presentation.

    • Typography, colour and spacing scales
    • Layout grids across breakpoints
    • Component states: hover, focus, error, empty
    • Imagery and iconography direction
    • Microcopy for buttons, forms and errors
  5. 05

    Design systems

    A design system is a shared library of tokens, components and rules that designers and developers both work from. It keeps a growing site consistent and makes new pages quicker to produce.

    • Design tokens for core values
    • Component library with variants
    • Usage guidance and examples
    • Naming aligned with the codebase
    • Process for proposing and adding components
    Web Development services
  6. 06

    Accessibility

    Accessible design allows people with visual, motor, hearing or cognitive impairments to use the product, and it tends to improve clarity for everyone. We design to the WCAG success criteria and check our work against them.

    • Colour contrast for text and controls
    • Visible focus states and keyboard order
    • Touch targets sized for fingers
    • Clear form labels and error messages
    • Review against WCAG 2.2 level AA

How it works

How does a visitor decide whether to stay, read and act?

People do not read a page from top to bottom and then make a decision. They pass through a quick series of judgements, and design affects each one. Losing someone at an early stage means the later stages never happen.

  1. 1

    Orient

    In the first moments the visitor works out what this is and whether it is relevant to them.

    What we doLead with a plain statement of what you offer and who it is for.

  2. 2

    Navigate

    They look for the route to what they came for, using the menu, links or search.

    What we doUse familiar navigation patterns and labels drawn from the words users themselves use.

  3. 3

    Scan

    They skim headings, images and highlighted text, reading closely only where something catches.

    What we doBuild a clear visual hierarchy so the key points survive a ten-second skim.

  4. 4

    Trust

    They judge credibility from consistency, detail, proof and how carefully the page is made.

    What we doPlace evidence beside claims and keep every component consistent in look and behaviour.

  5. 5

    Act

    They click, fill in a form or buy, or abandon when the step is unclear or laborious.

    What we doMake one primary action obvious, shorten forms and write helpful error messages.

Process

What does a typical UI/UX Design engagement look like?

Timings are typical and depend on site size and how quickly changes can be shipped. You will know the plan, and the reasoning behind it, before execution starts.

Read our full methodology
  1. 1

    Weeks 1 to 2

    Research and goals

    We agree what the design must achieve, review analytics and recordings, speak to users or the people closest to them, and study how competitors solve the same problems.

    • Research summary
    • Design goals and success measures
  2. 2

    Weeks 2 to 3

    Structure

    Content is grouped and the sitemap, navigation and main user flows are defined. Labels are tested where the structure is large or contested.

    • Sitemap and navigation
    • User flows
  3. 3

    Weeks 3 to 5

    Wireframes and prototype

    Key templates are wireframed for mobile and desktop, linked into a prototype and tested with a small number of users.

    • Wireframes for key templates
    • Usability test findings
  4. 4

    Weeks 5 to 8

    Interface design

    A visual direction is chosen, applied to the key screens and extended into components with all their states.

    • High-fidelity designs
    • Component library in Figma
  5. 5

    Weeks 8 to 10

    Design system and handover

    Tokens, components and usage rules are documented and walked through with developers. We review the build against the designs before launch.

    • Documented design system
    • Design QA of the built pages

Deliverables

What you receive.

  • UX research summary
  • Sitemap and user flows
  • Wireframes and prototype
  • High-fidelity designs
  • Design system and component library
  • Accessibility review
  • Developer handover
Hands sketching a system diagram on a whiteboard

Technology and tools

  • Figma
  • FigJam
  • Usability testing tools
  • Analytics and recordings
  • Accessibility checkers

Platforms we typically work across. Named for clarity, not as partnerships or endorsements.

Expected business outcomes

How is UI/UX Design success measured?

  1. 01Task completion in testing
  2. 02Conversion rate
  3. 03Engagement on key pages
  4. 04Design and development speed

Targets are set after the audit, against your own baseline. We do not promise figures before we have seen the data, and results vary by market and starting point.

Who does what

AI accelerates

  • Synthesising research
  • Generating layout and copy options
  • Checking contrast and consistency

Experts decide

  • Understanding the user
  • Taste and restraint
  • Deciding what to leave out

Compare

Full redesign or continuous optimisation: which does your site need?

A redesign replaces the structure and look in one move. Optimisation keeps the site and improves it through tested changes. Many teams commission a redesign when their real problem could be solved by the second approach.

Redesign compared with Continuous optimisation (CRO)
RedesignContinuous optimisation (CRO)
ScopeStructure, look and componentsSpecific pages and elements
EvidenceResearch and prototype testingLive experiments on real traffic
RiskMany changes at onceSmall, reversible changes
Speed of learningAfter launchContinuous
Traffic neededNoneEnough to reach valid results
Best whenFoundations are outdated or inconsistentFoundations are sound, performance is not

Our viewRedesign when the structure, brand or codebase can no longer be improved piece by piece. Optimise when the foundations are sound, and plan to optimise after any redesign, because a launch is a hypothesis until real visitors test it.

See our CRO service

Who it is for

Is UI/UX Design right for your business?

  • Companies redesigning a website
  • Startups designing a product
  • Teams without in-house design
  • Brands that have outgrown their look

UI/UX Design by industry

UI/UX Design by market

Questions

UI/UX Design services: frequently asked questions.

Something we have not covered?

Talk to a Growth Strategist
What is the difference between UI and UX design?

UX design is about how something works: the research, structure, flows and content priority that let people complete a task. UI design is about how it looks and responds: layout, type, colour, components and states. A product needs both, since a handsome interface on a confusing structure still fails its users.

How much does UI/UX design cost?

Cost depends on the number of unique templates or screens, how much research and testing is included and whether a full design system is required. A five-template marketing site and a multi-role web application are very different pieces of work. We scope after a growth audit and explain the drivers.

How long does a website design project take?

A typical website design takes four to ten weeks before development begins. Research and structure take the first few weeks, wireframes and testing the middle, and visual design and handover the rest. Timetables stretch mainly through slow feedback, so we agree review dates and a single decision-maker at the start.

Is user research worth it for a small project?

Yes, in proportion. Even a few short conversations with customers and a review of existing analytics will expose assumptions that would otherwise be built into the design. Research does not have to be a long study. Skipping it entirely means designing for the opinions in the room.

Do we need wireframes, or can we go straight to visual design?

Wireframes are worth the time on anything beyond a very small site. They let everyone agree content and layout while changes are cheap. Going straight to visual design tends to turn structural discussions into arguments about colour, and structural mistakes are then found late.

What is a design system and do we need one?

A design system is a documented set of tokens, components and usage rules shared by designers and developers. Any site that will keep growing benefits from at least a small one. A large, formal system is only justified when several people or teams design and build in parallel.

Which accessibility standard should our website meet?

The Web Content Accessibility Guidelines at level AA are the usual reference, and most accessibility laws and procurement rules point to them. Which legislation applies depends on your country and sector, so legal obligations should be confirmed with a qualified adviser. We design to the guidelines and document what was checked.

Can you design in Figma for our own developers to build?

Yes. We deliver organised Figma files with components, variants, tokens and annotations, and walk your developers through them. We also review the built pages against the designs, because the gap between a design file and the live site is where much of the quality is lost.

Is good design mainly about making things look attractive?

No. Appearance matters for first impressions and credibility, but most of the value lies in decisions users never notice: what was left out, the order of information, the wording of a label. A plain page that people can use will outperform a striking one that they cannot.

Related services

What works best alongside UI/UX Design?

More in Web & Digital:Web DevelopmentNext.js DevelopmentWordPress DevelopmentShopify DevelopmentWebflow DevelopmentEcommerce Development

Further reading

From SERPMOZ Research.

Start with a growth audit

Stop Buying Marketing Activity.Start Building a Growth Engine.

Tell us where you are today, where you want to go and what is holding growth back. We’ll identify the highest-impact opportunities.

Get Your Growth AuditTalk to a Growth Strategist

What happens next

  1. 1

    You tell us where you are

    A short form about the business, its goals and what is holding growth back.

  2. 2

    A strategist reviews it

    Search, AI visibility, paid media, content and conversion, read together.

  3. 3

    You get the priorities

    The highest-impact opportunities, in order, with the reasoning shown.

No obligation, and no guaranteed outcomes promised. Just an honest read of where you stand.

Have a strategist review your UI/UX Design.

Get Your Growth Audit