PART_3. 인터렉션 디자인 (INTERACTION DESIGN)
*** 빠른 편집 (Instant Edit) ***
- 사용자들은 정보의 소비하는 차우너을 넘어 생산, 참여, 공유까지 그 활동 영역을 넓히고 있음
- 사용자들은 콘텐츠 편집을 위해 보다 많은 시간과 노력을 기울임
- 잦은 편집이 요구되는 서비스라면 편집 인터랙션이 쉽고 편리해야함
- 한두글자를 바꾸려해도 편집화면으로 이동하며, 복잡한 편집화면에서 편집하려는 부분을 찾아야하는 번거로움
- AJAX의 사용은 원하는 부분만을 선택하여 페이지 이동 없이 편집할 수 있게 함
- 콘텐츠의 구조화를 통해 마이크로콘텐츠로 분할되어야 빠른 편집(instant edit, inline edit)이 가능
- 기술적으로 마이크로콘텐츠마다 개별 편집이 가능하다면, 디자인 축면에서는 '편집가능한 콘텐츠'라는 사실을 어떻게 인지시킬지에대한 창의적 사고가 필요함
- 일반적으로 시각적 단서(visual cue, static cue)를 제공하여 눈으로 확인할 수 있게 하거나 사용자가 마우스를 대면 배경색이나 레이블이 반응하는 인터랙션 패턴을 사용
- 자동저장(auto complete)처럼 그 과정이 신속히 진행되기 때문에 편집과정을 확인시킬 필요가 있음
- 편집과정을 강조하게되면 취지를 살릴수 없기때문에 번거롭지않은 수숭에서 이루어 질수 있도록 함
- Flickr.com 처럼 편집모드를 제공하고 컨트롤 버튼을 통해 편집과정을 완료하는 방식을 많이 사용
벤치마킹
http://www.flickr.com
- 마이크로콘텐츠(사진제목, 설명)에 마우스를 대면 마우스 커서와 제목의 배경색이 노랑으로 바뀌고 마우스를 클릭하면 편집모드로 전환되면서 텍스트 필드와 컨트롤 버튼이 나타남
- 마우스커서가 편집영역을 정확히 조준하지않아도 편집영역을 찾을수 있도록 Label 태그를 사용하고있음
- 읽기모드에서 편집가능여부를 판단하기어렵고 마우스 클릭을 통해 편집 모드로 전환된다는 사실을 학습시켜야하는 단점이있음
관련이론
마이크로콘텐츠 (Microcontent)
- 웹사이트는 웹사이트 > 페이지 > 구성요소 > 세부 구성요소 순으로 잘게 나눌수 있으며(마이크로화), 이렇게 작게 나누어진 콘텐츠를 마이크로콘텐츠라 함
- 마이크로콘텐츠는 고유한 아이텐티티와 URL을 가지므로 완전하고 독립된 콘텐츠로써 네트워크상에서 출판, 구독, 링크될 수 있는 대상임
출처: 웹2.0기획과 디자인(노주환)
*** 빠른 편집 (Instant Edit) ***
- 사용자들은 정보의 소비하는 차우너을 넘어 생산, 참여, 공유까지 그 활동 영역을 넓히고 있음
- 사용자들은 콘텐츠 편집을 위해 보다 많은 시간과 노력을 기울임
- 잦은 편집이 요구되는 서비스라면 편집 인터랙션이 쉽고 편리해야함
- 한두글자를 바꾸려해도 편집화면으로 이동하며, 복잡한 편집화면에서 편집하려는 부분을 찾아야하는 번거로움
- AJAX의 사용은 원하는 부분만을 선택하여 페이지 이동 없이 편집할 수 있게 함
- 콘텐츠의 구조화를 통해 마이크로콘텐츠로 분할되어야 빠른 편집(instant edit, inline edit)이 가능
- 기술적으로 마이크로콘텐츠마다 개별 편집이 가능하다면, 디자인 축면에서는 '편집가능한 콘텐츠'라는 사실을 어떻게 인지시킬지에대한 창의적 사고가 필요함
- 일반적으로 시각적 단서(visual cue, static cue)를 제공하여 눈으로 확인할 수 있게 하거나 사용자가 마우스를 대면 배경색이나 레이블이 반응하는 인터랙션 패턴을 사용
- 자동저장(auto complete)처럼 그 과정이 신속히 진행되기 때문에 편집과정을 확인시킬 필요가 있음
- 편집과정을 강조하게되면 취지를 살릴수 없기때문에 번거롭지않은 수숭에서 이루어 질수 있도록 함
- Flickr.com 처럼 편집모드를 제공하고 컨트롤 버튼을 통해 편집과정을 완료하는 방식을 많이 사용
벤치마킹
http://www.flickr.com
- 마이크로콘텐츠(사진제목, 설명)에 마우스를 대면 마우스 커서와 제목의 배경색이 노랑으로 바뀌고 마우스를 클릭하면 편집모드로 전환되면서 텍스트 필드와 컨트롤 버튼이 나타남
- 마우스커서가 편집영역을 정확히 조준하지않아도 편집영역을 찾을수 있도록 Label 태그를 사용하고있음
- 읽기모드에서 편집가능여부를 판단하기어렵고 마우스 클릭을 통해 편집 모드로 전환된다는 사실을 학습시켜야하는 단점이있음
관련이론
마이크로콘텐츠 (Microcontent)
- 웹사이트는 웹사이트 > 페이지 > 구성요소 > 세부 구성요소 순으로 잘게 나눌수 있으며(마이크로화), 이렇게 작게 나누어진 콘텐츠를 마이크로콘텐츠라 함
- 마이크로콘텐츠는 고유한 아이텐티티와 URL을 가지므로 완전하고 독립된 콘텐츠로써 네트워크상에서 출판, 구독, 링크될 수 있는 대상임
출처: 웹2.0기획과 디자인(노주환)