ui-design
차별화된 UI 프로토타입 설계
일반적인 AI 인터페이스는 시각적 방향성과 플랫폼을 고려한 세부 사항이 부족한 경우가 많습니다. 이 스킬은 Claude, Codex, Claude Code가 프로토타입을 만들기 전에 디자인 의도를 정의하도록 안내합니다.
내 에이전트로 설치
이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.
Review the Skillstore skill "ui-design" from https://skillstore.io/skills/tencentcloudbase-ui-design.md and its manifest at https://skillstore.io/api/skills/tencentcloudbase-ui-design/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.
에이전트가 읽기 쉬운 리소스
AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.
테스트해 보기
"ui-design" 사용 중입니다. 물류 팀을 위한 웹 대시보드가 필요합니다.
예상 결과:
- 배차 계획자와 관리자를 위한 목적 진술.
- 구체적인 색상 및 타이포그래피 선택이 포함된 산업적 또는 실용적 미감.
- 대시보드, 배송 상세, 예외 검토 화면 계획.
"ui-design" 사용 중입니다. 제 교육용 미니 프로그램이 덜 평범하게 느껴지도록 재디자인해 주세요.
예상 결과:
- 절제된 팔레트를 갖춘 편집형 또는 유기적 방향.
- 작은 화면을 위한 타이포그래피 및 레이아웃 규칙.
- 중앙 정렬 카드 패턴과 이모지 아이콘을 제거하는 감사 노트.
보안 감사
안전All static findings are false positives. Backticks are Markdown, URLs are reference links, and relative paths point to sibling skill documents. No evidence found for prompt injection, data exfiltration, or malicious execution intent in SKILL.md.
위험 요인
⚙️ 외부 명령어 (15)
🌐 네트워크 접근 (4)
📁 파일 시스템 접근 (2)
이 보고서 공유 및 인용
버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.
보고서 링크 복사
https://skillstore.io/skills/tencentcloudbase-ui-design/audits/2?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 배지
[](https://skillstore.io/skills/tencentcloudbase-ui-design?utm_source=security_passport_badge)HTML 배지
<a href="https://skillstore.io/skills/tencentcloudbase-ui-design?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/tencentcloudbase-ui-design/security.svg" alt="Skillstore security assessment" loading="lazy"></a>임베드 카드
<iframe src="https://skillstore.io/embed/skills/tencentcloudbase-ui-design.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>학술 인용 (APA · BibTeX · CFF)
APA 인용
tencentcloudbase. (2026). ui-design security audit report (audit version 2) [Author version 2.23.8]. Skillstore. https://skillstore.io/skills/tencentcloudbase-ui-design/audits/2BibTeX 인용
@techreport{tencentcloudbase-tencentcloudbase-ui-design-2026,
author = {tencentcloudbase},
title = {ui-design security audit report (audit version 2)},
institution = {Skillstore},
year = {2026},
number = {2},
url = {https://skillstore.io/skills/tencentcloudbase-ui-design/audits/2},
note = {Author version 2.23.8}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "ui-design security audit report (audit version 2)"
version: "2.23.8"
type: report
authors:
- name: "tencentcloudbase"
date-released: "2026-07-09"
url: "https://skillstore.io/skills/tencentcloudbase-ui-design/audits/2"
identifiers:
- type: other
value: "skillstore:tencentcloudbase-ui-design:audit:2"
description: "Skillstore immutable audit report identifier"
변형 비교
설치 가능한 변형 2개각 작성자의 스킬은 별도의 설치 항목으로 유지됩니다. 추천 변형은 Skillstore 근거로 순위가 정해집니다.
이 변형이 1위인 이유
tencentcloudbase-ui-design
2026-09-09
Skillstore 점수
이 점수의 이유 증거 신뢰도: 중간만들 수 있는 것
제품 화면 구체화
초기 제품 아이디어를 시각적 방향, 페이지 범위, 프로토타입 준비가 된 인터페이스 계획으로 전환합니다.
프론트엔드 프로토타입 준비
웹 인터페이스를 만들기 전에 위계, 팔레트, 타이포그래피, 레이아웃 규칙을 정의합니다.
미니 프로그램 UI 개선
명확한 미감, 플랫폼 제약, 구체적인 핸드오프 가이드를 바탕으로 작은 화면용 페이지를 계획합니다.
이 프롬프트를 사용해 보세요
ui-design 스킬을 사용하여 [product]에 대한 디자인 명세서를 작성하세요. 사용자, 목적, 미적 방향, 팔레트, 타이포그래피, 레이아웃 전략을 포함하세요.
ui-design 스킬을 사용하여 [workflow]에 대한 [web or mini program] 프로토타입을 계획하세요. [number]페이지로 제한하고 각 화면을 정의하세요.
ui-design 스킬을 사용하여 이 인터페이스를 재디자인하세요: [description]. 일반적인 패턴을 식별하고, 더 강한 방향을 선택한 뒤, 수정된 위계를 제안하세요.
[project] 구현 전에 ui-design 스킬을 사용하세요. 플랫폼별 디자인 명세서, 컴포넌트 계획, 자체 감사 체크리스트, 핸드오프 노트를 작성하세요.
모범 사례
- 대상 사용자, 주요 동작, 플랫폼, 브랜드 제약 조건을 제공하세요.
- 구현을 요청하기 전에 디자인 명세서를 검토하세요.
- 코드로 이동할 때 접근성, 반응형 동작, 콘텐츠 상태를 요청하세요.
피하기
- 이 스킬을 백엔드, API 또는 데이터베이스 전용 작업에 사용하는 것.
- 디자인 명세서를 건너뛰고 즉시 코드를 요청하는 것.
- 승인된 토큰이 이미 존재하는데 실제 브랜드 시스템을 무시하는 것.
자주 묻는 질문
이 스킬은 최종 프론트엔드 코드를 작성하나요?
어떤 플랫폼을 지원하나요?
제 브랜드 색상을 사용할 수 있나요?
왜 먼저 디자인 명세서가 필요한가요?
백엔드 작업도 처리하나요?
어떻게 시작해야 하나요?
개발자 세부 정보
작성자
tencentcloudbase라이선스
MIT
작성자 버전
v2.23.8
Skillstore 리비전
r1
참조
24b2fe42a456262f3fd0fb3df72e12d9ed2c32ec
유지보수 최신성
2026. 7. 18.
사용량
1 다운로드 · 0 조회
파일 구조
📄 SKILL.md