Communitygithub.com

julianoczkowski/디자인 브리프

대화형 인터뷰, 코드베이스 탐색 및 경험 디자인 결정을 통해 디자인 브리프를 생성합니다. 프로젝트에 마크다운 파일로 저장됩니다. 사용자가 디자인 브리프를 작성하거나, 새 기능이나 페이지를 계획하거나, UI 방향을 정의하거나, '브리프'를 언급할 때 사용하세요.

디자인 브리프란 무엇인가요?

이 스킬은 개발자와 AI 에이전트가 함께 협력하여 포괄적인 디자인 브리프를 작성할 수 있도록 설계된 대화형 도구입니다. 기존 코드베이스를 분석하고, 경험 디자인 원칙을 적용하며, 구조화된 인터뷰 프로세스를 통해 프로젝트 목표, 사용자 요구사항, 기능적 요구사항을 명확히 합니다. 생성된 브리프는 프로젝트 루트에 표준 마크다운 파일로 저장되어 팀 커뮤니케이션과 디자인 방향 설정의 기준점 역할을 합니다. 이 스킬은 Claude Code와 같은 AI 코딩 어시스턴트와 함께 사용하기에 적합하며, '디자인 브리프 작성해줘', '새 페이지 UI 계획', 'UX 방향 정의' 등의 명령어로 활성화할 수 있습니다. 특히 UI/UX 결정을 문서화하고, 사용자 여정을 정의하며, 파일 및 폴더 구조 권장사항을 포함하는 데 유용합니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/julianoczkowski/designer-skills/tree/main/skills/design-brief

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

디자인 브리프은(는) 무엇을 하나요?

대화형 인터뷰, 코드베이스 탐색 및 경험 디자인 결정을 통해 디자인 브리프를 생성합니다. 프로젝트에 마크다운 파일로 저장됩니다. 사용자가 디자인 브리프를 작성하거나, 새 기능이나 페이지를 계획하거나, UI 방향을 정의하거나, '브리프'를 언급할 때 사용하세요.

사용 방법

  1. AI 어시스턴트에게 디자인 브리프 작성해줘 또는 이 기능의 디자인 브리프를 만들어줘와 같이 요청합니다.
  2. 어시스턴트가 코드베이스를 탐색하고 대화형 질문을 통해 요구사항을 수집합니다.
  3. 브리프가 design-brief.md 파일로 프로젝트 루트에 저장됩니다.

주요 기능

  • 코드베이스 분석: 기존 프로젝트 구조와 코드 패턴을 자동으로 분석합니다.
  • 인터랙티브 인터뷰: 사용자에게 목표, 대상, 기능에 대한 질문을 합니다.
  • 경험 디자인 결정: UI/UX 원칙을 적용하여 최적의 사용자 경험을 제안합니다.
  • 마크다운 출력: 표준 마크다운 형식으로 읽기 쉽고 공유하기 쉬운 문서를 생성합니다.

생성되는 브리프 항목

  • 프로젝트 개요 및 목표
  • 대상 사용자 및 페르소나
  • 핵심 기능 요구사항
  • 사용자 여정 및 흐름
  • UI 디자인 방향
  • 기술 스택 제안
  • 성공 지표

참고

  • 이 스킬은 Claude Code, Cursor, Windsurf 등 다양한 AI 코딩 어시스턴트와 호환됩니다.
  • 생성된 브리프는 프로젝트 팀과 공유하거나 디자인 스프린트의 기준점으로 사용할 수 있습니다.

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

julianoczkowski/brief-to-tasks

Break a design brief into an ordered checklist of independently buildable tasks using vertical slices. Saves as a markdown checklist. Use when user wants to break down work, create tasks from a brief, plan implementation order, or mentions "tasks" or "breakdown".

julianoczkowski/design-flow

Run the full design-to-build workflow as a guided sequence. Orchestrates all designer skills in order, from grilling through review. Use when user wants to go through the complete design process, start a project from scratch, run the full flow, or mentions "design flow" or "full workflow".

julianoczkowski/design-review

Run a structured design critique against the brief and codebase. Checks visual hierarchy, consistency, responsiveness, accessibility, and aesthetic fidelity. Use when user wants a design review, critique, QA pass, polish pass, or mentions "review" after building.

julianoczkowski/design-tokens

Generate a design tokens file (CSS variables or Tailwind config) based on a chosen aesthetic philosophy, with light and dark mode palettes, spacing scale, type ramp, and component-level tokens. Use when starting a new project, establishing a visual system, setting up tokens, or mentions "tokens" or "design system".

julianoczkowski/frontend-design

Build distinctive, production-grade frontend interfaces with high design quality, guided by named aesthetic philosophies. Use when building components, pages, or applications. Generates working code with exceptional attention to aesthetic details and creative choices that avoid generic AI output.

julianoczkowski/grill-me

Interview the user relentlessly about a plan or design until reaching shared understanding, resolving each branch of the decision tree. Use when user wants to stress-test a plan, get grilled on their design, challenge an approach, or mentions "grill me".

julianoczkowski/information-architecture

Define the structural layer of a product or site before visual design begins. Covers navigation, content hierarchy, page structure, URL patterns, and user flows. Use when user wants to plan site structure, define navigation, map user flows, organize content, or mentions "IA" or "information architecture".

관련 스킬