스킬 자체의 표현으로
Baseline UI는 코드베이스에서 AI가 생성한 인터페이스의 조잡함을 막기 위해 확고한 UI 기준을 강제하는 리뷰 스킬입니다. React 프리미티브를 사용하는 Tailwind CSS 프로젝트를 대상으로 하며, 대화 내 UI 작업 전반에 적용되는 상시 제약 세트로 설치되거나, 파일 단위 리뷰 패스로 실행됩니다.
이 스킬의 특징은 사용하는 어휘의 구체성입니다. h-screen 대신 h-dvh, 헤딩에는 text-balance를 사용하는 것부터, 컴포지터 전용 애니메이션을 200ms로 제한하고 임의의 z-index 값을 금지하는 것까지, 사용하거나 피해야 할 정확한 유틸리티와 props를 명시합니다. 인터페이스를 빠르게 정리하거나 다듬어야 할 때 사용하십시오.
산출물
- 각 위반 사항이 왜 중요한지 한 문장으로 설명합니다.
- 각 발견 사항에 대한 구체적인 코드 수준의 수정안입니다.
작동 방식
- 01대화 전체에 적용되는 제약 조건 집합으로 호출하기
별도의 대상 없이 명령을 실행하면 해당 대화에서 수행되는 모든 UI 작업에 이 파일의 모든 제약 조건이 적용되며, 단일 파일에만 적용되지 않습니다.
- 02또는 단일 파일을 지정하기
파일 대상을 전달하면 스킬이 리뷰 모드로 전환되어 해당 파일을 아래에 나열된 모든 제약 조건과 비교하여 검사합니다.
- 03세 부분으로 구성된 위반 보고서를 반환하기
각 발견 사항은 문제가 되는 코드 조각을 인용하고, 왜 중요한지 한 문장으로 설명하며, 코드 수준의 수정안을 제안합니다.
- 04제약 조건 그룹을 순서대로 처리하기
이 파일은 규칙을 Stack, Components, Interaction, Animation, Typography, Layout, Performance, Design으로 구성하며, 각 그룹은 MUST, SHOULD, NEVER 항목을 혼합하여 포함합니다.