UX/UI design

UX/UI design starts with questions, not colours

Good UX/UI design for a small business site begins with the questions customers ask before they buy. For a dental clinic that might be: do you take new patients, do you bill my insurance directly, are you open evenings, is there parking? For a roofing company: do you work in my town, how soon can you come, what does a typical job cost, do you offer financing? These questions become the skeleton of the page. The visual design comes later and makes the answers easy to find.

That's why the first thing you see from me isn't a colourful mockup, it's a grey wireframe with real text. It looks plain on purpose. Without colours and photos, it's much easier to judge whether the structure makes sense.

Designed for thumbs

Most visitors to a local business site are on a phone, often one-handed. I design for that first: tap targets large enough for a thumb, the main action within reach at the bottom of the screen, forms with the right keyboard (numbers for phone fields, email keyboard for email), no tiny links packed together, no pop-ups that cover the content. Then I adapt the layout to desktop, where there's room for more detail side by side. The article on mobile-first websites goes deeper into why.

The parts of UX that people skip

• Navigation labels in customer language. "Prices" beats "Investment". "Kitchens" beats "Solutions".
• Visual hierarchy. One main action per screen, secondary options visibly quieter.
• Error states. What happens when a form field is wrong? A clear message next to the field, not a red banner at the top.
• Empty states. What does the projects page look like before you've added projects? It should still make sense.
• Loading. Content placeholders instead of a blank screen while images arrive.

Interface design that supports your brand

Once the structure is approved, I design the interface: typography, colour palette, buttons, icons, photo treatment. If you have a brand book, I follow it. If not, I build a small, consistent system for the site, with a few colours and two font weights, so every new page looks like it belongs. Contrast and focus states are checked against WCAG at this stage, which makes the site usable for more people and helps if you're subject to AODA. If you need a full identity first, visual identity work is done with a trusted partner.

A quick example

A cleaning company's first screen had a slogan, a slider of stock photos and four equal buttons. In the wireframe I replaced it with one line naming the service and the city, a starting price, a "Get a quote in 2 minutes" button and the phone number. Nothing fancy, just the answers people came for, in the order they look for them. That's what most UX work on small sites comes down to.

Testing before building

Before I code anything, you get clickable mockups to open on your own phone. Ideally, show them to two or three real customers and watch where they hesitate. It takes half an hour and often reveals more than any expert review. You have three rounds of revisions on the design, and changes at this stage cost nothing compared to changes after launch.

From design to a working site

Because I design and build myself, there's no handoff where spacing, states or animations get lost. What you approve is what goes live. Once the site runs, real data shows where people drop off, and conversion rate optimization takes it from there. For examples of section order on a homepage, read homepage structure, and for other services see web design.