[시나공] 화면 설계 도구 · 품질 특성 · HCI 정리

1️⃣ 화면 설계 도구✅ 1. 와이어프레임 (Wireframe)🔹 정의페이지에 대한 개략적인 레이아웃이나 UI 요소 배치를 설계하는 도구기획 단계 초기에 제작🔹 특징실제 구현 X (구조 설계용)개발자·디자이너 간 협업 및 방향 공유 목적화면 구조 중심🔹 도구손그림, 파워포인트, 키노트, 스케치, 일러스트, 프로토타입 툴 등🔎 “개략적 배치”, “초기 설계” = 와이어프레임✅ 2. 목업 (Mockup)🔹 정의실제 화면과 유사하게 만든 정적인 형태의 모형🔹 특징디자인, 색상, 레이아웃 포함시각적 구성 요소 배치동작 구현은 없음 (정적)🔹 종류파워 목업, 발사믹 목업 등🔎 → “정적인 형태”, “실제 화면과 유사” = 목업✅ 3. 스토리보드 (Story Board)🔹 정의와이어프레임에 콘텐츠 ..

2026.03.04