UX 디자인은(는) 무엇을 하나요?
감사: Peter Bamuhigire, techguypeter.com, +256 784 464178 제공.
승인된 웹사이트 전략과 경험 증거를 차별화되고 구현 가능한 프리미엄 UX 방향으로 변환합니다.
사용 시기
- 리드 생성, 전자상거래, 고가 상품 또는 공공 증명용 웹사이트에 프리미엄 UX 게이트가 필요한 경우
- 시각적 방향이 구현 제약 조건과 연결되어야 하는 경우
사용하지 말아야 할 때
- 일반적인 시각 교리(
chwezi-design-engine에 속함)나 디자인 시스템이 소유한 토큰 구현에는 사용하지 마십시오.
필수 입력 정보
| 산출물 | 출처 또는 제공자 | 필수? | 목적 | 누락 시 |
|---|---|---|---|---|
| 승인된 전략, 경험 맵, 콘텐츠 계층, 브랜드 증거, 참조 분석 및 기술적 제약 | 상위 웹사이트 스킬 및 외부 디자인 교리 | 예 | 구현 가능한 경험 방향 정의 | 전략이나 콘텐츠 계층이 없으면 중단합니다. |
워크플로우
- 외부 디자인 교리를 로드하고 상위 전략의 유효성을 검증합니다.
- 계층 구조, 상호작용, 타이포그래피 방향, 상태 및 반응형 동작을 선택합니다.
- 차별성, 접근성, 다국어 성장 및 저대역폭 제약 조건을 테스트합니다.
- 금지된 기본값이나 지원되지 않는 패턴에서 중단하고 방향을 수정한 후 결정 사항을 디자인 시스템과 페이지 빌더에 전달합니다.
출력물
| 산출물 | 소비자 | 수락 조건 |
|---|---|---|
| 프리미엄 UX 방향 및 구현 브리핑 | 디자인 시스템 및 페이지 빌더 | 유형 근거, 계층 구조, 컴포넌트, 상태, 중단점, 모션 제한 및 품질 위험을 명명합니다. |
생성된 증거
| 증거 | 소비자 | 수락 조건 |
|---|---|---|
| 결정 및 검토 기록 | 디자인 및 릴리스 소유자 | 각 주요 시각적 선택을 브랜드, 행동, 접근성 또는 성능 증거에 연결합니다. |
기능 계약
읽기, 검색 및 시각적 검사가 필요합니다. 계획은 기본적으로 읽기 전용입니다. 디자인 산출물이나 코드 편집에는 구현 권한이 필요합니다. 자산 라이선싱, 외부 게시, 지출 및 프로덕션 변경에는 명시적 권한이 필요합니다.
저하된 모드
렌더링, 글꼴, 자산 또는 외부 교리 없이 제공되는 경우, 가장 좁은 자격 방향을 반환하고 시각적 검사를 평가되지 않음(not assessed)으로 표시하며 프리미엄 품질을 인증하지 않습니다.
결정 규칙
| 선택 | 조치 | 방지된 실패 또는 위험 |
|---|---|---|
| 브랜드와 콘텐츠가 독특한 표시용 서체를 정당화하는 경우 | 성능 폴백과 함께 지정 | 일반적인 AI 기본 타이포그래피 |
| 상호작용이 작업 가치를 추가하지 않거나 3G 사용에 해를 끼치는 경우 | 제거 또는 단순화 | 장식적 마찰 |
품질 기준
- 시각적 제작 전에 선택한 서체와 이유를 명시합니다. 오류, 빈 상태, 로딩, 포커스 및 비활성화 상태를 포함합니다. 접근성 및 아프리카 성능 제약 조건을 충족합니다.
안티 패턴
- 기본 서체로 Inter 또는 기본 시스템 스택 선택. 해결 방법: 브랜드에 적합한 허용 서체를 선택하고 이유를 문서화합니다.
- 보라색 그라데이션을 프리미엄 약칭으로 사용. 해결 방법: 브랜드 증거에서 색상과 대비를 도출합니다.
- 홈페이지만 디자인. 해결 방법: 모든 템플릿 패밀리에 대한 공유 패턴을 정의합니다.
- 비정상 상태 무시. 해결 방법: 오류, 빈 상태, 로딩, 포커스 및 비활성화 동작을 지정합니다.
- 렌더링 없이 품질 인증. 해결 방법: 시각적 평가를
평가되지 않음(not assessed)으로 표시하고 시각적 QA를 요구합니다.
작업 예제
캄팔라의 컨설팅 회사를 위해, 권위 있는 포지셔닝을 뒷받침하는 라이선스 에디토리얼 세리프를 선택하고, 모바일 유틸리티를 위해 컴팩트 산스와 페어링한 후, 핸드오프 전에 3G 글꼴 예산에서 둘 다 테스트합니다.
참조
-
ux-strategy-differentiation-and-meaning.md — UX 전략, 차별화 및 테스트되지 않은 출시 증거 규칙을 구성할 때 읽습니다.
-
lean-design-cycle-and-deliverable-selection.md — 린 디자인 사이클과 적절한 산출물을 선택할 때 읽습니다.
-
enterprise-internal-tools-and-portal-ux.md — 내부 도구 또는 클라이언트 포털을 디자인할 때 읽습니다.
-
ai-feature-discovery-and-risk-framing.md — AI 기능 추가 여부와 방법을 결정할 때 읽습니다.
-
ai-interface-trust-and-control-spec.md — AI 인터페이스에 대한 신뢰, 제어 및 수정을 지정할 때 읽습니다.
-
ux-discovery-and-wireframe-procedure.md — UX 디스커버리, 여정 그리드, 사이트맵 및 와이어프레임을 실행할 때 읽습니다.
보존 도메인 사용 가이드
- 웹사이트는 고가 상품 가격, 신뢰 또는 진지한 상업적 관심을 정당화할 만큼 프리미엄으로 보여야 합니다.
- 리드 생성, 전자상거래, 제품, 포트폴리오, SaaS 마케팅, 숙박업, 교육, 헬스케어, 비영리 또는 엔터프라이즈 웹사이트를 구축하는 경우.
- 사이트가 일반적, 템플릿화, 과장식, 느림, 스캔하기 어렵거나 시각적으로 저렴해 보일 위험이 있는 경우.
- 웹사이트는 소유자의 제안을 더 가치 있게 느끼게 하면서 동시에 개발자의 프리미엄 장인 정신을 증명해야 합니다.
보존 도메인 입력
- 웹사이트 전략 브리핑, 타겟 오디언스, 제안, 브랜드 포지션, 콘텐츠 인벤토리, 사진/자산 및 전환 목표.
- 기존 디자인 시스템, 스크린샷, 경쟁사 벤치마크 및 성능/접근성 제약 조건.
보존 도메인 워크플로우
- 웹사이트의 비즈니스 역할 정의: 신뢰, 전환, 영업 지원, 신청, 예약, 기부, 제품 교육 또는 권위.
- 구매자와 제안에 맞는 시각적 음성 선택: 운영적, 에디토리얼, 럭셔리 미니멀, 컨슈머 폴리시드, 인스티튜셔널 또는 로컬-프리미엄.
- 브리핑에 프리미엄 포지셔닝, 콘텐츠, SEO, 스택 또는 에이전시 증거가 필요한 경우
premium-website-product를 로드합니다. - 섹션 스타일링 전에 전환 경로에서 계층 구조를 구축합니다.
- 프리미엄 플레이북을 사용하여 디자인 시스템 생성: 시각적 원칙, 색상, 유형, 간격, 이미지, 모션, 차트/테이블 및 프로덕션 폴리시.
- 페이지 제작 전과 시각적 QA 후에 프리미엄 웹사이트 게이트를 적용합니다.
- 프로젝트 스코어카드와 디자인 품질 보고서에 증거를 기록합니다.
보존 도메인 품질 가이드
- 첫 번째 뷰포트가 브랜드/카테고리, 제안, 신뢰성 및 기본 작업을 즉시 전달합니다.
- 레이아웃은 기본 템플릿 전반에 걸쳐 반응형, 빠르고, 접근 가능하며 시각적으로 일관됩니다.
- 가능할 때마다 실제 제품, 장소, 사람, 증거, 인터페이스 또는 결과를 보여주는 이미지를 사용합니다.
- 색상, 타이포그래피, 간격 및 모션은 토큰화되어 있으며 상업적으로 적절합니다.
- 양식, 가격 책정, 서비스 페이지, 제품 페이지 및 문의 흐름은 불안을 줄이고 다음 단계를 명확하게 만듭니다.
- 데이터, 사용후기, 사례 연구, 통계 및 비교는 정확하고 읽기 쉬운 시각적 계층 구조로 제시됩니다.
- 단순함은 프리미엄으로 취급됩니다: 내비게이션, 양식, 카피 블록, 상태 변경 및 모바일 흐름은 필요한 증거를 숨기지 않고 구매자 노력을 제거합니다.
- 모든 기본 템플릿은 프리미엄 UI/UX 게이트 및 디자인 품질 점수 루브릭에서 최소 8/10점을 획득합니다.
보존 도메인 안티 패턴
- 일반적인 AI 출력처럼 느껴지는 랜딩 페이지: 모호한 그라데이션, 블롭 배경, 장식적인 카드 더미, 약한 스톡 사진 및 뒷받침되지 않는 주장.
- 제안을 설명하거나 사용자를 비즈니스 결과로 이동시키지 않는 아름다운 페이지.
- 단조로운 색상 팔레트, 비좁은 모바일 레이아웃, 느린 히어로 미디어 및 접근 불가능한 오버레이.
- 증거, 명확성 및 신뢰가 필요한 곳에 시각적 참신함 사용.
보존 도메인 출력물
- 프리미엄 웹사이트 UX 브리핑, 시각적 방향, 토큰 계획, 페이지 수준 품질 노트, 전환 경로 가이드 또는 게이트 보고서.
보존 도메인 참조
references/premium-website-ui-ux-playbook.md- 책에서 파생된 웹사이트 디자인 규칙.references/enterprise-website-ux-playbook.md- 엔터프라이즈 웹사이트 이해관계자, 증거, 내비게이션, 신뢰 및 아프리카에 최적화된 UX 규칙.references/mobile-dashboard-website-patterns.md- 모바일 내비게이션, 첫 방문 가이드, 대시보드/증거 프레젠테이션 및 모바일 품질 검사.references/premium-website-gate.md- 점수 매기기 및 차단 결함.../premium-website-product/references/premium-website-market-asset-gate.md- 웹사이트를 프리미엄 제품, 콘텐츠, SEO, 런칭, 스택 및 에이전시 증거 게이트로 취급.references/source-register.md- 출처 정보 및 권리 게이트; 활성 소스 경로는 어설션되지 않습니다.
세계적 수준의 UX 기초 (책에서 파생)
프리미엄 작업을 시작하기 전에 필수 독서:
references/levy-four-tenets.md— 4가지 원칙 프레임워크(비즈니스 전략 + 가치 혁신 + 검증된 사용자 연구 + 킬러 UX 디자인); 클라이언트 브리핑에서 거부해야 할 상위 10가지 안티 패턴.references/enterprise-five-outcomes.md— 5가지 필수 결과(유용함 / 쉬움 / 효율적 / 즐거움 / 접근 가능)를 출시 전 게이트로 사용. 하나라도 '아니오'면 출시 불가.references/pm-collaboration-rules.md— Fekeshazi 5+1 (5-10분 안에 설명, 디자인을 지속적인 프로세스로 취급 등) 및 "중요한 기능을 메뉴에 숨기지 마라" 규칙.
브리핑이 Levy의 상위 10가지 검사를 통과하지 못하거나 5가지 결과 중 하나라도 누락된 경우, 범위 지정 전에 이의를 제기하십시오.