Case study add-on
Everything ToDidIt needs to go to market, built once.
A design system tells a developer how to build the product. A brand library adds everything the business needs the moment it sells anything: logos on every ground, ads at IAB sizes, social kits per platform, lifecycle email and a voice with rules. We built it alongside the product, and every piece below is the real export.
Less to-do.
More to-did.
- 8
- Logo variants
- 6
- Brand colors
- 25
- Named motions
- 7
- Display ad units
- 18
- Social kit assets
- 20
- Carousel slides
- 41
- Email templates
Voice
Hype friend. Not enterprise software.
Every label, button, empty state and email passes the same voice check. It is written as rules, because rules survive a handoff and adjectives do not.
Core philosophy
Celebrate the did. Not the do.
ToDidIt is a task app built around your wins, not your unfinished work. Every completed task lives in your To-Did Log forever, an AI hype friend named Didi cheers you through the day, and a daily recap shows what you actually got done.
Less to-do. More to-did.
The pact with every user
- 01Your wins never disappear. Every completed task is logged forever, searchable, and yours.
- 02The app never makes you feel behind. Open it and the first thing you see is what you got done.
- 03Didi never acts alone. Suggestions are proposed. Humans confirm.
- 04Your data is yours. Export everything in JSON or CSV any time, no questions asked.
- 05We hype the wins, never the work to do.
Say
- “You did that.”
- “Look at you go.”
- “Nothing yet. Go do something awesome.”
- “Didi is cooking.”
Don't say
- “Task completed successfully.”
- “Great job today!”
- “You have 0 items in your list.”
- “Processing your request...”
- Never use em or en dashes.
- Never leave an orphaned or widowed word.
- Specific over generic.
- Hype the wins, never the work to do.
- Suggest, never act alone.
Palette
Six colors carry the whole brand.
Cream canvas, never pure white. Near-black text, never pure black. One orange, used like a spotlight. Select a swatch to copy it.
Typography
Three faces, one system.
Less to-do.
Bricolage Grotesque
Display and headings
Wordmark, h1 to h6, hero text. Tight tracking, weight 700.
Add a task, press Enter
Inter
UI and body
Buttons, labels, body and navigation. Weights 400 to 700.
You crushed it this week.
GT Alpina
Editorial accent
Pull quotes and win recap headlines. Italic only, sparingly.
GT Alpina is licensed for the product, so its specimen here is set in a stand-in serif.
Logos
Eight variants, each on the ground it was drawn for.
Every one exported as SVG plus four PNG sizes, so nobody screenshots a logo out of a slide again.
Motion
25 named motions, playing.
The shipped keyframes, not a recreation, so what plays here is what the product plays. Motion described in prose gets reinvented by whoever builds it next.
Tasks
9 animationsP1
P2
P3
2d
14
Fri
Due Friday
Projects
4 animationsLaunch the podcast
Progress100%
On track
Postmortem
Launch the podcast
14
Wins
3
Stuck
87%
On time
Didi & AI
4 animationsDidi drafts
Celebration
4 animations12
Day streak
0123
Today
Win Recap
You did 7 things.
System
4 animationsSarah crushed it.
3 tasks done in the launch project.
J
S
M
Synced
Nothing yet. Go do something awesome.
Display ads
Seven IAB units at their real size.
Each one animating, and each rendered at its true dimensions. The 300 by 250 below is genuinely 300 by 250. Every unit also exports as JPG and PNG.
Carousels
Three carousels, ready to post.
An educational set, a list and a feature introduction, each slide at 1080 by 1350 for Instagram and LinkedIn. Swipe or use the arrows.
Email
41 templates, rendering live.
Lifecycle, billing and editorial sends, designed and hand-coded by us before there were accounts to send them to. Pick a template, then drag the slider to compare the code with the email it renders.
Subject: Today's wins, all logged
Loading the source...
One kit per platform, at that platform's sizes.
Profile pictures, headers, covers and share cards for five networks, sized to each one's current spec, plus the app icon and favicon sets.