100개의 인기 앱을 역설계한 마크다운 디자인 사양서: 클로드 UI 클로닝용
한 개발자가 인기 앱 50개를 역공학하여 구조화된 마크다운 디자인 스펙으로 만들고 Claude에 입력하여 UI를 재구축했습니다. 반복 작업 후 복제 정확도를 높이는 몇 가지 중요한 패턴을 발견했으며, 100개 앱이 포함된 저장소를 게시했습니다.
Claude가 UI 복제를 완벽하게 하는 방법
- 범위가 아닌 정확한 값:
#1A1A1A가 효과적입니다. "dark gray"는 화면마다 다른 다섯 가지 회색을 생성합니다. - 상태 커버리지를 사전에: 모든 상태(비어 있음, 로딩 중, 오류, 채워짐)를 나열하면 Claude가 자체 상태를 만들어내는 것을 방지합니다.
- 간격을 척도로 사용: 요소별 픽셀 주석 대신 4/8/16/24 간격 시스템을 사용하여 더 일관된 레이아웃을 만듭니다.
- 내비게이션을 그래프로: 명시적인 화면 간 전환으로 버튼의 목적지를 추측할 필요가 없습니다.
일정 지점을 넘어서면 긴 설명문이 오히려 출력을 악화시켰습니다. 분량보다는 간결함과 정확성이 더 중요합니다.
저장소 내용
공개 저장소인 github.com/Meliwat/awesome-ios-design-md에는 100개의 앱이 포함되어 있으며, 각각 세 가지 사양 수준(빠른 참조, 표준 빌드, 전체 픽셀 수준 복제)을 제공합니다. 모든 사양은 마크다운 형식이며 MIT 라이선스로, 종속성이 없습니다. 사양을 Claude에 넣으면 더 예측 가능한 UI 출력을 얻을 수 있습니다.
대상 사용자
Claude를 사용하여 UI 구성 요소를 생성하거나 복제하는 개발자, 특히 iOS 또는 일반 앱 디자인을 다루는 경우.
📖 Read the full source: r/ClaudeAI
👀 See Also
Crit: 로컬 우선, 단일 바이너리 CLI로 에이전트 계획과 차이점 검토하기
Crit는 단일 바이너리 CLI로, GitHub 스타일 UI로 파일 또는 diff를 브라우저에서 열어 AI 코딩 에이전트와 다중 라운드 피드백 루프를 가능하게 하며, 계정이 필요 없습니다.
OpenClaw 스킬이 에이전트를 Knods.io UI에 연결하여 워크플로우 생성이 가능합니다
한 개발자가 OpenClaw 스킬을 구축하여 에이전트가 Knods.io UI 내에서 워크플로우를 이해하고 생성할 수 있도록 했으며, 사용자가 Knods의 내장 에이전트에 의존하는 대신 브랜드별 에이전트와 같은 특정 에이전트 간에 전환할 수 있게 했습니다.
CC-Canary: 로컬 JSONL 분석을 통해 Claude Code의 회귀를 탐지합니다
CC-Canary는 Claude Code 세션 로그를 읽고 모델 드리프트에 대한 포렌식 보고서를 생성합니다. 읽기:편집 비율, 추론 루프, 비용 추세 및 자동 감지된 변곡점 날짜를 포함합니다.
미미르: 21가지 신경과학 메커니즘을 기반으로 구축된 파이썬 메모리 시스템
Mímir는 섬광 기억과 검색 유도 망각과 같은 21가지 인지과학 메커니즘을 구현한 AI 에이전트용 Python 메모리 시스템입니다. 이 시스템은 하이브리드 BM25 + 의미론적 + 날짜 인덱스를 사용하며, Mem2ActBench에서 VividnessMem 대비 13% 높은 도구 정확도를 포함한 벤치마크 개선 결과를 보여줍니다.