Skip to content

Capability 01

Websites and digital platforms

Public sites, portals and product surfaces built for people first and readable by search engines and AI agents second.

Problem and opportunity

Most business websites stop at presentation

A brochure site describes a company. A digital platform does work: it qualifies enquiries, routes them into operations, records evidence and stays legible to the systems that now read the web on a visitor's behalf.

  • Enquiries arrive without context and are re-typed into other tools.
  • Content is trapped in components that crawlers and assistants cannot extract.
  • Nobody can say which pages produce qualified conversations.

What Hapis delivers

Scope of delivery

Positioning and content structure

We work out who the page is for, the decision it supports and the proof it needs, then write copy that survives review by a technical buyer.

Design system and front end

A tokenised design system, typed components and accessible interaction patterns, built in React and TypeScript for long-term maintenance.

Operational wiring

Forms, briefs and enquiries connect to the tools your team already uses, with clear states for loading, empty, error and success.

Search, answer and agent readiness

Semantic markup, route-level metadata, structured data and crawlable body copy so search engines and AI assistants can quote you accurately.

How the system works

The layers behind the interface

Each layer has a defined responsibility, so the system can be extended without rewriting what already works.

  1. 01

    Content model

    Pages, entities and relationships defined before layout, so structure drives the design.

  2. 02

    Interface layer

    Reusable sections and primitives, responsive from small screens upward.

  3. 03

    Service layer

    Typed contracts between the interface and any backend, keeping page components thin.

  4. 04

    Evidence layer

    Analytics, enquiry tracking and quality checks that show what the site is actually doing.

Integration and architecture

Where it connects

  • Static and server-rendered delivery on modern hosting.
  • CMS or database-backed content when editing frequency justifies it.
  • CRM, email, WhatsApp and scheduling handoffs for enquiries.
  • Clean handover to GitHub for review and future development.

Use cases

Typical applications

Company and service sites

Multi-page sites where each service has a real page, its own metadata and its own conversion path.

Client portals

Authenticated areas for documents, project status and approvals, added once the public layer is stable.

Product and campaign surfaces

Focused pages for a launch, tender response or specific market segment.

These describe the shape of the work. Named client references are published only with written approval.

Delivery process

How a project runs

  1. 01

    Discover

    Objectives, audience, offer, constraints and existing assets.

  2. 02

    Design

    Structure, design system and key page compositions.

  3. 03

    Build

    Component build, content integration and accessibility work.

  4. 04

    Integrate

    Forms, analytics, metadata and any operational connections.

  5. 05

    Improve

    Measure, refine copy and structure, extend page by page.

Questions

Answered directly

Can you work with our existing brand?
Yes. We apply your identity within a technical design system rather than replacing it with a template.
Do we own the code?
Yes. Projects are structured for handover to your own GitHub organisation with typed, documented components.
How long does a first phase take?
It depends on page count and content readiness. We scope a first phase that can launch on its own, then extend.

Next

Tell us what you need to run better

Start a project brief