레스토랑 브랜드 팔레트은(는) 무엇을 하나요?

레스토랑의 시각적 증거를 작고 접근성 높은 웹사이트 색상 시스템으로 변환합니다. 반복되는 간판, 로고, 메뉴 및 실내 색상을 증거로 취급합니다. 최종 토큰 역할과 비율은 증거를 보존하면서 웹사이트의 가독성을 유지해야 하는 설계 결정으로 간주합니다.

색상을 추출하거나 선택하기 전에 참고자료/브랜드-팔레트-플레이북.md를 읽으세요. 재사용 가능한 조합군을 선택할 때는 참고자료/팔레트-조합.md을 읽으세요. 에셋/브랜드-팔레트-템플릿.json을 복사하고, 기록되지 않은 팔레트를 새로 만들지 말고 에셋/팔레트-콤보-라이브러리.json을 사용하세요.

모드 선택

추출: 의도를 결정하지 않고 선택한 이미지 영역에서 후보 견본을 샘플링합니다.
감사: 색상을 브랜드 앵커, 보조 색상, 중성 색상, 우발적 색상 또는 거부된 노이즈로 분류합니다.
생성: 하나의 앵커, 하나의 조합군 및 완전한 웹사이트 토큰 시스템을 선택합니다.
새로고침: 증거 또는 대비를 재확인하고 기존 팔레트 잠금을 업데이트하되, 레이아웃 구조는 변경하지 않습니다.
검토: 미리보기를 렌더링하고, 필요한 모든 쌍을 검증하며, 통합 계약을 보고합니다.

$restaurant-demo-builder가 레시피, 레이아웃 문법, 대상 및 전환 목표를 선택하도록 합니다. 이 스킬은 정체성 증거가 확립된 후, 시각적 스타일링이 최종 확정되기 전에 사용하세요. $restaurant-exterior-image-studio가 매장 전면 자산을 생성하도록 합니다. 이 스킬은 색상 증거를 위해 그 원본 사실 소스를 검사할 수 있지만, AI가 리스타일링한 출력을 새로운 브랜드 진실로 간주해서는 안 됩니다.

팔레트 잠금 준비

brand-palette.json을 데모 연구 기록 또는 레시피 잠금 옆에 저장하세요. 다음을 기록합니다:

레스토랑 정체성 및 증거 출처;
관찰된 색상, 영역, 출처 ID, 신뢰도 및 분류;
거부된 색상 및 거부 이유;
선택된 앵커 및 재사용 가능한 조합 ID;
관찰된 색상에서 웹사이트 토큰으로의 유도;
필요한 전경/배경 쌍;
의도된 색상 비율 및 사용 참고 사항;
검토 상태 및 결과가 증거에서 유래되었는지 명확히 표시된 대체인지 여부.

소스 URL, 확인 날짜 및 SHA-256 값을 보관하세요. API 토큰이나 개인 자격 증명을 절대 저장하지 마세요.

샘플링 전 증거 검사

반복적이고 정체성을 나타내는 표면을 우선시합니다:

공식 로고 또는 워드마크;
매장 전면 간판, 차양 또는 의도적인 외관 페인트;
인쇄된 메뉴 제목, 규칙 및 브랜드 패널;
반복되는 실내 벽, 부스, 타일 또는 서비스 카운터 색상;
포장, 유니폼 또는 소셜 그래픽(현재 레스토랑 정체성이 확인된 경우에만).

음식 색상, 피부, 하늘, 구름, 나무, 잔디, 아스팔트, 인근 업소, 반사, 임시 장식, 화면 광, 따뜻한 전구, 깊은 카메라 그림자 및 자동 화이트 밸런스 오류는 거부하거나 분리하세요. "가장 흔한 픽셀"을 브랜드 색상으로 선택하지 마세요.

view_image로 각 출처를 검사합니다. 정확한 샘플링이 유용한 경우, 확인된 브랜드 영역만 자릅니다:

python3 <palette-skill>/scripts/extract_swatches.py \
  --image <source-image> \
  --crop <left> <top> <right> <bottom> \
  --colors 8 \
  --output <work-order>/sampled-storefront-colors.json

스크립트는 픽셀을 보고하며 브랜드 의미를 보고하지 않습니다. 샘플링된 색상을 승격하기 전에 왜 관련이 있는지 기록하세요.

하나의 앵커와 조합군 선택

반복적이고 신뢰도 높은 증거에서 앵커를 선택합니다. 한 장의 사진 내 반복보다는 간판과 메뉴처럼 두 가지 다른 출처 유형 간의 일치를 선호합니다. 깨끗하고 소유주가 제어하는 로고나 메뉴가 하나만 있는 경우, 영역이 모호하지 않다면 충분할 수 있습니다.

