Loading
About the Project

Designing the Internet, From the First Click

TechArab is an Australian Internet Service Provider — and we designed every screen of their platform. Not a landing page, not a branding refresh — the full product. Every customer flow, every operator tool, every edge case that a real ISP has to handle. The result is a complete UI/UX system that is ready to build.

The Full ISP Experience

An ISP platform has more surface area than most products. A customer arrives knowing nothing and needs to understand what plans are available, what they include, and what it costs — then sign up, get connected, and manage their service from that point forward. TechArab's design covers every stage of that journey:

  • Plan discovery & comparison — structured, scannable plan pages that let a new customer choose with confidence
  • Onboarding & activation flow — a guided setup that takes a customer from signup through to a live connection, step by step
  • Customer account portal — usage tracking, billing history, invoice downloads, plan upgrades, and support access, all in one place
  • Support & ticketing — a self-service support flow with ticket creation, status tracking, and live chat integration
  • Network status & notifications — real-time outage alerts and scheduled maintenance notices so customers always know what is happening with their connection

Operator & Admin Tools

Behind the customer experience, TechArab's team needs to operate the business. The design includes a full operator interface — customer management, plan and pricing administration, order and activation processing, support queue management, and network status publishing. Every tool the team needs to run a modern ISP, designed for the people who use it every day.

Designed for Australia

Australian internet infrastructure has its own characteristics — NBN plan types, speed tiers, Fair Use Policies, and regulatory requirements around billing and disclosure. The design accounts for all of them, so the platform communicates correctly with Australian customers and meets local expectations.

  • Service Plan Discovery & Comparison Pages
  • Guided Customer Onboarding & Activation Flow
  • Customer Account Portal — Usage, Billing & Plan Management
  • Real-Time Usage Tracking & Data Meter
  • Billing & Invoice Management
  • Plan Upgrade & Change Flow
  • Support Ticket Creation & Status Tracking
  • Live Chat Integration
  • Network Status & Outage Notifications
  • Scheduled Maintenance Alerts
  • Operator Dashboard — Customer & Order Management
  • Plan & Pricing Administration
  • Support Queue Management for Operators
  • Network Status Publishing Tool
TechArab

How It Was Built

Our process
01 .
Discovery & Requirements Mapping

Mapped the full scope of the platform with TechArab — every customer flow, every operator function, and every ISP-specific requirement. Australian NBN plan structures, speed tiers, billing disclosure rules, and Fair Use Policies were documented and factored into the design from the start, not retrofitted later.

02 .
Information Architecture & User Flows

Designed the full information architecture — how the platform is organised, how customers move through it, and how operator tools are structured. Every major flow was mapped before any screen was designed: signup, activation, billing, support, and account management. Edge cases were identified early: what happens when a customer's address has no coverage, when a payment fails, when a service is disrupted.

03 .
Wireframing & Interaction Design

Produced detailed wireframes for every screen in the platform — customer-facing and operator-facing. Interaction patterns were defined at this stage: how filtering works on plan pages, how the activation stepper behaves, how usage data is visualised, how support tickets are created and updated. The wireframes were detailed enough to hand to any development team without ambiguity.

04 .
Visual Design & Design System

Developed TechArab's visual identity into a full design system — colour, typography, spacing, component library, icon set, and illustration style. Every component was designed once and reused consistently across all screens: buttons, form inputs, data tables, status badges, modals, and notification patterns. The system was built to scale as the platform grows.

05 .
High-Fidelity Screens & Prototype

Delivered high-fidelity designs for every screen in the platform — all customer flows, all operator tools, all states and variants. An interactive prototype was produced for key flows so TechArab could walk through the experience end-to-end before development began. All assets were delivered in a structured Figma file, organised by section and ready for handoff.

TechArab preview
Project Insights

Behind the
decisions we made.

ISP Complexity Is Mostly Hidden — Until Someone Has to Design It

From the outside, an ISP platform looks simple: pick a plan, sign up, pay monthly. In practice it is one of the more complex consumer products to design well. Address coverage checks that have to happen before a customer can even see a relevant plan. Activation flows that depend on the type of connection being installed. Billing cycles that do not always align with activation dates. Speed tiers that need explanation without becoming a technical lecture. Every one of these had to be designed through — not around — and the result is a platform that handles the complexity without surfacing it to the customer unnecessarily.

Designing for Both Sides of the Same Product

TechArab is a single platform with two very different audiences: customers who interact with it occasionally, when something needs attention; and operators who use it all day, every day. A design that works beautifully for a customer checking their bill can be frustrating for an operator who needs to process fifty orders before lunch. The operator tools were designed independently, with their own logic and priorities — density, speed, and keyboard-friendly interactions — rather than being styled-down versions of the customer interface.

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Get In TouchStar

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us

Contact Us