스킬 ui-design
📦

ui-design

콘텐츠 리비전 r1 안전 ⚙️ 외부 명령어

UI 레이아웃 변경 사항 다듬기

대상 영역과 원하는 결과가 명확하지 않으면 UI 스타일링 요청은 자주 실패합니다. 이 skill은 현재 상태를 확인하고, 옵션을 비교하며, 집중된 변경 사항을 적용하기 위한 스크린샷 중심 워크플로를 만듭니다.

지원: Claude Codex Code(CC)
Maintain this Skill? Claim it 🥉 79 브론즈

내 에이전트로 설치

이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.

에이전트 요청
Review the Skillstore skill "ui-design" from https://skillstore.io/skills/yunshu0909-ui-design.md and its manifest at https://skillstore.io/api/skills/yunshu0909-ui-design/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.

에이전트가 읽기 쉬운 리소스

AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.

Markdown 상세 GET /skills/yunshu0909-ui-design.md 서명된 manifest GET /api/skills/yunshu0909-ui-design/manifest 서명된 lockfile GET /api/skills/yunshu0909-ui-design/lockfile

테스트해 보기

"ui-design" 사용 중입니다. 헤더 도구가 어색해 보입니다. 레이아웃을 고치는 것을 도와주세요.

예상 결과:

어시스턴트는 먼저 현재 헤더를 ASCII 다이어그램으로 매핑한 다음, 도구에 대해 두세 가지 수정된 배치를 제안합니다.

"ui-design" 사용 중입니다. 검색과 새로고침이 같은 행에 있는 옵션을 사용해 주세요.

예상 결과:

어시스턴트는 선택된 배치에 대해 집중된 UI 편집을 적용하고 관련 없는 정리는 피합니다.

"ui-design" 사용 중입니다. 변경 후 색상이 너무 강합니다.

예상 결과:

어시스턴트는 이를 작은 개선 사항으로 처리하고 전체 옵션 과정을 다시 열지 않고 색상을 직접 조정합니다.

보안 감사

안전
v4 • 2026. 7. 8. 버전별 보고서 열기

Static command findings are false positives caused by Markdown code fences around ASCII UI diagrams. The high-entropy heuristic is also a false positive because SKILL.md is readable Markdown with Chinese text, emoji, and box-drawing characters.

1
스캔된 파일
110
분석된 줄 수
0
검토 항목
0
오탐 무시됨

위험 요인

⚙️ 외부 명령어 (3)
SKILL.md:24-31 SKILL.md:31-41 SKILL.md:41-53
가장 최근에 완료된 정적·의미론적 감사에서 확인된 보안 발견 사항이 감지되지 않았습니다. 이는 스킬에 부작용이 없음을 증명하지 않습니다.
감사자: codex 감사 이력 보기 →
이 보고서 공유 및 인용

버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.

버전별 보고서 열기
보안 평가

보고서 링크 복사

https://skillstore.io/skills/yunshu0909-ui-design/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown 배지

