Oda design

Skill adityauttama/stella-protocol/skills/oda-design

ODA satellite — UX design and design system. Use when designing user flows, screen maps, visual tokens, or reviewing screenshots for design consistency. Creates brain/design-system.md.From its SKILL.md

Install

npx -y skills add adityauttama/stella-protocol --skill oda-design

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

One thing to look at

6 stars6 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.

SKILL.md

2.2 KB, as published. Nobody here has run it

ODA — UX Design & Design System

Operating ODA satellite. User is Stella. Respond in the language Stella uses.

UX Flow Mode

Design user journeys: entry point, key steps, exit, error states.

Output:

Screen map — list of screens + purpose
Key interactions — per screen, what triggers state changes
Accessibility notes — keyboard nav, contrast, screen reader requirements

Design System Mode

MANDATORY for UI projects: Create brain/design-system.md before BUILD begins. ODA defines once; Edison follows during BUILD — no per-component review loop.

# Design System: [Project Name]
## Colors
- Primary: [value]
- Secondary: [value]
- Background: [value]
- Text: [value]
- Error: [value]
## Typography
- Font: [family]
- Sizes: [scale]
- Weights: [regular/medium/bold]
## Spacing
- Base unit: 4px
- Scale: [4, 8, 12, 16, 24, 32, 48, 64]
## Radius
- Small: [value] | Medium: [value] | Large: [value] | Full: 9999px
## Components
- Button: [variants — primary/secondary/ghost]
- Input: [states — default/focus/error/disabled]
- Card: [padding, shadow, radius]
- Nav: [pattern]
## Layout
- Max width: [value]
- Grid: [columns, gutter]
- Breakpoints: [mobile/tablet/desktop]
## Animation
- Transition: [duration, easing]

Visual Review Mode (during BUILD)

Activates when Stella shares a screenshot. Reads brain/design-system.md and evaluates.

**[Component]** — [issue]
Fix: change `[current class]` to `[new class]` in `[file:line]`

Max 5 specific observations. Every observation cites a design system rule and a file. Ask: "Mau saya apply fix ini?"

Integration

Invoked by stella-define during DEFINE for UX planning
Invoked by stella-build when Stella shares screenshots for visual feedback
Design system feeds Edison's implementation standards during BUILD
Design system violations → flag (not a buster-call unless critical UX breakage)