크라우니AI 브라우저 — 디자인 기준 정리 완료 (재설계 UI)

개요

사장님 확정안(다운로드 크라우니AI브라우저.pptx 11슬라이드 + 크라우니 AI 브라우저 재설계/크라우니 브라우저 디자인 기준.dc.html)을 단일원본으로, CrownyBrowser의 디자인 파일 일체를 확정안 값에 완전 정합시키고 게이트 PASS로 잠갔다. 기능개선은 다른 세션 담당 — 이 세션은 디자인 파일만 끝내고 대기.

확정안 요약 (PPTX 11슬라이드)

팔레트: 크림 아이보리(#EFE7D8/#FAF6ED) × 다크 초콜릿(#2E211A/#201711) × 골드(#B4863B/다크 #D9A85C), 라이트/다크 2테마, Windows/macOS
절대 원칙: 4px 그리드 · 고정 높이(탭바40/툴바48/옴니36) · 타이포 6단계만 · 모든 컨트롤 4상태 · 입력위치=출력위치 · 이미지 의존 금지(벡터)
프레임: 탭34(r10, 72~240px) · 아이콘버튼32/아이콘20 · 북마크바32 · 다운로드바44 · 집사패널 340 고정 · 클릭최소 24×24 · 창최소 960×600 · mac 신호등 좌76 · win 창버튼 46×32×3
인터랙션: hover 80ms/−12% · pressed 즉시/−20%+scale.97 · 비활성 35% · 전환 ease-out 120ms · 포커스링 accent 1.5px+골드25% 3px
메뉴 항목32·패딩6·라운드12 / 다이얼로그 최대400·주버튼 우측끝 / 설정 사이드168·본문680·행패딩12·토글40×24 / 토스트 360 고정·항상 다크초콜릿·우하단24·4s(액션8s)

무엇을 했는지

디자인규격.psv 15→27행 확장 — 확정안 전 수치 등재(dl44·butler340·mi32·menu r12·dlg400·set-side168·set-body680·tgl40×24·toast360·tadd28·send44)
_측정.html 확장 — 셀렉터 24종 + hidden .screen 강제표시(화면2~4 측정 가능화)
GUI-구축-디자인기준.html 정합 수정 — 탭닫기 20→24(클릭최소), .add→.tadd 28, 툴바 pill/avatar 추가, AI홈 타일행(64/r18)+전송버튼44 추가, 메뉴패딩 8→6 교정, 화면1~3 요소에 측정 클래스 부여, 포커스링 추가
디자인SSOT.한선 생성기 완성 — 선언만 있던 다운로드바·집사폭 배선 + 메뉴/다이얼로그/설정/토스트/포커스링/비활성/win창버튼 섹션 추가 → tools/크라우니디자인.css(7.4KB) 산출
한선씨 동반 3건 신규(전부 진짜 생성기, 출력=현행 파일 byte 일치 검증)

- GUI-구축-디자인기준.한선 → 디자인규격.psv 생성(값 SSOT) - tools/_측정.한선 → _측정.html 생성 - tools/_스모크.한선 → _스모크.html 생성(생성 CSS 검증 픽스처)

게이트 PASS: GUI-구축-디자인기준.html 27/0 · _스모크.html(생성 CSS) 27/0 (기준선은 8/7이었음)
학습DB 등록 4건(브라우저_디자인SSOT_CSS생성 외 3)

체인 구조 (역방향 SSOT)

확정안 PPTX/dc.html (사장님, 수정금지)
  → GUI-구축-디자인기준.한선 ──생성→ tools/디자인규격.psv   (기대값)
  → 디자인SSOT.한선        ──생성→ tools/크라우니디자인.css (구현용 CSS)
  → tools/_측정.한선        ──생성→ tools/_측정.html         (실측 스니펫)
  → tools/_스모크.한선      ──생성→ tools/_스모크.html       (CSS 검증 픽스처)
게이트: tools/디자인대조.sh <html> — Chrome 실측 vs psv, 전항목 PASS 전 완료주장 금지

잔여 이슈 / 다음 세션 인수인계

기능개선 세션과 합류점: 네이티브(crowny-browser.m / 앱상주서버.한선 벡터렌더러)가 tools/크라우니디자인.css 값을 소비하도록 배선 필요. 규격 변경 시 psv·CSS 재생성 후 디자인대조.sh 재실행이 규율.
측정 불가 항목(정적 게이트 한계): 탭폭 가변 72~240, 인터랙션 타이밍(80/120ms), 토스트 4s/8s 소멸 — 구현 단계에서 별도 검증.
확정안 dc.html은 support.js 의존 클리핑 내보내기(클래스 없음) — 실측 게이트 대상 아님, 참조 전용 유지.

2차 수정 (같은 날 — 사장님 지적 반영)

1차는 수치만 맞추고 모양은 이전 목업 그대로였음(지적 정당). PPTX 슬라이드 3·4·9·10·11 목업 이미지를 직접 열람해 시각 전면 재작업:

새탭: 중앙 왕관 아이콘·타일 5종 라벨(크라우니집사=다크초콜릿+골드왕관)·전송 ↑버튼 입력창 내부·설명카드 3개 삭제·☆북마크·⋮세로점·⌥Space 칩·북마크바 3항목
브라우징: 본문=스켈레톤(web content 해치)·집사패널 왕관헤더+✕·사용자 말풍선 골드·"더 자세히/번역하기" 액션칩·메시지입력 내 ↑전송·다운로드바(아이콘칩·이름·진행바·용량·모두보기·✕)
메뉴: 구분선+방문기록/설정 항목, 설정: 사이드 4항목(일반 활성 칩)·행 2개, 토스트: 2종(✓완료/⚠오류)+골드 텍스트 액션

게이트 27/0 유지, _스모크.한선 meta 동기화. 스크린샷 4장 확정안 대조 육안검증 완료.

✅ 사장님 승인 (2026-07-12) — 디자인 확정

2차 수정본 "이대로 진행" 승인. 이 문서의 체인(생성기→psv/CSS→디자인대조.sh 27/0)이 크라우니AI 브라우저 UI의 확정 기준. 기능개선 세션은 tools/크라우니디자인.css + GUI-구축-디자인기준.html(4화면 목업)을 그대로 소비하면 됨. 이 세션은 대기.

3차 — 실제 브라우저에 디자인 입히기 (2026-07-12, "이 디자인에 크라우니AI를 입히기")

네이티브 크롬 확정 팔레트 (native/crowny-browser.m): kThemeMap dark=0x201711/0xF1E7D6/0xD9A85C·light=0xEFE7D8/0x2E211A/0xB4863B, 구 골드 C9A961 전량(24곳)→확정 골드, 구 배경 0x111111 전량(8곳)→초콜릿 계열, 집사로그 나=크림(구 파랑 제거). make 빌드 성공(에러 0, 443KB) — 실행 중 앱(36991) 비간섭, 새 바이너리 native/CrownyBrowser 대기. 배치=앱 재시작 필요(사장님 승인 시 mv 교체).
시작페이지 AI 홈 (bundle/start/index.html): 확정 목업 그대로(왕관·인사·입력창+내부 ↑전송·타일5 라벨) 재작성. 입력=네이티브 옴니 규칙 동기(URL→이동/그외 검색), 북마크·최근기록 crownyStartData 배선 보존. 타일: 집사→crowny://app/런처, 라이프→mind, 비즈→market, 프렌즈→play. 정적 파일 — 새 탭 열면 즉시 반영.
도구 신규: ~/.claude/scripts/html2hanseon.sh <html> — 정적 파일의 한선씨 동반 생성기 자동 산출+컴파일+byte diff 검증(장문 concat 분할로 RPN 254B 예방). GUI-현황·GUI-구축·_스모크·index 4건 동반 산출 완료.
게이트 확장: 디자인대조.sh  마커 — 페이지류 파일이 자기 규격만 선언(위양성 방지). index.html 4/0 PASS, GUI 목업 회귀 27/0 PASS.
psv 생성기는 tools/디자인규격생성.한선으로 이동(html 동반과 역할 분리).

잔여: 새 바이너리 배치(재시작 동반 — 지시 대기) · 집사 패널/설정 페이지 네이티브 UI는 기능개선 세션과 합류 지점.

4차 — 배치 완료 (사장님 "진행" 승인)

번들 바이너리(16:05 팔레트 이전 빌드, 타 세션 배치분)와 신규 빌드 cmp 비교 → 다름 확인 후 mv 교체(cp 금지 규칙). 이전 빌드는 native/CrownyBrowser.pre-palette.bak 보존.
구 인스턴스 TERM → 재기동 → 신규 PID 가동 확인. 이제 실행 중인 CrownyAI = 확정 팔레트 크롬 + 확정 AI 홈 새 탭.

5차 — 네이티브 크롬 실물 재구축 (사장님 "버튼이 안 바뀌었다" 지적 — 정당)

색만 바꾸고 위젯 형태를 안 바꿨던 것을 실물 재구축: crowny-browser.m

높이: 탭바 34→40 · 툴바 44→48 (확정 §3)
내비 버튼: 문자 글리프(◀▶↻)→SF Symbol 벡터(chevron.left/right·arrow.clockwise) 32×32
주소창: 28px r7→36px r18 + 1.5px 테두리(테마 border 토큰) + body 14
신규 위젯: 집사 알약 28(crown 심볼+집사, showButlerAI: 실배선) · 아바타 28(골드 원 '한')
탭: 폭 72~240, 라운드 10 상단만(maskedCorners), 활성=surface 토큰, 닫기 24×24(클릭최소), 라벨 ui 13
applyTheme: light/dark = 확정 토큰 정본(chrome/surface/input/border/text/accent 6종), 레거시 4테마=기존 파생 유지
새탭 버튼 28 r7. 빌드 에러 0 → CrownyAI.app 배치(mv) → 재기동 → 전체화면 캡처로 실물 확인(탭 형태·벡터 아이콘·알약·아바타 육안검증).

잔여: 런처/앱 화면(벡터 렌더 콘텐츠 영역)은 기능개선 세션의 8앱 이식 트랙에서 확정 팔레트 적용 필요. CrownyBrowser.app 바이너리는 이번 크롬 재구축 이전(20:22) 빌드 — 다음 배치 때 동기화.

6차 — 런처 카드 확정 팔레트 (기능세션 정지 후 이 세션이 인수)

drawRect 런처 분기(crowny-browser.m): 배경 0x15151A→content 0x171008, 무지개 원색 카드→surface 0x2B2016+border 0x3E3123 r18, 제목 흰색→text 0xF1E7D6(+앱별 액센스 10px 점으로 축소 유지), 설명→text2 0xA08B72, 학습배지→골드. 빌드0에러→배치→재기동→실화면 캡처 검증. 롤백체인: /tmp/CrownyAI.18-03.bak(크롬재구축 전)·/tmp/CrownyAI.chrome1.bak(런처팔레트 전)·native/CrownyBrowser.pre-palette.bak(팔레트 전). 잔여(다음 지시 대상): 벡터 앱 화면들(터미널·계산기·시계 등 앱상주서버.한선 렌더)의 팔레트 — 기능세션 정지 상태라 이 세션이 이어받을 수 있음.

← 이전크라우니AI 오피스(MS Office 대체) 탑재 계획2026-07-12-크라우니AI-오피스-탑재계획 다음 →크라우니검색 (search.crowny.org) — 구축 완료2026-07-12-크라우니검색-구축