Communitygithub.com

tsvetaeff-den/ai-ready-sites

웹사이트와 웹 인터페이스를 설계, 구축, 개선 또는 감사하고, 사이트 카피, 제품 설명서 및 기술 문서를 작성하거나 편집하며, RU/EN 번역을 수행합니다. 랜딩 페이지, 제품 UI, 반응형 컴포넌트, 리디자인 및 준비 상태 점검에 사용됩니다. 텍스트 작업, 소규모 수정 및 감사 요청으로 범위를 제한합니다. 백엔드 전용 구현이나 네이티브 앱에는 사용하지 않습니다.

ai-ready-sites란 무엇인가요?

이 스킬은 웹사이트 및 웹 인터페이스 작업을 위한 완전한 독립형 가이드입니다. 설계, 구현, 감사, 텍스트 편집 및 번역까지 전체 워크플로우를 포괄하며, 사용자의 요청 단계에 따라 필요한 참조 문서를 선택적으로 로드하여 효율적으로 작업을 수행합니다. 새로운 사이트 구축, 리디자인, 소규모 UI 수정, 감사, 모션 추가, 사이트/인터페이스 텍스트 작업, 기술 문서 작성 및 RU/EN 번역 등 다양한 시나리오를 지원합니다. 이 스킬은 Claude Code, Cursor, Codex와 같은 AI 에이전트 호스트에서 사용할 수 있으며, 외부 디자인 엔진이나 다른 스킬에 의존하지 않고 자체 SKILL.md와 포함된 참조 문서(design.md, implementation.md, browser.md 등)를 통해 모든 지침을 제공합니다. 실제 브라우저에서 결과를 확인하고 검증하며, 작업 범위를 명확히 하고 증거와 함께 완료하는 것을 강조합니다.

지원 대상✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/tsvetaeff-den/ai-ready-sites/tree/HEAD/skills/ai-ready-sites

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

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

문서

AI-Ready Sites

완전한 웹사이트 및 인터페이스 스킬입니다. 이 스킬에 필요한 모든 지침은 여기에 포함되어 있습니다. 다른 설치된 스킬을 로드하거나, 외부 디자인 엔진을 호출하거나, 이 워크플로우를 따르기 위해 전역 명령어를 요구하지 마십시오. 호스트가 제공하는 도구와 프로젝트에 이미 적합한 종속성을 사용하십시오. 선택적 외부 도구는 검증을 향상시키지만, 그 부재가 설계나 구현을 차단하지는 않습니다.

사용자의 단계에서 시작

요청, 적용 가능한 프로젝트 지침, 스택, 기존 컴포넌트 및 관련 제품/디자인 문서를 검사하십시오. 변경의 경우 기존 구현과 렌더링된 UI(가능한 경우)를 검사하십시오. 결과물과 가장 작은 유용한 경로를 간략히 식별하십시오. 사용자의 브리핑과 프로젝트 관례가 시각적 선택을 결정합니다. DESIGN.md가 없다고 해서 리디자인할 권한이 있는 것은 아닙니다.

요청읽고 수행할 작업
계획 또는 논의브리핑 및 UX, 그런 다음 관련 디자인 지침; 요청하지 않는 한 프로젝트 파일을 변경하지 않고 계획 전달
새 웹사이트 또는 대규모 리디자인브리핑 및 UX → 디자인 → 구현 → 브라우저 QA 및 해당 품질 → 완료
소규모 컴포넌트 또는 UI 수정영향을 받는 표면 검사; 관련 디자인/구현 지침만 사용, 집중 브라우저 확인 및 필요한 프로젝트 검사
감사/검토 전용관련 디자인/품질/브라우저 지침; 증거 수집 및 우선순위가 매겨진 발견 사항 보고; 감사 대상 프로젝트 편집 금지
모션모션, 영향을 받는 UI 및 축소된 움직임 확인
사이트 또는 인터페이스 텍스트사이트 및 인터페이스 카피 및 편집 검토; 요청된 범위 내에서 작성 또는 편집
지침 또는 기술 문서기술 문서 작성 및 편집 검토; 웹사이트 구축 없이 관련 절차 확인
RU/EN 편집 또는 번역편집 검토 및 관련 카피/문서 가이드; 사실, 실행 가능한 텍스트 및 실제 UI 레이블 유지
출시 준비 완료?완료, 현재 브라우저 증거 및 필요한 프로젝트 검사; 배포를 의미하지 않음

