華國美學 UIUX 스킬
roc-aesthetic은 라우팅 및 설치를 위한 내부 스킬 ID입니다.
이것을 ROC 시대 대만 「화국 미학」 프론트엔드 UIUX 생성, 수정, 검토 및 스타일 진단을 위한 단일 진입점으로 사용하십시오.
이 스킬은 대만 공공 정보 시스템, 오래된 포털 사이트, 저예산 공지 페이지, 낡은 업체 유지보수 대시보드, 즉흥적인 시민 시각 레이어와 같은 인터페이스를 만들어야 하는 에이전트를 위한 것입니다.
향수 필터, 패러디 생성기, 또는 무작위 고장 UI 기계가 아닙니다. 이것은 디자인 규율입니다:
- 빽빽하고 실용적인 정보 구조를 유지하십시오.
- 깔끔한 카드보다 테이블, 프레임, 사이드바, 경계선이 있는 섹션을 선택하십시오.
- 사용성을 해치지 않는 범위에서 작고 축적된 불일치를 도입하십시오.
- UI 사본이 필요할 때는 진지한 관료적 전통 중국어를 작성하십시오.
- 사용자가 명시적으로 요청하지 않는 한 현대 SaaS의 세련미를 거부하십시오.
의도 라우팅
먼저 사용자의 요청을 분류한 다음, 가장 작은 유용한 규칙 파일 세트를 열고 따르십시오. Glob을 사용하여 파일을 확인하십시오. 이렇게 하면 스킬이 전역으로 설치되거나 이 리포지토리에서 사용될 때 모두 작동합니다. 절대 경로를 가정하지 마십시오.
핵심 진입 파일:
- 모든 프론트엔드 UI 생성, 수정, 검토 -> Glob
**/SYSTEM_PROMPT.md, 그 다음 Glob**/prompts/style.md - 철학 / 이것이 패러디가 되어서는 안 되는 이유 -> Glob
**/rules/philosophy.md - 반-모더니즘 / 부정 프롬프트 / SaaS 세련미 제거 -> Glob
**/rules/anti-modernism.md
시각 및 상호작용 차원:
- 레이아웃 / 페이지 구조 / 대시보드 / 포털 / 내비게이션 -> Glob
**/rules/layout.md - 간격 / 밀도 / 어색한 리듬 / 일관되지 않은 여백 -> Glob
**/rules/spacing.md - 미세한 불완전함 / 1px 어긋남 / 낡은 레거시 느낌 -> Glob
**/rules/micro-imperfections.md - 타이포그래피 / 폰트 스택 / 삐걱거리는 텍스트 / WordArt 제목 -> Glob
**/rules/typography.md - 색상 팔레트 / ROC 블루 / 경고 노랑 / 동일 색상 드리프트 -> Glob
**/rules/colors.md - 버튼 / 광택 / 경사진 / 낡은 시스템 컨트롤 -> Glob
**/rules/buttons.md - 테이블 / 행정 그리드 / 빽빽한 행 -> Glob
**/rules/tables.md - 배너 / 공지 스트립 / 티커 / 캠페인 헤더 -> Glob
**/rules/banners.md - 이미지 / 저해상도 / 압축된 / 어색한 크롭 -> Glob
**/rules/imagery.md
카피라이팅:
- 모든 UI 텍스트, 현지화, 레이블, 슬로건, 공지, CTA 문구, 또는 전통 중국어 사본 -> Glob
**/rules/copywriting.md
라우팅 규칙
- 일치하는 규칙 파일이 있을 때 이 파일만으로 답변하지 마십시오.
- 본격적인 프론트엔드 UI 작업 전에
SYSTEM_PROMPT.md와prompts/style.md를 여십시오. - 표시되는 UI 텍스트를 생성, 번역 또는 재작성할 때마다
rules/copywriting.md를 여십시오. - 결합된 UI 작업의 경우, 요청된 표면에 필요한 규칙 파일만 읽으십시오. 예: 양식이 있는 정부 포털 랜딩 페이지는 레이아웃, 간격, 타이포그래피, 색상, 버튼, 테이블, 배너 및 카피라이팅을 사용해야 합니다.
- 사용자가 검토를 요청하는 경우, UI가 너무 현대적이거나, 너무 비어 있거나, 너무 일관되거나, 너무 아이러니해진 부분을 먼저 진단한 후 변경 사항을 제안하십시오.
- 사용자가 '더 깔끔하게' 만들라고 요청하면, 명시적으로 스타일을 벗어나라고 요청하지 않는 한 ROC 미학을 유지하십시오. 더 깔끔하다는 것은 Vercel/Stripe/Linear처럼 보이는 것이 아니라 더 읽기 쉽고 실용적이라는 의미입니다.
- 사용자가 기존 UI를 제공하는 경우, 그 자리에서 수정하고 지역적 선택(더 빽빽한 그룹화, 더 많은 행정 레이블, 테이블과 유사한 구조, 미묘한 정렬 불일치, 레거시 색상 처리, 진지한 관료적 사본)을 통해 스타일을 강화하십시오.
- 의도적으로 사용할 수 없는 UI를 만들지 마십시오. '투박하지만 쓸 수 있음'이 무작위 고장보다 낫습니다.
- 미학을 인터넷 레트로 패러디, 밈 대만 정부 코스프레, 또는 농담 사본으로 바꾸지 마십시오. 어조는 진지해야 합니다.
작업 파일
작업 디렉토리에서 다음을 찾으십시오:
SYSTEM_PROMPT.md- 표준 시스템 프롬프트 및 품질 기준prompts/style.md- 단일 간결한 스타일 브리프rules/philosophy.md- 디자인 철학 및 역사적 자세rules/anti-modernism.md- 현대적 세련미에 대한 부정 프롬프트rules/layout.md- 다열, 프레임, 공지 위주의 레이아웃 지침rules/spacing.md- 빽빽하고, 일관되지 않으며, 업체가 패치한 간격 지침rules/micro-imperfections.md- 제어된 0.1px-1px 불완전함 지침rules/typography.md- 낡은 시스템 폰트 스택, 삐걱거리는 텍스트, WordArt 제목 지침rules/colors.md- ROC 블루, 채도 높은 빨강, 노랑, 은색, 싸구려 금색, 동일 색상 드리프트rules/buttons.md- 광택, 경사진, Windows-XP 스타일 버튼 처리rules/tables.md- 행정 테이블 및 그리드 처리rules/banners.md- 쌓인 배너, 공지 스트립, 티커 같은 표면rules/imagery.md- 압축되고, 어색하게 크롭되고, 저예산 이미지 처리rules/copywriting.md- 전통 중국어 관료적 UI 사본 지침README.md- 리포지토리 수준 요약.cursorrules및CLAUDE.md- 작업 공간 통합 노트
파일이 누락된 경우, 사용 가능한 가장 가까운 규칙 파일로 계속 진행하고 결과에 실질적으로 영향을 미칠 때 어떤 지침을 사용할 수 없었는지 말하십시오.
스타일 불변 속성
모든 ROC 미학 UI는 다음 불변 속성을 유지해야 합니다:
- 공백보다 밀도.
- 카드보다 테이블.
- 행정적 테두리, 회색 구분선, 중첩된 상자, 및 표시되는 섹션 프레임.
- 다열 레이아웃, 사이드바, 반복된 내비게이션, 공지 위주 구조.
- ROC 블루, 채도 높은 빨강, 경고 노랑, 은색 그라데이션, 진한 회색, 밝은 청록색 링크, 및 가끔 싸구려 금색.
- 혼합된 낡은 시스템 폰트 스택: MingLiU, PMingLiU, DFKai-SB, Microsoft JhengHei, Arial, Tahoma.
- 패딩, 마진, 테두리 두께, 호버 상태, 글꼴 강조, 정렬의 약간의 불일치.
- 형식적이고, 반복적이며, 과도하게 설명적이고, 진지하게 서비스 지향적인 느낌의 UI 사본.
- 조작적 명확성: 사용자는 여전히 읽고, 클릭하고, 스캔하고, 제출하고, 작업을 완료할 수 있습니다.
금지된 기본값
사용자가 명시적으로 요청하지 않는 한, 다음을 생성하지 마십시오:
- Apple 스타일 미니멀리즘
- Stripe, Linear, Vercel, 핀테크, 또는 현대 SaaS 랜딩 페이지 미학
- 과도한 공백, 탁 트인 히어로 섹션, 세 개의 카드 기능 레이아웃
- 프리미엄 타이포그래피, 럭셔리 에디토리얼 아트 디렉션, 또는 완벽한 디자인 시스템
- 완벽하게 균일한 4px/8px 간격 척도
- 최근에 투자받은 것처럼 보이는 부드러운 단색 대시보드
- 무작위로 고장난 UX, 읽을 수 없는 대비, 또는 가짜 비활성화 상호작용
- 패러디 사본, 밈 참조, 또는 냉소적인 레트로 농담
의심스러울 때는 '예쁘지만 현대적인 스타트업 인터페이스'보다 '추하지만 진지한 관료적 운영 시스템'을 선택하십시오.
도구 표면
이 메인 SKILL.md는 사용하는 읽기 전용 도구만 선언합니다:
Read- 일치하는 프롬프트 및 규칙 파일 열기Glob- 전역 스킬 설치 및 리포지토리 사본에서 파일 위치 확인Grep- 사용자가 좁은 디자인 차원에 대해 물을 때 특정 규칙 또는 용어 찾기
이 스킬은 자체적으로 쓰기 권한이 필요하지 않습니다. 호스트 코딩 에이전트는 사용자의 작업이 구현일 때 프로젝트 파일을 편집할 수 있지만, 이 스킬의 자체 라우팅 및 규칙 선택은 읽기 전용입니다.
출력 규율
이 스킬을 적용할 때:
- 개인 취향이 아닌 규칙 파일에 근거하여 권장 사항을 제시하십시오.
- 추상적인 형용사보다 구체적인 UI 변경을 선호하십시오.
- 적절할 때 주석과 사용자 대상 설명에 전통 중국어를 사용하십시오.
- 코드를 작성하는 경우, 기존 프레임워크와 컴포넌트 스타일을 유지하고 레이아웃, CSS, 마크업 밀도, 사본 및 작은 제어된 불일치를 통해 ROC 미학을 주입하십시오.
- 디자인 라이브러리를 사용하는 경우, 기본 프리미엄 청결함을 거부하십시오. 간격, 테두리, 타이포그래피, 색상 및 컴포넌트 리듬을 재정의하십시오.
- 인터페이스를 시각적으로 어색하게 만들더라도 접근성과 기본적인 사용성을 그대로 유지하십시오.
우선순위 및 충돌
지침이 충돌할 때는 다음 순서를 사용하십시오:
- 이 메인
SKILL.md- 라우팅, 불변 속성, 및 전역 규율 SYSTEM_PROMPT.md- 표준 미학적 자세 및 품질 기준prompts/style.md- 실제 UI 작업을 위한 간결한 생성 브리프rules/copywriting.md- 표시되는 UI 텍스트 및 전통 중국어 사본rules/*.md- 차원별 시각 및 레이아웃 규칙.cursorrules,CLAUDE.md, 및 리포지토리 README - 작업 공간 및 프로젝트 수준 알림
규칙으로 인해 UI를 사용할 수 없게 되는 경우, 사용성을 유지하고 대신 더 완화된 ROC 처리를 적용하십시오. 현대 컴포넌트 기본값이 이 스킬과 충돌하는 경우, 사용자가 명시적으로 현대 스타일을 요청하지 않는 한 이 스킬이 우선합니다.