[Expansion entry]
[To write: what was added, what surface drove it, what it unblocked.]
Design system — maintenance and expansion log
Two systems, two different skills. At Aurascape I build and maintain the design system under the main platform — components, variants, and auto-layout, kept scalable as the product grows, and proven by its changelog rather than its launch. At Aswaat I founded one from zero: tokens, components, documentation, and status tracking, built alone.
- [N]
- [N]
- [N] (est.)
- [N]
The audit collage
Every variant of one component found in the wild, screenshotted into one board, beside the rationalized set that replaced them.
[PLACEHOLDER] Audit collage — every variant of one component found in the wild beside the rationalized set
The changelog
A cut of the real changelog — twelve rows beats sixty.
| Date | Component | Change | Reason | Affected | |
|---|---|---|---|---|---|
| [DATE] | [COMPONENT] | [CHANGE] | [REASON] | [AFFECTED] | |
| [DATE] | [COMPONENT] | [CHANGE] | [REASON] | [AFFECTED] | |
| [DATE] | [COMPONENT] | [CHANGE] | [REASON] | [AFFECTED] |
What I expanded
Maintenance keeps a system alive; expansion is a different skill. As the platform grew new surfaces — agent views, MCP catalogs and explorers — the system grew the components to absorb them.
[Expansion entry]
[To write: what was added, what surface drove it, what it unblocked.]
Token architecture
Primitive → semantic → component, with the naming rules — and the one rule I had to break.
[PLACEHOLDER] Token architecture diagram — primitive to semantic to component tiers
Governance
Intake, contribution path, deprecation process, release cadence — the part of a design system almost nobody shows, and the part that separates a maintainer from someone who drew components once.
[PLACEHOLDER] Component intake form
[PLACEHOLDER] Deprecation process diagram
Migration story
[To write: ~200 words on the GT America typography rollout — scope, sequencing, how live screens kept working, what broke anyway.]
From zero — the Aswaat system
The other side of the skill: founding a system with nobody to hand it to you — tokens, components, and documentation for a mobile Mushaf app, built alone and configured in Figma to scale past v1.
Rather than screenshot the rest, the pieces below are rendered live from the system's own variables — the semantic color tokens and the Inter type ramp every component inherits:
Brand
button-brand-default
#049597
primary-600
#027778
Surface
background-container
#313237
background-object
#484951
Text
text-title
#fdfdfd
text-caption
#d9d9dc
Grey ramp
grey-500
#8d8f9b
grey-700
#484951
grey-800
#313237
Search for your Riwaayah
Reset to Hafs
Kufa · Recitation
Location
Those tokens resolve into components. Here is Sidecar, the Qari and Riwaayah selector, rebuilt from the same values — a genuinely hard bit of domain modelling: a qari can carry several riwaayaat, one is the fixed base, and you compare the rest against it, all inside one dark, space-constrained panel.
- Selected state — the active qari carries primary-600, so the current reading is unmistakable against the dark list.
- Riwaayaat nest under their qari on a connector line. Hafs is fixed as the base layer every other reading overlays for comparison — its checkbox is locked, which is exactly what Reset to Hafs returns you to.
- Multi-select by design: check several riwaayaat to compare them at once, rather than a single-choice radio.