Harmony Brain

designer-as-developer

2 min read

Designer-as-Developer

Definition

Expanding the role of designers to author and ship production code by providing better tooling (claude-code, Cursor) and structured training. At harmony-core this is becoming the default for the design team — not an exception. Practical enablers: a themable design system (vibe) that ships a Claude Code design-system + Figma library together, plus a curated set of Claude Code skills/commands the designers can use day-to-day.

Key characteristics

  • Progressive complexity: designers begin with UI-only fixes, expand to feature ownership, eventually own backend / architecture as needed.
  • Tooling-enabled: claude-code (with skills), vibe’s themed Figma + design-system handoff, MCP plugins (figma-use), shared context layers — together drop the entry barriers significantly.
  • Cohesion with engineering: the design team works in the same toolchain as engineering so values, conventions, and skills are shared.
  • Skills + commands flywheel: the team builds and shares Claude Code skills (e.g. superpowers, custom front-end rules) so practices accumulate rather than re-inventing per project.

Sources

  • ben — Head of Design at harmony.ai; driving the team’s adoption
  • ayala — Designer; first practitioner inside harmony.ai
  • yuval-ezov — Designer who pioneered the path; author of widely-recommended front-end rules at monday
  • elad — Vibe team lead; primary advisor on AI-first design tooling
  • claude-code — primary IDE/agent
  • vibe — design-system foundation that makes designer-authored code maintainable
  • brain-layer — context system that gives designers richer org/product context while coding

Active action items

  • AI-024 (in-Slack design agent), AI-025 (Claude Code skills adoption), AI-026 (Claude Code Visual access), AI-027 (Vibe theming experiment) — see ai-first-design-setup-2026-04-20

Evolution

  • 2026-03-15: Concept emerged as Yuval began taking UI fixes, expanded scope over time
  • 2026-04-20: Concrete tooling decisions taken for harmony.ai design team (Claude Code primary, Vibe atoms as foundation)

Graph View

Backlinks