와이어프레임 / 스토리보드

Contents 접기

	와이어프레임 Wireframe	스토리보드 Storyboard
	웹사이트나 앱의 레이아웃과 구조를 설계하기 위한 초안	서비스의 전체 흐름과 화면 간 상호작용을 설명
목적	화면의 구성요소인 버튼, 텍스트, 이미지 등 위치와 배치를 시각적으로 표현	화면 전환, 사용자 동작인 클릭, 스와이프 등 기능 연결을 시각적으로 표현
특징	- 디자인보다 기능과 구조에 초점 - 색상, 이미지 등 디테일 없이 단순 선과 상자로 표현	- 와이어프레임 기반, 사용자 행동과 화면 간 연결성을 추가적으로 설명 - 전체 프로젝트의 사용자 경험(UX) 설계
비고	와이어프레임은 어떤 레이아웃을 구성할 것인지, 포함되는 주요 기능은 무엇인지 등 최대한 단순하게 확인하고 의견을 나눌 수 있는 기준이 되기도 한다.

와이어프레임 - 제품 기획 단계에서 페이지를 어떻게 구성을 하는지에 대한 시각적 가이드

목업 - 실제 최종 프로덕트가 시각적으로 어떻게 보이는지에 대한 정적 화면

레벨 업 노트