Skip to main content
ClaudeWave
Skill298 repo starsupdated 4d ago

design-logo

|

Install in Claude Code
Copy
git clone --depth 1 https://github.com/modu-ai/moai-cowork /tmp/design-logo && cp -r /tmp/design-logo/plugins/moai-designer/skills/design-logo ~/.claude/skills/design-logo
Then start a new Claude Code session; the skill loads automatically.

SKILL.md

# design-logo — 브랜드 정합 로고 생성

> `moai-designer` | 브랜드 컨텍스트 → 로고 타입 → 제약 → 생성 위임 → 정합 검증 (생성 실행: `moai-media`)

## 개요

로고는 브랜드의 가장 작고 가장 오래 쓰이는 자산이다. 히어로 이미지와 달리 16px 파비콘에서 빌보드까지 모든 크기에서 읽혀야 하고, 컬러·흑백·단색으로 변형되어야 한다. 그래서 로고는 래스터 비주얼이 아니라 **벡터/심볼**로 접근한다.

이 스킬은 생성 전에 프로젝트의 브랜드 컨텍스트(토큰·보이스)를 읽고, 로고 타입을 선택한 뒤, 그 값을 recraft 벡터 프롬프트 제약으로 바꾸어 생성으로 넘긴다.

## 하지 않는 것

- **이미지 생성 실행·모델 선택·비용 고지 안 함** — `moai-media:media-higgsfield-core` 계약에 위임한다(§5 생성 위임). 모델은 recraft_v4_1 벡터 계열이지만, 라이브 파라미터 조회·비용·폴링은 전부 위임처가 한다.
- **디자인 토큰 정의 안 함** — 토큰의 진실원은 프로젝트의 디자인 시스템이다. 이 스킬은 읽어서 쓸 뿐 새로 만들지 않는다.
- **사용자에게 직접 질문 안 함** — 슬롯이 비면 blocker를 반환하고 오케스트레이터가 확인한다.

## 트리거 키워드

로고, 브랜드 마크, 워드마크, 레터마크, 모노그램, 심볼, 로고타입, 픽토그램, 앱 아이콘, 파비콘, 로고 컨셉, 로고 아이디어, 로고 리디자인, 엠블럼, 콤비네이션 마크, 애브스트랙트 마크

## 참조 파일

| 파일 | 언제 |
|---|---|
| `references/logo-types.md` | 로고 타입 7종 분류와 "어떤 타입을 고를까" 선택 가이드 |
| `references/logo-craft.md` | recraft_v4_1 프롬프트 크래프트 · 디자이너 용어 사전 · R1/R3 적용 |
| `references/logo-principles.md` | 로고 5원칙 · 스케일러빌리티 · 변형 시스템 · 정합 검증 체크리스트 |

## 워크플로우

### 1단계 — 브랜드 컨텍스트 읽기

생성 프롬프트를 쓰기 **전에** 프로젝트의 진실원을 찾아 읽는다. 우선순위:

1. 디자인 시스템 핸드오프 디렉터리(토큰 CSS·화면 설계 원본·브랜드 규칙 문서)
2. `DESIGN.md` 또는 그에 준하는 브랜드 아이덴티티 문서
3. 토큰 파일(DTCG / CSS 변수 / shadcn 설정)
4. 브랜드 보이스 문서(보이스·금지 사항·마스코트 사용 규칙)

없으면 없는 대로 진행하되, **토큰 근거 없이 색을 지어내지 않는다.** 근거가 없다는 사실을 결과에 명시한다.

### 2단계 — 로고 타입 선택

사용자 요청과 브랜드 성격으로 로고 타입을 정한다 (`references/logo-types.md`의 선택 가이드 참조):

| 타입 | 어울릴 때 |
|---|---|
| 워드마크 | 이름이 짧·인지도가 있거나 이름 자체가 차별점 |
| 레터마크 | 이름이 길거나 두문어가 이미 익숙 |
| 심볼/픽토그램 | 보편적 형상이 브랜드와 연결될 때 |
| 애브스트랙트 | 구체 형상 없이 독자적 기하학적 마크 |
| 마스코트 | 캐릭터가 브랜드 인격 |
| 콤비네이션 | 심볼+워드마크 둘 다 필요 |
| 엠블럼 | 전통·공식·기관 이미지 |

사용자가 타입을 명시하지 않았고 브랜드 맥락만으로 정해지지 않으면, blocker로 2~3개 후보를 올려 오케스트레이터가 확인하게 한다. 한 번에 탐색하려면 콤비네이션으로 여러 컨셉을 `count` 병렬 생성하는 것도 유효하다.

### 3단계 — 제약으로 변환

읽은 브랜드 컨텍스트를 recraft 프롬프트 제약으로 바꾼다. 이 변환이 이 스킬의 핵심 산출이다.

| 브랜드 항목 | 프롬프트 제약 |
|---|---|
| 팔레트 | 정확한 색을 hex로 명시, 그 밖의 색조 금지 |
| 타이포 | 워드마크/레터마크면 폰트 성격(serif/sans/script/mono) |
| 형태 언어 | 각진/둥근, 기하학적/유기적 |
| 무드 | 차분한/대담한/따뜻한/장난기 |
| 금지 규칙 | 부정이 아니라 **긍정 서술**로 변환(→ 코어 R1) |

**금지 규칙 변환 주의:** "그라디언트 쓰지 마"를 그대로 넣으면 모델이 그라디언트에 주목한다. "flat solid fills only"처럼 원하는 것을 서술한다.

