AAOA.studio · Case Study · Brand Identity · Component Kit

Mima Brand identity
for a social aggregator

Mima unifies friends across their existing networks, so the brief was trust: a mark that signals connection without possession.
401 logo explorations and 22 colour systems later, the identity ships as a living, token-based Component Kit, the brand delivered as code, not as a PDF.

2026 Brand Identity Component Kit 26 days mima.social ↗
0×
Logo variations explored
From sketch to vector
0
Colour palettes tested
Ube won with 60% of votes
0
Days of focused work
Across 2 sprints
0+
Lines of code delivered
Many more across branches

01 · Brief

Problem, constraint,
and the target audience

Mima is a social aggregator that pulls friends' posts, chats, and updates from every existing network into one unified view, with no new platform to join and no migration required. The brand constraint was unusually demanding: the identity had to resonate with a 16-year-old user while also earning trust from parents, investors, and tech press. This dual register meant being teen-voiced first and adult-readable second, punchy without being disposable.

Mima sits underneath existing networks rather than competing as one, so the tagline "Where your people are" anchored every decision that followed. Every brand output (the logo, the palette, the voice) had to satisfy that dual register: credible to a teen and to a boardroom, personal without being frivolous, distinct without fighting the platforms it lives alongside.

"The identity must work for a 16-year-old, their parents,
investors, and press, simultaneously."

Initial brief & mood board

02 · Logo

401 explorations,
one definitive mark

After 400+ iterations across three directional phases, the solution converged on a single continuous stroke: a loop with no beginning or end that reads as connection across a gap (which is exactly what the product does). The geometric and letterform directions were discarded because they were indistinguishable from standard app icons or read as another social network, neither of which suited a product that lives underneath platforms rather than as one.

The final mark can be drawn in one motion, animated along its own path, and holds up at any scale from 16px to billboard, properties that came from 140+ refinement passes on stroke weight, curve tension, endpoint radius, and cap behaviour. The stroke itself took about four seconds, a whiteboard gesture near the end of the first week. Making those four seconds survive at 16px took the other 140 passes.

Logo exploration, 401 variations
01
Geometric forms Circles, squares, intersections. Discarded, clean but cold, indistinguishable from standard app-icon language.
02
Letterform abstractions The M as structure: ligatures, stacked glyphs, negative-space plays. Discarded, too literal, read as another social network.
03
Gesture & continuous line Unbroken stroke, the breakthrough direction. Works at every scale, animatable along its path, readable at 16px.
04
Refinement 140+ passes on stroke weight, curve tension, endpoint radius, and cap behaviour. The mark's simplicity is the output of this work.

The delivered mark

Mark
Wordmark
Mark · Brand

03 · Colour

22 systems tested
Users validated the winner

Every network Mima aggregates has already staked a strong colour claim, so the palette could not compete and instead had to coexist. We developed 22 complete colour systems, each with its own logic, emotional register, and full 11-step token scale from 50 to 950, before shortlisting four finalists. The same discipline as the 401 logo explorations applied here: volume first, judgement second. The palettes ended up named after food (Ube, Matcha, Just Orange) because naming them after feelings had produced arguments in the studio, and naming them after food produced consensus.

Those four were presented to a representative user panel mirroring the brief's dual audience of teens and adults, using identical mock interfaces with no leading framing. 60% of users independently selected the Ube (lavender) palette, not because it was the safest choice or the conventional tech-startup direction but because it felt most personal to them. The vote gave the client a user-validated data point for investor conversations and confirmed that the audience wants to feel seen, not merely served.

"60% of users picked lavender. Not for its calm, because it felt like theirs."

Apply a palette, see the page change

Ube · winner · 60% user preference · 11 stops

50
100
200
300
400
500
600
700
800
900
950

Matcha · runner-up · tested palette #16

50
100
200
300
400
500
600
700
800
900
950

Glacier · tested palette #17

50
100
200
300
400
500
600
700
800
900
950

Just Orange · tested palette #11

50
100
200
300
400
500
600
700
800
900
950
The 22 palette candidates
Matcha, semantic token mapping

04 · Component Kit

Living token architecture
4,000+ lines delivered

The brand system was built on the same principle as the product itself: nothing is locked in. It is the mark's promise, connection without possession, applied to the engineering. Tokens replace hardcoded values, a theme-switchable CSS architecture lets any engineer extend the system without touching design files, and the styleguide lives in a browser rather than a paid Figma seat, making it accessible to the entire team.

The deliverables include the mark and wordmark family, 11-step colour scales, a full type scale, spacing and radius tokens, a component library, and a linked Ube styleguide: 4,000+ lines of code on the main branch, with considerably more across exploration branches, discarded palettes, animation curves, and layout approaches.

The system was built with Cursor and Claude Code. AI tooling is what made a living, browser-native Component Kit achievable inside a 26-day engagement, but the decisions that give the system its shape, the naming conventions, the 11-step scale structure, the semantic alias exposure, were design-led.

/* Token architecture, theme-switchable with a single attribute */
[data-theme="ube"] {
  --a-50: #f5f0f8;  /* surface tint */
  --a-500: #9b6fc4;  /* primary */
  --a-950: #22182e;  /* deep */
}
/* → same structure × 22 palettes = zero hardcoded values in components */

Live component preview

Mima

everyone migrated to bluesky and now i have to check five apps again. mima just connected all of them. literally why did this take so long

48 12 Save

turned on the Bubble a week ago. haven't seen a single reply from a stranger who wanted to ruin my day. this is just the internet being normal actually

401 26 Copy
Icon system, delivered set 124 icons
Delivered Component Kit, full overview
Logo family
Type scale
Colour tokens

Outcomes

Where your people are

Each phase of work was tested against the same dual audience, teens and the adults who fund, build, and report on the product. The brand does not rely on them liking different things. It relies on one set of decisions that works for both.

The user vote validated the palette, the mark passes every size and context test we could design, and the token architecture makes the system maintainable by any engineer without a Figma seat. "Where your people are" is the product premise in four words, and the Component Kit carries the same implication: Mima holds nothing of yours that isn't already yours.

View the styleguide