PART_3_6. 인터렉션 디자인 (INTERACTION DESIGN)

PART_3. 인터렉션 디자인 (INTERACTION DESIGN)

*** 미리보기 팝업 (Quick Read Pop-up) ***

- 마우스 오버시 상세 정보를 팝업형식으로 보여줌으로써 제한된 공간 안에서 더 많은 정보를 제공
- 메뉴를 팝업시켜 컨트롤을 제어할 수 있는 기능을 제공

- 공간할용도를 높이고 사용자의 진로를 유지시켜줌
- 사용자의 조작에 의해서만 작동
- 소극적이거니 주의를 기울이지 않는 사용자를 고려해 핵심내용을 찹업으로 보여주는것은 바람직하지않음

- 기존내용 위에 튀어 오르는 방식이므로 입체적이어야함 - 3차원레이어기법(Three-dimensional Lavering)
- 기존내용과 시각적으로 구별이 되도록 움직임, 배경색, 테두리 등의 시각효과가 필요

- 정보구조의 깊이를 조절할 수 있기때문에 사용성과 효율성을 향상시킬수 있음





벤치마킹

http://www.amazon.com/

- 모든 카테고리의 보기 버튼에 팝업기법을 채택

http://www.netflix.com/

- DVD 제목에 마우스 오버시 팝업으로 정보 제공
- 음영을 통한 입체감 으로 표현

http://www.vox.com/

- 온라인 양식의 특정 필드가 마우스나 키보드에 의해 선택되면 설명글이 즉각적으로 팝업됨





관련이론

레이어기법

- 2차원 레이어기법(Two-dimensional Layering) : 정보의 복잡성을 줄이고 정보간의 관계성을 증진시키기위해 사용(포토샵 레이어팔레트)

- 3차원 레이어기법(Three-dimensional Layering) : 정보를 보다 정교하게 전달하거나 컨텍스트 전환없이 정보를 설명하기 위해 사용(대화창)










출처: 웹2.0기획과 디자인(노주환)