Chat on WhatsApp
Bitara

Portfolio

Website design portfolio

Websites people enjoy using, and attackers cannot get into. User experience and interface come first, built on proven frameworks, measured, and secure by design.

Selected design concepts

Six sites, six problems solved

These are design concepts with invented brands, made to show how we think and build. Client work is shown on request, with the client's permission.

Financial servicesCorporate site and client portalConcept

Veldra Private Wealth

The problem
Prospective clients judged the firm in seconds, and the old site looked like every other bank.
What we did
An editorial layout with generous space and one confident accent; fees explained in plain words before anyone has to ask; the client sign-in behind two-step verification.
  • UX research
  • Editorial UI
  • Client portal
  • Two-step sign-in
  • POPIA notices

HealthcareBooking websiteConcept

Lumora Dental Studio

The problem
Most visits came from phones, and booking took nine steps and a phone call.
What we did
Mobile first: a two-step booking flow tested with real patients, large touch targets, and health details kept to the minimum the practice needs, encrypted at rest.
  • Mobile-first UX
  • Booking flow
  • Usability testing
  • WCAG 2.2 AA
  • Encrypted records

LogisticsCustomer tracking dashboardConcept

Kestrel Freight

The problem
Customers phoned the depot to ask where their loads were, dozens of times a day.
What we did
A dashboard designed around the three questions customers actually ask, with status in plain words and colour used only for exceptions; each customer sees only their own loads.
  • Dashboard UX
  • Design system
  • Live tracking
  • Row-level access
  • API integration

Fashion retailOnline storeConcept

Atelier Noa

The problem
Beautiful products, but shoppers left at the size chart and again at checkout.
What we did
Product pages led by photography and honest fit notes, a size guide in the flow rather than a pop-up, and a three-step checkout with card details handled by the payment provider.
  • E-commerce UX
  • Product pages
  • Checkout redesign
  • Payment security
  • Fast images

EducationSchool website and parent portalConcept

Brightpath Academy

The problem
Parents had four apps and a WhatsApp group, and still missed what mattered.
What we did
One portal built from the parents' own top tasks, plain-language notices, and children's information visible only to their own guardians.
  • Card sorting
  • Information architecture
  • Parent portal
  • Accessibility
  • Role-based access

ArchitecturePortfolio websiteConcept

Sable & Stone Architects

The problem
Award-winning projects hidden behind a slow site that took eight seconds to show a picture.
What we did
A gallery-first layout with large imagery that still loads in under two seconds, and project stories told in the order a client would ask about them.
  • Visual design
  • Gallery layout
  • Core Web Vitals
  • Image pipeline
  • SEO

Watch it in use

Designed around what people came to do

Good design shows when someone uses it. Two walkthroughs, played the way a screen recording would: a patient booking a dental visit on a phone in two taps, and a freight customer finding their load without phoning the depot.

We test every important task like this with real people before launch, and watch where they hesitate. What they stumble on, we fix.

Lumora Dental Studio: book on a phone in two taps
Kestrel Freight: a customer finds their load without a phone call

E-commerce

Online stores that sell, and keep card details out of harm's way

We design and build online stores around the moments that lose sales: finding the right product, choosing a size with confidence, and a checkout short enough to finish on a phone.

  • Fast product pages with photography that loads in a blink, and honest fit and stock information.
  • A three-step checkout, guest checkout included; card details go straight to the payment provider and never touch your server, which keeps you out of most card-data (PCI DSS) scope.
  • Stock, orders and refunds in our own content management engine, with roles and a history of every change.
  • POPIA-ready: only the customer details you need, kept safe, with a clear privacy notice.

The example: Atelier Noa, a small-batch clothing store (a concept). Watch a shopper go from the collection to a paid order in under a minute.

Atelier Noa: from the collection to a paid order

Bespoke design and development

Made for you, so your site looks like no one else's

No templates, no off-the-shelf themes. Every site and app is designed around your brand and your customers, then built from the ground up. That is what sets it apart: it looks like you, it does exactly what your visitors came to do, and it carries no unused code, so it is faster and has less to attack.

  • Bespoke design: your own look, layouts and interactions, in a design system that grows with you.
  • Bespoke development: the features your business needs, integrated with the systems you already use.
  • SEO built in: every page found for what it offers: the search phrase in its main heading, titles that fit Google's results, structured data, a sitemap and fast Core Web Vitals. This site scores 100 for SEO on Lighthouse.
  • Know your customers, with analytics: which pages bring enquiries and sales, where visitors drop off and what they search for, measured with privacy-friendly, cookie-free analytics on your own server: POPIA-aware, no third-party trackers, and your data stays yours.
  • AI integration with MCP: Model Context Protocol servers that let AI assistants work with your own systems and data, with access you control and every action logged.
  • Mobile apps for iOS and Android: one codebase for both, the same UX process, secure sign-in, and screens that work offline when the signal drops.
