NOD Studio
Work
App DevelopmentUI Design

Courier

A browser-based API client with auth helpers, request history, timing metadata, and a mobile-first response viewer.

Client

Personal

Year

2025

Courier — designed card showing the mobile request and response interface.

The Brief

Courier is a self-initiated project built around a very specific frustration: modern API tools often feel heavier than the job requires. The goal was to create something fast, focused, and browser-based — no account, no install, no unnecessary clutter. Just open it and test a request.

Rather than competing with enterprise tooling on feature count, Courier was designed as a deliberate constraint exercise: build the core workflow well, make it feel polished, and keep the interface moving at the same speed as the user.

What It Does

Courier supports the full day-to-day request cycle you would expect from a lightweight API client. You can send GET, POST, PUT, DELETE, and PATCH requests, add and remove custom headers, work with request bodies, and inspect responses in a dedicated viewer with status and timing metadata.

Authentication is handled through a dedicated helper layer rather than being bolted on as an afterthought. The app supports Basic Auth, Bearer tokens, and OAuth2 client credentials, which makes it useful for real API testing rather than just public endpoint demos.

Request history is persisted locally, making it easy to revisit previous calls without signing into anything or saving to the cloud. On desktop, the response lives in a clean split-screen layout. On mobile, that same response experience becomes a draggable bottom sheet so the interface still feels purposeful on a smaller screen.

Design Decisions

The two-panel layout creates an immediate visual separation between input and output: white on the left for composing requests, deep navy on the right for reading responses. That contrast helps the app feel fast to parse, even before a user has clicked anything.

The red brand accent (#ed1c24) gives Courier a stronger product identity than the neutral, utilitarian styling that dominates most developer tooling. Monospace text is used where it earns its place, labels stay clear and restrained, and the interface avoids chrome that does not help the workflow.

The mobile response viewer was an important design decision. Rather than squeezing a desktop metaphor into a narrow screen, the bottom sheet pattern makes the response feel native to the device while preserving the same send-review-reset loop.

Stack

Built with React, TypeScript, Tailwind CSS, and Vite, then deployed to Vercel. The project focuses on a clean frontend experience, persistent local history, and a responsive interface that behaves like a purpose-built product rather than a stripped-down clone.

Courier — full interface

Have a project in mind?

Let's make something thoughtful.