와이어프레임
- 기획 초기 단계에서 제작
- 페이지에 대한 대략적인 레이아웃이나 UI 요소 뼈대 설계
- 손그림, 파워포인트, 키노트, 스케치, 일러스트, 포토샵
목업
- 와이어프레임보다 조금 더 실제 화면과 유사하게 만드는 정적 형태 모형
- 파워 목업, 발사믹 목업
스토리보드
- 와이어프레임에 콘텐츠에 대한 설명이나 페이지 간 이동 흐름 추가한 문서
- 디자이너와 개발자가 최종적으로 참고하는 작업 지침서
- 서비스 구축을 위한 모든 정보가 담겨 있어야 함
- 파워포인트, 키노트, 스케치, Axure
프로토타입
- 와이어프레임이나 스토리보드 등에 인터랙션을 적용해 실제로 구현된 것처럼 테스트가 가능한 동적인 형태 모형
- 작성 방법에 따라 페이퍼 / 디지털 프로토타입으로 분리
- HTML/CSS, Axure, Flinto, 네이버 프로토나우, 카카오 오븐