필요할 때만 참조를 로드하고, 한 번에 모두 로드하지 마십시오. 이것은 기능의 선택 사항이지 필수 순서가 아닙니다. 유효한 증거를 재사용하고 다른 이름으로 동등한 검토를 반복하지 마십시오.

유용한 작업 전달

  • 새로운 작업의 경우, 제품 사실을 일관된 방향으로 전환하고 하나의 작동하는 사용자 여정을 완료한 후 확장하십시오. 개선의 경우, 범위 밖의 기존 정체성과 동작을 유지하십시오. 리디자인의 경우, 요청된 시각적 시스템을 변경하면서 제품의 사실과 필요한 기능을 유지하십시오.
  • 실제 콘텐츠와 작동하는 컨트롤로 구축하십시오. 데모 데이터, 로컬 시뮬레이션 및 사용할 수 없는 통합에는 레이블을 지정하십시오. 고객 인용문, 성능 주장, 가격 또는 작동하는 백엔드를 발명하지 마십시오.
  • 카피를 작성하거나 편집할 때, 관련 텍스트 가이드를 사용하십시오. 사실, 조건, 명령 및 현재 UI 레이블을 유지하십시오. 명확성과 유용성을 개선하십시오; 저작자 감지 점수를 최적화하지 마십시오. 텍스트 전용 작업은 요청된 주장이 필요하지 않는 한 디자인이나 브라우저 단계를 트리거하지 않습니다.
  • 텍스트, 양식, 탐색 및 상태를 의도된 화면에서 키보드 및 보조 기술 의미와 함께 사용 가능하게 만드십시오. 디자인 야망은 표면에 맞습니다: 표현적인 마케팅, 정확한 작업 UI, 읽기 쉬운 에디토리얼 또는 작업 자체가 이끄는 경험.
  • 실제 브라우저에서 결과를 관찰하여 동작을 확인하십시오. 시각적 주장에 대해 스크린샷을 검사하십시오; 소스, 성공적인 클릭 및 성공적인 빌드는 렌더링된 결과를 증명하지 않습니다.
  • 도구, 인증, 자산 또는 런타임 전제 조건을 사용할 수 없는 경우, 독립적인 작업을 완료하고 누락된 특정 검사를 명시하십시오. PASS를 조작하거나, 관련 없는 도구를 설치하거나, 사용자의 스택을 조용히 대체하지 마십시오.
  • 승인된 범위 내에서 작업을 유지하십시오. 사이트 생성은 게시, 실제 양식 제출, 유료 서비스 또는 프로덕션 변경을 승인하지 않습니다. 반복적인 승인 요청 없이 일반적인 승인된 작업을 계속하십시오.

도구 및 이식성

모든 참조/스크립트를 이 SKILL.md를 기준으로 확인하십시오. 개인 경로, 특정 OS, 외부 스킬 이름, API 키, 프레임워크 또는 호스팅 계정이 필요하지 않습니다. 브라우저 QA는 도구 검색, 브라우저 없는 동작 및 선택적 포함 헬퍼를 다룹니다. Chrome DevTools 및 Playwright는 패키지 내 지침이며 다른 스킬에 대한 종속성이 아닙니다.

포함된 Node 헬퍼는 선택 사항입니다. scripts/doctor.mjs는 아무것도 설치하지 않고 기본 로컬 기능을 보고합니다; scripts/browser-check.mjs는 Playwright와 브라우저가 이미 존재할 때 제한된 스모크 검사를 수행합니다. --help로 시작하십시오. 이 스킬을 호스트 도구와 함께 읽고 사용하는 데 Node 런타임이 필요하지 않습니다.

증거와 함께 완료

먼저 변경된 표면이나 감사 결과를 보고한 다음, 실제로 수행된 검사, 관련 산출물 및 제한 사항을 보고하십시오. 중요한 전달의 경우 프로젝트 관례를 사용하여 간결한 QA 증거를 저장하십시오. 소규모 수정의 경우 최종 응답으로 충분할 수 있습니다. 검사를 실행할 수 없었던 경우 NOT RUN을 명시하십시오; 알려진 차단기가 없이 실제로 통과된 필수 검사에 대해서만 릴리스 PASS를 보류하십시오. 완료는 보고서 및 수용 경계를 정의합니다.

귀속 기록은 THIRD_PARTY_NOTICES.md입니다; 이는 출처 증명이지 런타임 지침이 아닙니다. 업스트림 CLI, 바이너리, 유료 서비스 또는 자동 업데이터는 번들로 제공되지 않습니다.

관련 스킬