Communitygithub.com

taste

라이브 웹 앱의 UI를 감사하고 개선하여 별도 브랜치에 복제본으로 제안합니다.

taste란 무엇인가요?

taste는 웹 애플리케이션의 UI를 체계적으로 감사하고 개선하는 AI 에이전트 스킬입니다. 개발 서버가 실행 중인 리포지토리의 UI를 검토, 정리, 수정 또는 개선해야 할 때 사용합니다. 이 스킬은 각 뷰를 캡처하고, 소스 위치를 포함한 발견 항목을 기록하며, 티어(A, AA, AAA) 기반 점수를 산출합니다. 그런 다음 원본 리포지토리에 직접 쓰지 않고 분석된 리포지토리의 클론을 새 브랜치에 생성하고, 변경 전후 비교 보고서를 작성합니다. taste는 수정, 정리, 개선, 편집, 생성의 5가지 모드를 지원하며, 각각 다른 작업 유형에 특화되어 있습니다. 또한 뷰별로 노이즈 기준을 적용하고, 각 발견 항목에 대해 UX/DX/AX 영향을 평가하여 거부 기준을 충족하는 항목은 자동으로 폐기합니다. 최종 출력물은 상세한 HTML 보고서로, 변경 전후 점수와 각 뷰 및 기준별 비교를 제공합니다. 개발자는 생성된 브랜치를 가져와 실제 리포지토리에 병합할 수 있습니다.

지원 대상✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/madebyjred-sudo/taste/tree/HEAD/skill

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

taste은(는) 무엇을 하나요?

라이브 웹 앱을 감사(뷰별 캡처, 소스 포함 발견 항목, 티어별 점수)하고 별도 브랜치가 있는 클론에 대한 대체 제안을 생성하며, 전후 보고서를 제공합니다. 분석된 리포지토리에는 절대 쓰지 않습니다.

사용 시기

  • 개발 서버가 있는 리포지토리의 인터페이스를 검토, 정리, 수정 또는 개선하라는 요청을 받은 경우.
  • 실제 리포지토리에 적용하기 전에 UI 변경 사항에 대한 시각적 증거를 원하는 경우.

프로필 및 세계

  • taste 리포지토리의 perfiles/REPO.json: mundo (shift | personal), perfil (libre | estricto), url, arranque, lecturas_permitidas (읽기 전용인 POST 요청 {metodo, ruta} 목록, 나머지는 차단됨), previo ({nombre, puerto, comando}: 서버 시작 전 필요한 항목, 예: 개발 데이터베이스에 대한 ssh 터널; taste는 포트가 닫혀 있으면 열고 자신이 연 것만 닫음), entorno (서버용 추가 변수: 쓰기 작업(예: 주기적 스윕)을 비활성화).
  • 한 번의 실행은 biblioteca/externa와 자체 세계의 라이브러리만 읽습니다. 다른 세계의 라이브러리는 절대 읽지 않습니다.
  • 엄격 모드(폐쇄형 브랜드의 클라이언트 제품): 토큰, 브랜드 또는 조각을 절대 변경하지 마십시오.

티어

A (최소), AA (기본값, A + AA), AAA (전체). 티어 점수는 해당 티어와 하위 티어의 발견 항목을 사용합니다.

다섯 가지 모드

모드기능
correccion레이아웃이나 조각을 변경하지 않고 발견 항목 수정
limpieza제거만 수행: 슬로건, 도움말 텍스트, 보조 레이블, 중복, 죽은 스타일; voseo를 tuteo로 변경, em-dash 제거
mejora현재 체계 내에서 개선
edicion--pedido TEXTO에 지정된 대로만 편집
creacion라이브러리에서 새 화면 또는 컴포넌트 생성

