ZYWEN
Services
Marketplace
WorkAbout
Resources
Log inStart a project

Sergeant

A branding case study — a calm, nature-led identity for an AI accountability coach that remembers what you said and follows up at exactly the right moment.

Client
Sergeant
Industry
AI · Productivity
Services
Brand strategy, identity, UI direction
Deliverables
13-page guidelines, logo system, UI kit
Sergeant AI accountability coach branding case study cover by Zywen
01 — OVERVIEW

Discipline, quietly.

The Challenge

Productivity and coaching apps shout — neon streaks, trophies and guilt notifications. Sergeant had to feel firm enough to keep people accountable, but calm enough that they keep opening it.

The Goal

An identity that joins the structure of a sergeant with the steadiness of nature — one mark, one signal colour and a voice that is direct, calm and human.

Our Role

Brand strategy, logo design and construction, colour and type systems, photography direction, app icon and UI direction.

Timeline

8 weeks

Team

Brand designer, art director, copywriter

Methods

Founder workshop, moodboards, mark exploration

Platform

App, web & print

02 — DISCOVERY

We listened for the tone first.

Founder workshopMoodboardsCompetitor auditMark exploration

Primary Persona

Maya, the ambitious drifter

Plans big every Sunday, then drifts by Wednesday. Needs a follow-up at the right moment — not more reminders.

Goals

  • Keep small promises
  • Start, not plan
  • Feel steady progress

Frustrations

  • Guilt notifications
  • Loud, gamey apps
  • Tools that forget

Context

  • Mornings & deep work
  • Phone + laptop
  • Works alone
03 — BRAND IDEA

Three ideas, one mark.

Before

  1. 01Trophy icons
  2. 02Neon streaks
  3. 03Red badges
  4. 04Mascots
  5. 05Guilt copy
  6. 06Generic blue

The typical productivity brand: loud, gamified and a little guilt-driven.

After

  1. 01Rank
  2. 02Ridge
  3. 03Sun
  4. 04One mark
  5. 05One signal

Chevrons from a sergeant’s stripes, the same stroke as a mountain ridge and a sun clearing it — with mint as the only signal colour.

Every stroke carries meaning
Legible from 16 px to a billboard
Mint is the only signal colour
04 — PROCESS

Sketch first, polish later.

01WEEK 1–2

Discovery

Founder workshop, interviews, competitor audit.

02WEEK 2–3

Mark sketches

Chevron, ridge and sun explorations on a grid.

03WEEK 4–6

Identity

Logo system, colour, type and photography.

04WEEK 7

UI direction

App icon, light & dark UI and mission cards.

05WEEK 8

Guidelines

13-page guidelines and asset handoff.

SKETCH → FINAL — SYMBOL

Sergeant symbol from sketch to final — chevrons and a sun on a 4 px construction grid
Chevrons and a sun on a 4 px grid — every part measured from one ridge stroke (x).

SKETCH → FINAL — LOCKUP

Sergeant logo lockup from sketch to final — symbol with a calm grotesk wordmark
The symbol with a calm grotesk wordmark, and clear space equal to the sun.

SKETCH → FINAL — APP ICON

Sergeant app icon from sketch to final — white symbol on a forest gradient
A forest gradient and one white symbol; the sun stays mint on every surface.
05 — IDENTITY

A quiet identity, built to last.

Sergeant brand identity hero showing the forest and mint logo for the AI coach
Sergeant logo mark construction grid with chevrons, ridge and sun
Sergeant colour palette and typography — Forest, Mint and Geist type
Sergeant UI elements — buttons, chips and cards for the AI accountability app
Sergeant AI coach app screens in light and dark mode
Sergeant mission cards UI design for daily accountability goals
Sergeant app icon on a phone home screen
Overview of all 13 pages of the Sergeant brand guidelines
06 — VISUAL SYSTEM

Forest & Mint, sampled at first light.

Colour

Obsidian

#0C1311

Forest

#06221F

Jade

#1F7A5C

Mint

#6FCF9F

Sage

#B9D8C6

Type

Display — Geist Light

Data — Geist Mono · Signature — Shippori Mincho

Components

SURFACES

Sergeant Mist surface colour swatch
Mist
Sergeant Glass translucent surface swatch
Glass
Sergeant Forest gradient surface swatch
Forest
Sergeant Mint signal colour surface swatch
Signal

Ratio — 60 forest · 25 white · 10 sage · 5 mint

07 — COMPONENTS

Soft shapes, firm intent.

Sergeant button components — primary, secondary and ghost
Sergeant progress components for tracking goals
Sergeant AI coach message component
Sergeant tag and chip components
Sergeant toggle switch components
Sergeant mission card component for the accountability app
Sergeant text input components
Sergeant stat card components showing streaks and progress
Sergeant app icon variations in forest and mint
08 — ITERATION

Three rounds of review, each one quieter.

Round 01

Mark exploration

What We Tested

Does the symbol read as rank, ridge and sun — even at 16 px?

What Changed

Reduced it to two chevrons and a knocked-out sun on one stroke width.

Round 02

Colour & mood

What We Tested

Does the palette feel calm without losing energy?

What Changed

Moved to Forest & Mint, with mint as the only signal colour.

Round 03

Voice & UI

What We Tested

Does the coach feel firm, but never guilt-tripping?

What Changed

Wrote direct, human copy and quiet, glassy UI for missions.

LET’S BUILD

Have something
worth building?

Hire our studio to design, build and grow it — or start faster with a product from the Zywen Marketplace.

Zywen studio project cards