Fynbos Fit (a concept): a fitness app for iOS and Android

How we design

UX and UI come first. Always.

A website is judged in seconds and used for years. Every project follows proven frameworks, in this order, so design decisions rest on evidence rather than taste.

  1. 01

    Discover

    Double Diamond

    We start with the people who will use the site: interviews, analytics and top-task surveys, before a single screen is drawn.

  2. 02

    Define

    Jobs to be done

    What each visitor came to do, written down and ranked; the design is judged against those jobs, not against taste.

  3. 03

    Design

    Nielsen's 10 heuristics and Gestalt

    Wireframes, then UI built on visual hierarchy, proximity and consistency, so the important thing is always seen first.

  4. 04

    Build

    Atomic design and WCAG 2.2 AA

    A design system of reusable parts, accessible to everyone: contrast, keyboard use, screen readers and 44 px touch targets.

  5. 05

    Evaluate

    SUS and usability testing

    Real people try real tasks; the System Usability Scale tells us how usable it is, and we fix what they stumble on.

  6. 06

    Secure

    OWASP Top 10 and ASVS

    Security is designed in, not bolted on: tested against the OWASP Top 10 before launch, and kept patched after.

UX and UI principles

The principles every screen is checked against

User experience is how it works and how it feels to use; the user interface is how it looks and responds. Both are checked, screen by screen, against principles proven in usability research.

UX User experience: logic, structure and flow

  • User-centred designThe people who will use it, their needs and their pain points, decide every screen.
  • ConsistencyThe same patterns, words and flows everywhere, so nothing has to be learnt twice.
  • HierarchyThe most important information first, where the eye lands naturally.
  • User control and freedomA clear way out of every step: undo, back and cancel, always in reach.
  • Wayfinding: footprints and progressBreadcrumbs on every page and a step indicator in every workflow, so people always know where they are, where they have been and what comes next.
  • Flexibility and efficiencySimple for first-timers, with shortcuts and remembered preferences for regulars.
  • Error prevention and recoveryMistakes stopped before they happen; when they do, a polite message that says how to fix it.
  • AccessibilityWorks for everyone, including people with vision, hearing, motor or cognitive impairments.

UI User interface: look, layout and response

  • ClarityThe purpose of every button, icon and field obvious at a glance.
  • Visual hierarchySize, weight and colour lead the eye to the main action before the rest.
  • Proximity and whitespaceRelated things grouped together, with room to breathe around them.
  • ContrastText that stands clearly off its background: WCAG AA or better, in light and dark.
  • Feedback and responseEvery tap, click and hover answered at once, so people know it worked.
  • TypographyClear, legible type, two font families at most, set for easy reading.

Measured, not guessed

Usability, scored with SUS

We evaluate every design with the System Usability Scale (SUS): ten short questions answered by real users after real tasks, giving a score from 0 to 100. The average website scores 68. We design to 80 or more, the band rated excellent, and we test again until we get there.

Beside it: Lighthouse scores for accessibility, best practices and SEO, Core Web Vitals for speed, and WCAG 2.2 AA for accessibility. This site scores 100 on Lighthouse accessibility, best practices and SEO.

PoorOKGoodExcellent 68average 80+our target
System Usability Scale, 0 to 100 (bands after Bangor, Kortum and Miller)

Secure by design

Security is a priority too, from the first sketch

A beautiful site that leaks data is a liability. Every site we build is designed around the CIA triad of information security, tested against the OWASP Top 10 before launch, and kept patched after it.

  • Confidentiality

    Only the right people see the data: encryption in transit and at rest, two-step sign-in, row-level access in the database.

  • Integrity

    Data and code cannot be changed unnoticed: CSRF protection, input validation, audit logs and tested, reviewed releases.

  • Availability

    The site is there when people need it: health checks, automatic recovery, monitored servers and tested backups.

Why we do not build on WordPress

Most WordPress vulnerabilities are not in WordPress itself but in the third-party plugins and themes every site ends up depending on, each written and patched by someone else, on their schedule. We build lean, custom sites with only the code they need, all of it ours to review, test and patch: fewer moving parts, a smaller attack surface, and faster pages.

Instead of WordPress, we design our own content management engine for each site. You update pages, pictures and news yourself, with two-step sign-in, roles for who may publish, and a history of every change; nothing a third party can slip in.

Want a website like these?

Tell us what your visitors need to do. You will hear back from the person who will design and build it.

Contact us