SkillHub

Skills julianoczkowski designer-skills

Designer Skills Bundle of 7 skills

Use it when:
You prototype or build interfaces with an agent and want it to follow a design process instead of jumping straight to code.
It does:
Settles decisions, writes a brief, plans structure, sets tokens, splits the work into tasks, builds in a named aesthetic and reviews the result.
You get:
A brief, information architecture, a task list and a screenshot-backed review in .design/<feature>/, tokens in your project's styles, and the built pages.
Start with:
design-flow, which runs the steps in order, lets you skip any and asks before each next one.
Review needs:
Playwright MCP or Cursor's built-in browser for screenshots, or screenshots you supply.

TL;DR

Julian Oczkowski's skills for designers who prototype and build with AI coding tools. Each step also runs alone, and design-flow strings them together with a confirmation between phases. grill-me, which comes with the install but isn't listed here, questions you about the plan; design-brief turns that into a brief after scanning the codebase's existing tokens and components; information-architecture adds a site map, navigation, content priority and user flows; design-tokens derives light and dark tokens from the brief's aesthetic philosophy and writes them into your Tailwind config, CSS or theme file; brief-to-tasks orders the work into vertical slices; frontend-design builds them, mobile-first with dark mode, in one of eight named philosophies such as Dieter Rams, Swiss or Neo-Memphis; design-review, run only when you ask, screenshots the running app at three widths and lists must-fix, should-fix and could-improve issues against the brief, each with a suggested fix. The brief, information architecture, task list and review share one .design/<feature>/ folder, so later steps pick up earlier decisions and features don't overwrite each other. The skills that plan or build first scan your project for existing tokens, themes and components, and extend them rather than replace them.

Summarizes the repo at c259656.

Any agent, with the skills CLI, which asks which of the repo's 8 skills to add and for which agents; pick grill-me too for design-flow's first phase

npx skills add julianoczkowski/designer-skills

Claude Code plugin, with all 8 of the repo's skills, grill-me included; they're namespaced, as /designer-skills:design-brief

claude plugin marketplace add julianoczkowski/designer-skills && claude plugin install designer-skills@designer-skills

Source on GitHubAll skills from julianoczkowski/designer-skills

Total Downloads
6,100 of information-architecture, its most installed skill, on skills.sh, Nov 9, 2026
Repo stars
601 julianoczkowski/designer-skills
First seen
Mar 28, 2026 on skills.sh, its first skill

Its skills, in the order they're used

The ones marked “Only in the bundle” need the rest of it. The others also work alone.

  1. design-flow

    Only in the bundle 5.3K total downloads

    Walks you through the whole designer workflow in order, from grilling and brief to tokens, tasks and build, confirming each phase before the next.

    Reads and follows the other skills' SKILL.md files one phase at a time, so alone it has no phases to run. Its first phase, grill-me, isn't listed here: the Claude Code plugin includes it, and the skills CLI offers it among the repo's skills.

  2. design-brief

    5.4K total downloads

    Interviews you about a feature or page, scans your codebase's existing styles and components, and writes a design brief.

  3. information-architecture

    6.1K total downloads

    Plans a product's or site's structure before visual design: site map, navigation, content priority, user flows, naming and URL rules.

  4. design-tokens

    6.1K total downloads

    Generates design tokens with light and dark palettes and spacing, type, layout and motion scales, in your stack's format, from an aesthetic philosophy.

  5. brief-to-tasks

    5.3K total downloads

    Breaks a design brief into an ordered checklist of vertical slices, each built, styled and made interactive in one task.

  6. frontend-design

    5.6K total downloads

    Builds frontend interfaces in one of eight named aesthetic philosophies, mobile-first with dark mode, reusing the components and tokens your codebase already has.

  7. design-review

    5.9K total downloads

    Critiques a built interface against its design brief, from screenshots at three widths and the code, and saves a prioritized fix list.