전체 프로세스

  1. taste MODO --repo RUTA --tier AA [--solo VISTA] [--agente ninguno|claude] [--pedido TEXTO] 감사 수행, 뷰별로 paquete/VISTA.md 작성, CORRIDA/arbol에 taste/AAAAMMDD-HHMM-MODO 브랜치로 클론하고 CORRIDA/TAREA.md 작성. ninguno를 사용하면 에이전트에 붙여넣을 문구를 출력합니다.
  2. TAREA.md와 각 패키지 읽기 (캡처, 파일:줄 단위 규칙별 발견 항목, 적용되는 규칙, 동일 패턴의 인스포 및 컴포넌트).
  3. CORRIDA/criterios.json 작성: 발견 항목 또는 동일 규칙 그룹당 하나. 각 기준에는 regla (reglas.json의 id 또는 inspo:ID), criterio (명령형 구문), por_que (출처 file:line 포함), ux, dx, ax (mejora | igual | empeora + 5 단어), accion, componente, archivos, estado, motivo_descarte가 포함됩니다.
    • UX, DX 또는 AX를 악화시키는 항목은 폐기됩니다(taste가 강제).
    • limpieza 모드에서 quitar가 아닌 모든 항목은 propuesto 상태가 됩니다.
  4. aplicado 상태인 항목만 트리에 적용하며, 기준 또는 그룹당 하나의 커밋을 만듭니다. 푸시하지 않습니다.
  5. 트리에서 타입 검사 실행 (tsconfig가 있으면 npx tsc --noEmit).
  6. taste comparar --corrida CORRIDA: 포트 + 1에서 트리 실행, 동일한 뷰 반복, capturas/despues에 캡처, 재감지, 가드 실행 및 informe.html 생성.

기본 노이즈

감사는 동일한 트리에서 각 뷰를 두 번 캡처하고 vista.ruido에 자체 변화량(실시간 데이터, 시계, 지연 로딩)을 저장합니다. 가드는 이 노이즈를 건드리지 않은 뷰의 0.5% 상한선에 추가합니다. --sin-ruido는 이 과정을 건너뜁니다(속도는 절반으로 빨라지지만 가드가 지나치게 엄격해짐). 각 캡처는 새 브라우저 컨텍스트를 사용하므로 클릭으로 인한 상태(localStorage의 접힌 막대)가 다음 뷰로 전달되지 않습니다.

보고서 읽기

  • 상단: 티어별 전체 점수(이전, 이후, 델타), 델타가 포함된 뷰 색인.
  • 뷰별: 데스크톱 및 모바일 이전/이후, 규칙, 출처, ux/dx/ax 및 상태가 포함된 각 기준.
  • no ok 가드 또는 음수 델타: 브랜치를 가져오지 마십시오. 이유를 확인하십시오.
  • 브랜치 가져오기: git fetch CORRIDA/arbol RAMA.

장면: 제품 표시 (Stageshow)

Taste는 실제 앱을 정리합니다. 표시용(랜딩 히어로, 기능 카드, 애니메이션 데모)으로는 Benji Taylor의 stageshow 스킬을 그대로 사용하며 Taste 규칙을 추가로 적용합니다. 별도의 명령어가 아닙니다.

  • 기본 프레임: gold finder-glass (씬 860 x 440, 윈도우 40/40/780/480으로 아래로 오버플로; 컴팩트 400 x 340, 윈도우 20/20/460/400으로 오른쪽과 아래로 오버플로; 반경 14; 브랜드 색상으로 다시 칠해진 3계층 배경). 지오메트리 및 캡처: biblioteca/externa/golds/marco-finder-glass.md.
  • 빌드 전, 테스트 세션(읽기 전용)으로 실제 앱 캡처하고 CSS에서 토큰 가져오기.
  • 승인된 장면 = 세계별 자체 gold, biblioteca/<mundo>/escenas/ 위치 (또는 두 번째 작업 세계의 경우 TASTE_BIBLIOTECA_SHIFT).
  • 연습: Stageshow의 film.mjs --gate는 검증이 아닌 참고용입니다(자체 gold에서 절반은 통과).
  • Taste로 정리한 후, 장면은 이미 정리된 화면 위에 구축됩니다: 먼저 제품, 그 다음 표시 방법.

주의 사항

  • 뷰가 오류를 반환하면 vista.error를 확인: bloqueada POST /api/...는 lecturas_permitidas에 없는 POST 읽기 요청을 나타냅니다(코드를 읽고 쓰지 않음을 확인한 경우에만 추가). 500은 일반적으로 데이터베이스 또는 다운된 터널 문제: previo의 메모를 corrida.notas에서 확인.
  • 트리는 원본의 node_modules를 링크합니다: 트리에서 종속성을 설치하지 마십시오.

관련 스킬