앵커가 페이지의 대부분을 덮도록 강요하지 마세요. 앵커를 작업, 제목, 규칙 또는 구조적 밴드의 브랜드 중심으로 취급하세요. 음식, 메뉴 텍스트 및 안내를 쉽게 스캔할 수 있도록 조용한 캔버스와 표면 중성을 유도하세요. 70 / 20 / 10 캔버스-표면 / 구조 / 강조 비율은 시작점일 뿐이며 고정 공식이 아닙니다.

콤보 라이브러리에서 가장 가까운 군을 선택한 후, 그 역할을 증거에 맞게 조정하세요. 라이브러리는 역할 및 조화 가이드일 뿐, 레스토랑 브랜딩의 증거가 아닙니다. 모든 어둡게, 밝게, 채도 감소 또는 중성화를 derivations에 기록하세요. 색조 변화는 제한하세요. 가독성이나 조화를 위해 다른 색조가 필요한 경우, 보조 색상으로만 사용하고 선택 이유를 설명하세요.

신뢰할 수 있는 브랜드 색상이 없을 때는 레시피와 호환되는 중성 대체 색상을 사용하고, selection.mode를 recipe-fallback으로 설정하며, 팔레트를 창의적 제안으로 표시하세요. 레스토랑에서 비롯되었다고 주장하지 마세요.

웹사이트 토큰 구축

템플릿에 모든 토큰(캔버스, 표면, 본문 텍스트, 흐린 텍스트, 기본 작업, 호버 상태, 작업 위 텍스트, 강조, 강조 위 텍스트, 테두리, 컨트롤 테두리 및 포커스)을 제공합니다. 가능하면 앵커를 primary의 출처로 사용하되, 텍스트 대비에 필요한 경우 어둡게 하거나 밝게 합니다.

일반 텍스트, 큰 텍스트 및 비텍스트 컨트롤에 대해 필요한 쌍을 기록합니다. 일반 텍스트는 4.5:1, 큰 텍스트는 3:1, 의미 있는 컨트롤 또는 포커스 경계는 3:1을 검증합니다. 선택됨, 오류 또는 가용성 상태를 전달하기 위해 색상에만 의존하지 마세요.

토큰 작업 전에 증거 게이트를 실행하고, 모든 토큰이 완료된 후에 인도 게이트를 실행합니다:

python3 <palette-skill>/scripts/validate_palette.py \
  --palette <demo>/brand-palette.json \
  --combo-library <palette-skill>/assets/palette-combo-library.json \
  --stage evidence

python3 <palette-skill>/scripts/validate_palette.py \
  --palette <demo>/brand-palette.json \
  --combo-library <palette-skill>/assets/palette-combo-library.json \
  --stage handoff

통합 전 미리보기

토큰, 버튼, 메뉴 행, 증명 표면 및 측정된 쌍을 보여주는 독립형 미리보기를 렌더링합니다:

python3 <palette-skill>/scripts/render_palette_preview.py \
  --palette <demo>/brand-palette.json \
  --out <demo>/brand-palette-preview.html

미리보기를 시각적으로 검사합니다. 결과가 레스토랑의 느낌을 주고, 앵커 색상의 차별화되지 않은 벽이 되지 않으며, 음식 식욕을 유지하고, 흐린 텍스트가 모바일에서도 읽을 수 있는지 확인합니다.

데모 빌더로 전달

검증된 brand-palette.json, 미리보기 및 다음 제약 조건을 $restaurant-demo-builder에 전달합니다:

선택된 레시피와 레이아웃 핑거프린트 보존;
기록된 토큰을 임시 16진수 값 대신 CSS 변수에 매핑;
기록된 역할과 비율에 따라 앵커 사용;
사진 색상 등급을 UI 색상과 분리 유지;
토큰 변경 후 팔레트 검증 재실행;
데스크톱과 모바일에서 이미지 위의 텍스트와 모든 버튼 상태를 포함하여 시각적으로 확인.

팔레트 선택이 기존 페이지 구조를 강제하거나 검증된 레스토랑 증거를 무시하지 않도록 합니다. 레이아웃, 브랜드 색상 및 사진은 최종 데모에서 만나는 별도의 잠금입니다.

인계

허용 및 거부된 증거 색상, 앵커 신뢰도, 선택된 조합, 토큰 유도, 측정된 대비 결과, 미리보기 경로, 대체 상태 및 소유자 확인 질문을 보고합니다. 명시적 승인 없이 게시하거나 레스토랑에 연락하지 마세요.

예시 호출

$restaurant-brand-palette 이 매장 전면, 메뉴 및 식당 사진을 검사하고 웹사이트 팔레트 잠금을 생성하세요.
$restaurant-brand-palette 실제 브랜드 색상을 추출하고 조명이나 환경으로 거부한 사진 색상을 설명하세요.
$restaurant-brand-palette 이 데모 팔레트를 검토하고, 약한 조합을 수리한 후 검증된 CSS 역할을 restaurant-demo-builder에 전달하세요.

레스토랑 브랜드 팔레트