← 목록
기타 2026-07-12 4KB 읽기 4분

크라우니 웹스킨 디자인도구 기초분석 (web.crowny.org)

개요

web.crowny.org에서 홈페이지 제작 스킨(개당 165크라우니달러, 기본 30개)을 고르게 하는 "크라우니 디자인도구"의 기초 데이터 구축. 클로드 디자인과 동일 기능 + 더 한국적·더 인터랙티브가 목표.

무엇을 했는지 (울트라 워크플로 25에이전트, 에러 0)

  1. 카페24 스킨 2종 완전학습 (opus·xhigh ×2): ~/Downloads/박민주_카페24__lunare(8페이지)·07서지원_카페24_RIPE(7페이지+영상). 페이지 전수 정독 + 핵심 이미지 직접 열람 → 디자인DNA(토큰·레이아웃 패턴·이미지 배치 규칙·정량 비율·AI 이미지 재생성 프롬프트 템플릿) 추출.
  2. 18기 포트폴리오 22사이트 정량 스크리닝 (sonnet ×22): 팀플 8 + 개인 14. 코드 실측(KB·브레이크포인트·팔레트·폰트·애니메이션·라이브러리) + 비율 분석(히어로 종횡비·그리드 열·타이포 스케일) + 7축 가중채점(interaction·code 가중 2.0, 총 100점).
  3. 교차종합 (opus·xhigh): 순위 + 기법매트릭스 34 + 취업 시그널 + 30스킨 라인업 + 도구 아키텍처.

핵심 발견

  • 순위 상위: 김혜영 84(듀얼커서+Lenis+비대칭 에디토리얼) > 이윤서 81(취업, GSAP 핀 케이스스터디) > 우희진 80(취업, CSS변수 3계층 SSOT) > 서지원-aiflow 79.5(취업) > 강양정 79.
  • 취업 시그널(n=6, 상관): 취업완료 평균 78.1 vs 미표기 70.3. GSAP ScrollTrigger 채택 취업완료 100% vs 미표기 31%. 인터랙션 점수 8.75 vs 6.875. clamp 유체 반응형+prefers-reduced-motion 가드가 취업완료 전원 공통. → 스크롤 연동 엔진 = 사실상 필수 자격증.
  • 기법매트릭스 34: 재사용성 10 = :root 토큰 SSOT(색8개 스왑=완전 리스킨)·clamp 유체·aspect-ratio CLS0·keep-all+text-wrap:pretty·reduced-motion 가드·hover zoom.
  • 30스킨 라인업: 뷰티·패션·음식(다이닝/카페/배달)·의료(치과/에스테틱/한방)·피트니스·네일/헤어·포트폴리오·테크·교육·키즈·부동산·전문가·웨딩·이벤트·여행·커뮤니티·펫·B2B 전 업종 커버. base_dna = lunare/RIPE 직계 + 우수 포폴 기법 조합. 각 스킨 165CRD 가치 근거 명시.
  • 도구 아키텍처: 클로드 디자인 6기능 대응 매핑(자연어 생성→기존 연결추론.sh 재사용, 토큰 슬라이더 리스킨, 기법 토글 컴포넌트) + 한국적 차별화(Pretendard/Paperlogy/손글씨 폰트페어, keep-all 자동, 상담 퀵패널 기본) + 인터랙티브 차별화(스크롤 시네마틱 라이트/헤비 티어, 커스텀 커서, graceful degradation 3중) + 9단계 생성 파이프라인 + 4상 품질게이트(포폴 채점 rubric 역적용, 임계=취업완료 기준선 78+).

관련 파일

  • 자산 루트: /Users/ef/crowny-webskin/
  • 스킨DNA/lunare.json(35KB)·스킨DNA/RIPE.json(27KB) — 생성기용 디자인DNA
  • 분석/*.json ×22 — 사이트별 정량분석
  • 종합분석.json(41KB) — 순위·매트릭스·라인업·아키텍처 정본
  • 스킨라인업30.psv·기법매트릭스.psv·포폴순위.psv — 기계가독 자산
  • 스킨도구.한선/스킨도구.toau — 한선씨 조회 도구(학습DB 등록: 웹스킨자산조회도구)
  • 워크플로 스크립트: 세션 workflows/scripts/webskin-foundation-analysis-wf_b76dccbd-043.js (Run wf_b76dccbd-043)
  • 요청 원문: 2026-07-12-요청-web-crowny-스킨30-디자인도구.md
  • 잔여 이슈 (다음 단계)

    1. 스킨 30개 실생산 파이프라인 미구현 — 라인업·DNA는 설계 완료, 자연어→한선씨→HTML 자동생성 + 4상 게이트 배선이 다음 단계 핵심.
    2. web.crowny.org 포트 미등록 — 서비스 배선 시 crowny-ports.sh freeset 필요. 신규 도메인 HTTPS는 stunnel SAN 함정(abti SAN expand) 주의.
    3. 분석 공백: 실렌더 스크린샷 미검수(정적 코드 metric만)·SPA 4종 렌더 DOM 미측정·성능(LCP/FPS) 미측정·카페24 실판매 스킨 가격 벤치마크 부재·접근성 실주행 미검증.
    4. 취업 시그널은 표본 6, 상관이지 인과 아님.