ATPL

Services · Design and quality

Interfaces people understand the first time.

For products and internal tools whose users will not read a manual. We design screens around the task and the data, test them with real users, and hand over a system, not a picture.

125+
Restaurants and cafés on Ethos
2013
Ethos live since
Start with a flowSee shipped sites

Finishable flows

Flows your operators can finish

Wireframes and UI built with the engineers who will ship them.

  • Interfaces for pressure

    Touch-first layouts for counters, floors and field work; Ethos’s billing screen was designed touch-first for café counters in 2013 and still is.

  • Design systems in code

    Components built in React or Vue as they are designed, so the handover is a working interface rather than a file of pictures.

  • Usability tests with your users

    Prototypes put in front of the cashier, the manager and the customer, with what confused them written down and fixed.

  • Accessibility and mobile first

    Readable contrast, keyboard paths and layouts designed on a phone screen first, because that is where most Indian users meet them.

Primary deliverable

Ships with the engagement

Live brief

01 · Lead outcome

Task-first screen design

Each screen designed from the job being done, and from the real records that will fill it, not placeholder text.

  • 01Interfaces for pressure
  • 02Design systems in code
  • 03Usability tests with your users
  • 04Accessibility and mobile first

Fighting the screen

Screens that fight the people who use them

Pretty mockups that die in development help nobody on the floor.

Start with a flow

  • Training

    Staff need a week of training for a screen they use for one job.

  • Overflow

    The app looks good in the pitch deck, but real data makes every table overflow.

  • Calls

    Users phone support for things the interface should have told them.

How it ships

Watch the job, then draw

We sit with users before any frame is praised in a meeting.

  1. flow/01

    Understand

    We watch the task being done today, time it, and note where people hesitate or ask a colleague.

  2. flow/02

    Design

    Wireframes come first, in black and white and over real data; visual design follows only once the flow is agreed.

  3. flow/03

    Build

    Designed components are built directly in the front end, so what you approved is what ships.

  4. flow/04

    Stay

    After launch we watch where users stall, in analytics and in support calls, and adjust the interface in the next release.

In production

Work we can put a name to — or the method we will use until we can.

Decide the shape

Design without the fluff

What you get, how it hands to build, and when a redesign is the wrong spend.

UX design decides what the screens do and in what order, from the user’s task; UI design decides how they look. ATPL does both as one job, because a beautiful screen that puts the common action three taps away is still a bad interface.

Yes. Ethos, ATPL’s restaurant billing system, was designed touch-first for café counters in 2013 and now runs in 125+ restaurants and cafés; that experience of designing for a queue and one free hand informs every operational interface ATPL builds.

A design engagement at ATPL for a product or internal tool typically runs two to six weeks and is quoted per project; when ATPL also builds the software, design is included in the build phases rather than billed separately.

Often, yes. Where the back end is sound, ATPL redesigns and rebuilds the front end against the existing data and APIs, releasing screen by screen so users are not switched to a new system overnight.

Chosen for the job

React · Next.js · Vue.js

Continue to