# harness 브랜드 에셋 디자인 의뢰서 (for Stitch) > **의뢰 목적:** 본 저장소의 기존 브랜드 에셋 4종(`harness_banner.png`·`harness_icon.png`·`harness_social.png`·`harness_team.png`)을 기준으로, > 동일한 마스코트·톤을 유지하면서 **일관된 브랜드 시스템으로 재정비(리파인·확장)**한 신규 에셋을 제작한다. > 각 에셋 섹션의 **Stitch Prompt** 블록을 그대로 복사해 의뢰에 사용한다. --- ## 1. 브랜드 개요 | 항목 | 내용 | |------|------| | 프로젝트 | **harness** — Claude Code 에이전트 팀 & 스킬 하네스 마켓플레이스 (`ythong`) | | 마스코트 | **하네스(안전벨트+공구벨트)를 착용한 주황색 꽃게** — "에이전트에게 하네스를 채워 일을 시킨다"는 은유 | | 핵심 컨셉 | 개발 자동화 · 에이전트 팀 협업 · 도구(스킬) 장착 | | 톤 & 무드 | 친근하고 귀여운 카툰, 그러나 개발 도구다운 정돈됨. 유치하지 않게 채도·라인 정리 | | 금지 | 실존 기업/제품 로고, 워터마크, 사진 합성, 과도한 그라데이션·이펙트 | ### 1-1. 마스코트 공통 스펙 (전 에셋 동일 유지 — 가장 중요) - **몸체:** 둥근 타원형 꽃게, 주황–레드 (#E8542F 계열), 배 부분은 밝은 살구색 (#F6C29A) - **하네스:** 검정(#2B2B2B) X자 어깨 스트랩 + 허리 벨트, 회색 버클. 용도별 변형 허용(공구벨트/클립보드/렌치 파우치) - **눈:** 크고 둥근 눈(흰자+검은 동공+하이라이트), 항상 미소 - **다리:** 좌우 3~4개, 집게 2개 - **스타일:** 두꺼운 다크 아웃라인의 플랫 벡터 카툰 (셀 셰이딩 최소화) ### 1-2. 컬러 팔레트 | 역할 | HEX (근사) | 사용처 | |------|-----------|--------| | Primary — Crab Orange | `#E8542F` | 마스코트 몸체, 포인트 | | Primary Light | `#F6C29A` | 마스코트 배, 보조 면 | | Ink — Harness Black | `#2B2B2B` | 스트랩, 아웃라인, 텍스트 | | Brand Navy | `#2B3AA0` | 아이콘 배경 원, 딥 포인트 | | Sky Blue | `#7EB3E8 → #4A72C4` | 배너 배경 그라데이션 | | Pale Blue | `#CFE4F5` | 팀/설명 일러스트 배경 | | Accent Yellow | `#FFC72C` | 번개·기어·별 등 장식 아이콘 | | Neon Cyan | `#3DF5E0` | 연결선·워크플로우 경로 | | Social Orange | `#F2622E` | 소셜 카드 단색 배경 | ### 1-3. 타이포그래피 (텍스트 포함 에셋) - 로고타입/헤드라인: 굵은 라운드 산세리프 (예: Baloo·Fredoka 계열 느낌), 대문자 `HARNESS` - 본문/캡션: 중립 산세리프. 한글 병기 시 Pretendard - 텍스트는 요청된 에셋에만 넣는다 (아이콘·팀 일러스트는 텍스트 없음) --- ## 2. 에셋별 의뢰 명세 ### 2-1. `harness_banner.png` — GitHub/Gitea 저장소 배너 | 항목 | 현행 | 요청 | |------|------|------| | 크기 | 2752×1536 (16:9 근사) | 동일 비율, 3840×2160 마스터 + 1280×640(GitHub social preview) 크롭 | | 구성 | 공구벨트 하네스를 찬 꽃게가 중앙, 주변에 ``·번개·기어·아톰 아이콘 부유, 하단 글로우 테크 플랫폼, 파란 그라데이션 배경 | 구도 유지. 장식 아이콘 수를 줄여 여백 확보(좌우 텍스트 오버레이 공간), 아웃라인 스타일을 2-3(소셜)과 통일 | **Stitch Prompt:** ``` Wide 16:9 hero banner for a developer tool called "harness". A cute cartoon crab mascot (rounded orange-red body #E8542F, light peach belly, big glossy eyes, friendly smile) wearing a black X-shaped safety harness with a tool belt holding tiny wrench, hammer, pliers and gears. Bold dark outlines, flat vector cartoon style, minimal cel shading. Centered composition, crab standing on a subtle glowing circuit platform. A few floating flat icons around it: code brackets , lightning bolt, gear, atom — accent yellow #FFC72C and light blue, keep them sparse so the left and right sides stay clean for text overlay. Background: smooth vertical gradient from #7EB3E8 to #4A72C4. No text, no watermark, no logos. ``` ### 2-2. `harness_icon.png` — 플러그인/앱 아이콘 | 항목 | 현행 | 요청 | |------|------|------| | 크기 | 2048×2048 | 2048 마스터 + 512/256/128/64/32 리사이즈, 32px에서도 식별 가능 | | 구성 | 남색(#2B3AA0) 원 안에 극단순화된 꽃게 + 검정 X 하네스 스트랩·버클, 흰 배경 | 실루엣 유지. 소형 사이즈용으로 디테일(버클 문양) 단계별 제거한 단순화 버전 동시 제작. 원형·사각(라운드 코너) 2종 | **Stitch Prompt:** ``` Minimal flat app icon. A simplified cute crab (solid orange-red #E8542F, two dot eyes with white highlights, tiny smile, two claws) wearing a black X-cross harness strap with a small gray buckle, centered inside a solid deep navy circle #2B3AA0 on a white background. Flat vector, no gradients, no outline noise, maximum 5 colors, legible at 32x32 pixels. Also provide a rounded-square background variant. No text. ``` ### 2-3. `harness_social.png` — 소셜/커뮤니티 카드 | 항목 | 현행 | 요청 | |------|------|------| | 크기 | 2048×2048 (1:1) | 1:1 유지 + 1200×630(OG 카드) 가로 변형 1종 | | 구성 | 주황 단색 배경, 윙크+엄지척 꽃게, 검정 하네스(카라비너·파우치), 말풍선 "HARNESS!" | 스타일 기준 에셋. 이 두꺼운 아웃라인·스티커 감성을 전 에셋의 통일 기준으로 삼는다. 말풍선 텍스트는 `HARNESS!` 유지 | **Stitch Prompt:** ``` Square sticker-style illustration on a solid orange background #F2622E. A cheerful cartoon crab winking and giving a thumbs-up, wearing a detailed black climbing/safety harness (shoulder straps, waist belt, small pouches, one tiny orange carabiner). Very thick black outlines, bold flat colors, subtle blush on cheeks, one sparkle. A white speech bubble with bold black uppercase text "HARNESS!". Playful mascot sticker aesthetic, high contrast, centered, no other text, no watermark. ``` ### 2-4. `harness_team.png` — 에이전트 팀 일러스트 | 항목 | 현행 | 요청 | |------|------|------| | 크기 | 2752×1536 | 동일 비율 마스터 | | 구성 | 연파랑 아이소메트릭 그리드 위 꽃게 3마리(검정 하네스=분석가+돋보기·태블릿 / 파랑 하네스=엔지니어+렌치·기판 / 초록 하네스=QA+클립보드·체크), 네온 시안 삼각 경로로 연결 | **4번째 꽃게 추가** — 보라 하네스 + 지휘봉(오케스트레이터). 삼각형 → 다이아몬드 경로로 확장. 하네스 색 = 역할 코드(검정 분석·파랑 개발·초록 QA·보라 지휘) 유지 | **Stitch Prompt:** ``` Wide 16:9 flat illustration of four cute cartoon crabs collaborating as an agent team on a pale blue isometric grid background #CFE4F5. Each crab wears a different colored harness that encodes its role: (1) black harness crab holding a magnifying glass over a small tablet = analyst, (2) blue harness crab with two wrenches assembling a gear circuit board = engineer, (3) green harness crab holding a clipboard with green checkmarks and a pencil = QA, (4) purple harness crab at the top holding a tiny conductor baton = orchestrator. They are connected by a glowing neon cyan diamond-shaped workflow path #3DF5E0 with small arrows. Same mascot design language: rounded orange-red bodies #E8542F, big friendly eyes, bold dark outlines, flat vector cartoon style. Sparse sparkles only, no text, no watermark. ``` --- ## 3. 확장 에셋 (옵션 — 여력 시) | 에셋 | 용도 | 가이드 | |------|------|--------| | 플러그인 배지 3종 | `zio-harness`·`proposal-builder`·`zioinfo` 카탈로그 썸네일 | 2-2 아이콘 프레임 재사용, 하네스 색/소품만 변경(풀스택=파랑+렌치, 제안서=노랑+문서, PM·PMO=보라+클립보드) | | 빈 상태(empty state) 일러스트 | 문서/웹 | 하네스를 손에 든 꽃게가 "장착 대기" 포즈, 연파랑 배경 | | 로딩 스피너 | 웹 | 기어를 굴리는 꽃게 미니 루프(스프라이트 시트) | --- ## 4. 납품 규격 & 검수 기준 **납품 형식** - 원본: SVG 또는 레이어 보존 파일(가능한 경우) + PNG(투명 배경 버전 포함) - 각 에셋 규격: §2의 크기 열 참조. 색상 프로파일 sRGB **검수 기준 (전부 충족 시 승인)** 1. 마스코트 4요소(몸체 색·하네스·눈·아웃라인)가 4종 에셋에서 동일 캐릭터로 인지될 것 — §1-1 2. 팔레트 이탈 색 없음(±10% 명도 허용) — §1-2 3. 아이콘 32px 축소 시 실루엣 식별 가능 — §2-2 4. 텍스트는 §2-3의 `HARNESS!` 외 삽입 금지, 워터마크·외부 로고 없음 5. 팀 일러스트의 역할-색 코드(검정·파랑·초록·보라) 정확 — §2-4 **참조 원본:** 저장소 루트 `harness_banner.png` · `harness_icon.png` · `harness_social.png` · `harness_team.png` | 문서 이력 | | |------|------| | 2026-07-17 | 최초 작성 — 기존 PNG 4종 분석 기반 Stitch 의뢰서 생성 |