[![Skillstore security assessment](https://skillstore.io/badges/skills/yunshu0909-ui-design/security.svg)](https://skillstore.io/skills/yunshu0909-ui-design?utm_source=security_passport_badge)

HTML 배지

<a href="https://skillstore.io/skills/yunshu0909-ui-design?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/yunshu0909-ui-design/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

임베드 카드

<iframe src="https://skillstore.io/embed/skills/yunshu0909-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 인용

yunshu0909. (2026). ui-design security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/yunshu0909-ui-design/audits/4

BibTeX 인용

@techreport{yunshu0909-yunshu0909-ui-design-2026, author = {yunshu0909}, title = {ui-design security audit report (audit version 4)}, institution = {Skillstore}, year = {2026}, number = {4}, url = {https://skillstore.io/skills/yunshu0909-ui-design/audits/4}, note = {Author version unspecified} }

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 4)" version: "unspecified" type: report authors: - name: "yunshu0909" date-released: "2026-07-08" url: "https://skillstore.io/skills/yunshu0909-ui-design/audits/4" identifiers: - type: other value: "skillstore:yunshu0909-ui-design:audit:4" description: "Skillstore immutable audit report identifier"

변형 비교

설치 가능한 변형 2개

각 작성자의 스킬은 별도의 설치 항목으로 유지됩니다. 추천 변형은 Skillstore 근거로 순위가 정해집니다.

이 변형이 1위인 이유

Skillstore 점수가 가장 높음
tencentcloudbase 권장

tencentcloudbase-ui-design

Skillstore 점수 80
증거 신뢰도 중간
Skillstore 사용량 25
업데이트됨

2026-09-09

yunshu0909 현재

yunshu0909-ui-design

Skillstore 점수 79
증거 신뢰도 높음
Skillstore 사용량 59
업데이트됨

2026-09-09

Skillstore 점수

이 점수의 이유 증거 신뢰도: 높음
55
아키텍처
85
유지보수성
87
콘텐츠
69
커뮤니티
91
사양 준수

만들 수 있는 것

레이아웃 피드백 분류

모호한 UI 불만을 확인된 현재 상태 다이어그램과 소규모 레이아웃 옵션 세트로 전환합니다.

디자인 대안 검토

AI에게 코드를 편집하도록 요청하기 전에 두세 가지 시각적 배치를 비교합니다.

UI 다듬기 중 범위 제어

스타일링 변경을 선택된 요소에 집중시키고 관련 없는 리팩터링을 피합니다.

이 프롬프트를 사용해 보세요

현재 UI 확인 
이 화면에 ui-design workflow를 사용해 주세요. 먼저 관련 파일을 읽고 변경 사항을 제안하기 전에 현재 레이아웃을 ASCII 다이어그램으로 설명해 주세요.
레이아웃 옵션 비교 
이 영역의 간격과 배치를 개선하고 싶습니다. 두세 가지 ASCII 레이아웃 옵션과 각각에 대한 짧은 이유 하나를 제시해 주세요.
선택한 옵션 적용 
레이아웃 제안 중 option B를 사용해 주세요. 필요한 가장 작은 코드 변경만 하고 관련 없는 구조는 변경하지 마세요.
검토 후 다듬기 
선택한 레이아웃은 거의 맞습니다. 이 개선만 적용해 주세요: 제목과 컨트롤 사이의 간격을 늘린 다음, 변경된 정확한 파일을 요약해 주세요.

모범 사례

  • 시작할 때 스크린샷이나 정확한 파일 및 컴포넌트 이름을 제공하세요.
  • 코드 변경을 승인하기 전에 ASCII 레이아웃 옵션을 요청하세요.
  • 첫 번째 편집 후 개선 사항에는 짧고 구체적인 피드백을 사용하세요.

피하기

  • 모호한 요청만으로 어시스턴트가 원하는 레이아웃을 추측하게 하지 마세요.
  • 하나의 요청에서 시각적 다듬기와 관련 없는 리팩터링을 함께 묶지 마세요.
  • 최종 간격이나 정렬이 중요할 때 브라우저 검토를 건너뛰지 마세요.

자주 묻는 질문

이 skill은 무엇에 도움이 되나요?
어시스턴트가 현재 레이아웃을 확인하고, 옵션을 제안하며, 선택한 디자인만 편집하도록 UI 스타일링 변경을 구조화하는 데 도움이 됩니다.
완성된 시각 디자인을 생성하나요?
아니요. 기존 인터페이스의 스타일링 및 레이아웃 변경과 관련된 협업을 안내합니다.
왜 ASCII 다이어그램을 사용하나요?
ASCII 다이어그램은 코드 변경을 시작하기 전에 레이아웃 의도를 명확하게 만듭니다.
스크린샷 없이도 작동할 수 있나요?
예, 관련 코드와 대상 영역이 명확하다면 가능합니다. 스크린샷은 시각적 문제의 정확도를 높입니다.
이 skill은 게시해도 안전한가요?
예. 검토된 파일에는 문서만 포함되어 있으며 실행 가능한 명령, 네트워크, 또는 비밀 정보 처리 동작이 없습니다.
어떤 도구에서 사용할 수 있나요?
보고서에는 Claude, Codex, Claude Code 지원이 나열되어 있습니다.

개발자 세부 정보

작성자

yunshu0909

라이선스

MIT

Skillstore 리비전

r1

버전 안내

작성자가 버전을 선언하지 않았습니다.

리포지토리

https://github.com/yunshu0909/yunshu_skillshub/tree/master/ui-design

참조

64ca8af0f54a325752f08bd54e52151061ea659a

유지보수 최신성

2026. 7. 22.

사용량

48 다운로드 · 134 조회

파일 구조

📄 SKILL.md

yunshu0909의 다른 스킬

전체 보기

관련 스킬

전체 보기