Muhammad BazilResume ↗
Back to home
Case study · 02Web · Mobile

Axontick

Giving an agentic-workflow company a website that explains a technical product in plain language — and converts on desktop and mobile alike.

RoleWeb Designer
ScopeLanding + Website
Duration3 weeks
FocusLanding · Responsive

At a glance

The 30-second version
  1. 01The problem

    A powerful agentic-workflow product hidden behind jargon on its old site.

  2. 02What I did

    Designed a responsive landing page and website that tells the story in four beats: hook, explain, prove, convert.

  3. 03The result

    A site a first-time visitor can understand in one scroll, consistent from desktop down to mobile.

Axontick landing page hero on an orange and black abstract background
12Sections designed
3Responsive breakpoints
1Unified design system
01 · Context

A powerful product, but a hard story to tell.

Axontick builds agentic workflow tooling — software that plans and runs multi-step tasks on a team's behalf. The idea is powerful but abstract, and the existing site buried it under jargon. The brief was a website that a non-technical visitor could understand in one scroll, without flattening what makes the product genuinely different.

Design challenge

Explain an agentic product simply enough for a first-time visitor, without losing the technical credibility that serious buyers look for.

  1. 01Make the core idea clear in the first screen
  2. 02Build credibility for a technical, still-early product
  3. 03Keep the experience fast and consistent on mobile
02 · UX strategy

From feature list to a story visitors follow.

A

Messaging

Worked with the founders to turn technical capability into a plain- language value proposition for the hero and section headlines.

B

Structure

Sequenced the page as hook, explanation, proof, and conversion — so depth is available without forcing every visitor through it.

C

Responsiveness

Designed every section mobile-first, then layered in the desktop composition so nothing feels like an afterthought at either size.

03 · The detail

The decisions behind the layout, not just the visuals.

Project snapshot
Product typeAgentic workflow tool
Target usersOps & product teams
DeliverablesLanding page, site, UI kit
Main goalClarity that converts
What visitors needed
  • A plain answer to “what does this actually do?”
  • Proof the product works, not just a description of it
  • A single, obvious next step at every scroll depth
  • A page that feels as considered as the product it's selling

The page's reading order

Hook → Explain → Prove → Convert
01

Hook

A one-line promise in the hero, backed by a single, concrete visual.

02

Explain

How the product works, broken into three plain-language steps.

03

Prove

Use cases and detail sections for visitors who want more depth.

04

Convert

One consistent call to action, repeated at every natural exit point.

04 · Interface design

A visual system built for clarity, speed, and technical trust.

The one-line hook

A single, concrete promise above the fold, paired with one visual instead of a wall of product screenshots.

How it works

The technical process reduced to three plain-language steps, each with its own supporting visual.

Mobile parity

Every section rebuilt for a single column without losing hierarchy or shortening the story.

05 · Key decision

Lead with features, or with a story?

Option A · Rejected

A feature list

List every capability up front so technical buyers see the full depth immediately.

Option B · Chosen

Hook → explain → prove → convert

One plain-language promise first, then how it works in three steps, then proof, with the CTA repeated at every exit point.

Why

Most visitors weren't technical buyers yet; a feature list asked them to understand the product before they cared about it. The story order earns attention first and still gives experts the depth further down.

06 · Outcome

A site that explains itself, and sells.

The final site reads clearly for a first-time visitor while still holding up under a technical buyer's scrutiny — one consistent story, one clear next step, and a responsive build that holds its composition from desktop down to a single mobile column.

Next case study · Fintech · MobileZar by Sarmaaya
(Contact)

Let's build
something great.

Book a callbazilwattoo9@gmail.com
Phone+92 311-1220252Based inIslamabad, PakistanTime zonePKT · UTC+5