로고는 텍스트가 핵심인 경우가 많으니 **R3(리터럴 텍스트는 따옴표 + 폰트 지정)** 가 특히 중요하다 — 워드마크 "GLOW"는 *"the word 'GLOW' in a geometric sans-serif"* 처럼.

### 4단계 — recraft 프롬프트 조립

선택한 로고 타입과 제약으로 recraft_v4_1 프롬프트를 조립한다 (`references/logo-craft.md`):

- **global-to-local 구조**로 핵심 컨셉 → 형태 실루엣 → 레이아웃 → 컬러 → 무드 순으로 쌓는다.
- **디자이너 용어**를 쓴다: `contained mark`, `horizontal lockup`, `lettermark`, `negative space cutout`, `monoline style`, `serif letterforms`. 일상어("예쁜 로고")는 의도를 흐린다.
- **texture/material 언어를 피한다** — 벡터 로고는 "no texture, no gradients, consistent stroke"로 서술한다.
- **컬러는 프롬프트 + hex 병기** — "green and charcoal palette, deep green (#1b6e4a) with neutral charcoal (#2b2b2b)".

로고 탐색 단계면 `count: 4`로 여러 컨셉을 병렬 생성하는 것이 효과적이다.

### 5단계 — 생성 위임

조립한 프롬프트와 제약을 `moai-media:media-higgsfield-core` 계약에 넘긴다. 모델(recraft_v4_1) 선택·라이브 파라미터 조회(`models_explore`)·비용 프리플라이트(`get_cost`)·폴링(`job_status`)은 전부 그쪽이 한다.

> moai-media 미설치 시: 완성된 프롬프트를 텍스트로 출력하고 Higgsfield 웹(https://higgsfield.ai)에서 recraft 모델로 직접 생성하도록 안내한다. stock 이미지·래스터 아이콘·CSS 그라디언트로 대체 금지.

### 6단계 — 정합 검증

받은 로고를 **로고 특유의 기준**으로 점검한다 (`references/logo-principles.md`):

- **스케일러빌리티**: 작게 축소해도(파비콘 16px) 형태가 살아있는가
- **단순성**: 불필요한 디테일·텍스처가 없는가
- **변형 내성**: 실루엣(단색)으로 변형해도 인식되는가
- **팔레트 정합**: 브랜드 팔레트를 벗어나는가
- **텍스트**: 워드마크/레터마크라면 철자·레터링이 정확한가

어긋나면 제약을 강화해 재생성한다. **어긋난 로고를 "대체로 맞다"고 넘기지 않는다** — 로고는 근사치를 허용하지 않는 종류의 기준이다.

## 출력 형식

```
## 로고 결과
- 로고 타입: [워드마크 | 심볼 | 콤비네이션 | ...] · 컨셉 수: [N]
- 참조한 브랜드 컨텍스트: [읽은 파일 경로] (없으면 "근거 없음" 명시)
- 적용 제약: [팔레트 hex / 타이포 / 형태 언어 / 무드]
- 생성 위임: moai-media:media-higgsfield-core (recraft_v4_1)
- 결과 URL: [생성 결과들]
- 정합 점검: [통과 | 어긋난 항목과 조치]
- 권장 변형 산출: [컬러 / 흑백 / 단색 실루엣 / 앱 아이콘]
```

## 주의사항

- 로고는 벡터/심볼로 접근한다 — texture, material, photographic, "realistic" 언어를 쓰지 않는다.
- 토큰 근거 없이 색·폰트를 지어내지 않는다. 근거가 없으면 없다고 적는다.
- 금지 사항은 긍정 서술로 바꿔 넣는다(R1).
- 워드마크/레터마크 텍스트는 따옴표로 감싸고 폰트를 함께 지정한다(R3).
- 로고 안에 슬로건·부가 텍스트를 과도하게 넣지 않는다 — 작아지면 깨진다.
- 생성 비용·모델은 이 스킬이 정하지 않는다 — 위임처의 사전 고지 절차를 그대로 따른다.
- **AI 생성 결과는 벡터 마스터가 아니다.** recraft 출력은 픽셀/래스터일 수 있으므로, 최종 로고 마스터(SVG)는 별도 벡터화/트레이싱 후처리 단계임을 결과에 명시한다. 이 스킬은 컨셉 생성까지 담당한다.

## 관련 스킬

| 스킬 | 시점 |
|---|---|
| `moai-media:media-higgsfield-core` | 위임: 생성 실행·비용·모델 |
| `moai-media:media-higgsfield-image` | 인접: recraft 프롬프트 크래프트 SSOT |
| `moai-designer:design-brand-visual` | 형제: 히어로·OG·목업 비주얼 |
| `moai-designer:design-brand-system` | 선행: 브랜드 디자인 시스템 정의 |
| `moai-designer:design-slop-check` | 후속: AI 슬롭 점검 |

## 출처

- [Higgsfield MCP](https://higgsfield.ai/mcp) — 생성 실행 경로.
- [Recraft](https://www.recraft.ai) — 벡터/로고/아이콘 프롬프트 크래프트(1차). global-to-local 구조, 디자이너 용어 사전.
- [Higgsfield Skills (공식 agent 문서)](https://github.com/higgsfield-ai/skills) (MIT) — 로고 용도 구분 참고.
- 생성 계약·비용·모델 선택: `moai-media:media-higgsfield-core` 라이브 계약.
- 로고 타입 분류와 5원칙의 출처는 `references/logo-types.md`, `references/logo-principles.md` 각 파일에 명시.