안녕하세요 창업지식공유대학생입니다 😊
오늘은 와이어프레임 정의와 만드는 방법에 대해
포스팅을 하도록 하겠습니다 !
와이어프레임이란?
디지털 제품 디자인의 초기 단계에서
기본적인 레이아웃과 기능을 시각적으로 표현하는 것
을 의미합니다.
그림이나 색상과 같은 디자인 요소는 포함되지 않습니다.
대신, 단순한 선이나 도형을 사용하여 제품의 레이아웃과 기능을 보여줍니다.
이를 통해 디자이너와 개발자는
제품의 사용자 인터페이스를 디자인하고 기능을 정의합니다.
와이어프레임은 '목업(Mock-up)'과 같은 개념입니다.
와이어프레임을 만들기 전에
'스토리보드'라는 것을 만드는데,
이에 대해서는 추후 포스팅 할 예정입니다.
기획 단계를 정리하자면,
스토리보드 제작 -> 목업 or 와이어프레임 제작 -> 프로토타입 제작
순서로 진행 됩니다.
와이어프레임 만드는법
와이어프레임을 만드는 법은 다양합니다.
펜과 종이를 사용하여 수동으로 하기도 하고,
디지털 도구를 사용할 수도 있습니다.
유명한 툴인 Adobe XD, Sketch, Figma로도 만들 수 있고,
베이직 목업
cacco
파워목업
등의 서비스를 활용할 수도 있습니다.
와이어프레임 만드는 프로세스
1. 요구사항 수집
제품의 목적과 목표를 이해하고, 사용자의 요구사항을 수집합니다.
2. 컨텐츠 매핑
제품의 주요 기능과 내용을 정리하고,
페이지나 섹션 등의 구성요소를 정리합니다.
3. 그리기
제품의 레이아웃을 그리기 시작합니다.
위에서 말했듯
수동으로 그리거나 디지털 도구를 사용하여 그릴 수 있습니다.
4. 검토
와이어프레임을 검토하고, 필요한 수정 사항을 파악합니다.
디자인 요소가 아닌 제품의 레이아웃과 기능에 초점을 맞춥니다.
5. 수정
검토 후에 필요한 수정 사항을 반영하고 완성합니다.
이상으로 와이어프레임에 대한
포스팅을 마치도록 하겠습니다.