PC웹, 모바일웹, 애플리케이션 그리고 애플워치 등의 새로운 디바이스까지, 점점 더 다양한 Interaction이 발생하는 화면들을 만나게 된다. 특히 이를 제작하는 과정에 있어서 초기 의도된 방향의 화면을 어떻게 작동하게 할 것인가에 대한 고민을 모바일그룹에서는 다음과 같이 진행했었다. 아래에서는 Paper를 통해 다양한 실험적인 사례들을 미리 만들어 볼 수 있도록 쉽고 빠른 설계 방법론이다.

특히 모바일에서 작동되는 다양한 UI에 대한 Animation이나 Interaction을 처리하기 위해서는 평면적인 개념도만으로는 다양한 프로젝트 참여자들을 설득하고 동의를 구하기에는 꽤 많은 시간이 소모된다. 그래서 우리는 시각적인 접근을 기초로 한 사전 제작 방식들을 수행하고 있다. 가장 손쉬운 Paper Prototyping 기법을 통해서 어떻게 기획되었으며, 각각의 요소들은 어떻게 상호작용할 것이며, 이전/다음 등으로 이어지는 메뉴에 대한 동작들도 가볍게 제작해 볼 수 있다.

 

1. 스케치를 통한 Paper Prototyping

(OK Cashbag 모바일웹 초기 화면 Paper Prototyping)

 

2. 디자인 UI를 통한 Paper Prototyping

(보솜이 육아수첩 메인 UI Interaction을 위한 Paper Prototyping)

3. 플래시를 활용한 Prototyping

(롯데백화점 메뉴 및 화면 전환 Interaction Guide)

 

위에서 제시한 표현의 방법은 어디까지나 기초적인 설계를 위한 과정에 있는 산출물이고, 최종본으로 가기 위한 구체적인 설계와 제작 방법론은 내부 팀의 구성인원과 상황에 맞게끔 얼마든지 쉽고 빠르게 제작할 수 있다. 단순하다고 생각하는가? 맞다. 같은 프로젝트에 참여하고 있는 다양한 직군의 사람들에게 의도를 전달하고 싶은가? 위의 3가지 방법이라면 쉽고 빠르게, 상황에 맞는 설득력 있는 프로젝트 전개를 기대해도 좋지 않을까?

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다

이 사이트는 Akismet을 사용하여 스팸을 줄입니다. 댓글 데이터가 어떻게 처리되는지 알아보세요.

Paper Prototyping

PC웹, 모바일웹, 애플리케이션 그리고 애플워치 등의 새로운 디바이스까지, 점점 더 다양한 Interaction이 발생하는 화면들을 만나게 된다. 특히 이를 제작하는 과정에 있어서 초기 의도된 방향의 화면을 어떻게 작동하게 할 것인가에 대한 고민을 모바일그룹에서는 다음과 같이 진행했었다. 아래에서는 Paper를 통해 다양한 실험적인 사례들을 미리 만들어 볼 수 있도록 쉽고 빠른 설계 방법론이다. 특히 모바일에서 작동되는 다양한 UI에 […]