← Journey PHASE 5a — Design system: dani-ddweb

Design System Gets Its Own Address

design-systemstorybooktokensdani-ddweb

Photo by Hiroya Nakashima on Unsplash

The design-system repo is restructured under dani-ddweb, tokens are renamed to match the site, and Storybook confirms the Button component at storybook.artupinad.com.

The design-system repo had a generic default theme and a flat component structure that wasn’t going to scale across projects. Phase 5a fixes that: one named project, one folder, tokens that reflect the actual site.

■ ~/design-system/src
├─ projects/ new new top-level projects namespace
├─ projects/dani-ddweb/ new isolated project root
├─ projects/dani-ddweb/tokens/ new colors, type, spacing matching artupinad.com
├─ projects/dani-ddweb/components/ new ported component library
└─ projects/dani-ddweb/components/Button/ new Button component — first port

The default theme was renamed in place. Token files now carry the dani-ddweb prefix and the values — colors, type scale, spacing — are pulled directly from the artupinad.com design decisions rather than placeholder defaults.

Removed
  • src/tokens/default-theme.ts
  • src/components/Button/
Added
  • src/projects/dani-ddweb/tokens/index.ts
  • src/projects/dani-ddweb/components/Button/Button.tsx
  • src/projects/dani-ddweb/components/Button/Button.stories.tsx

Storybook at storybook.[domain] picks up the project automatically. The sidebar shows dani-ddweb as the active project and the Button story renders with the correct token values — background, radius, type — no overrides needed.

What this unblocks: any new component added under src/projects/dani-ddweb/components/ inherits the token set automatically. The next items — expanding the component library and wiring it to the actual site build — have a stable base to land on.