플러스엑스 UI패키지 강의 후기 - (23)

◆ 오늘 수강/복습 할 부분
Part4. UI 인터랙션 디자인 
- 인터랙션 디자인
 
 
◆ 정리 및 느낀점
- 인터랙션 디자인은 어떻게 만들어 지는 것일까? 나는 그동안 레퍼런스만을 계속 참고했는데, 이번 강의에서 어떻게 구체적으로 인터랙션을 디자인하게 되는지에 대해 배울 수 있었다.

 

- 1단계 ) concept 잡기 : 성격과 분위기에 맞는 컨셉을 잡는다.

1) Brand Identity에 따라 컨셉 잡기 : 예를들어 브랜드과 경쾌하고, 친근하고, 부드럽다면 인터랙션의 움직임도 거기에 맞추어 진행한다. 인터랙션이 시각적인 것이라 강의에 있던 에어 프리미아 예시를 보니 바로 이해할 수 있었음

2) Contents & Elements : 가장 많이 사용되는 것으로 콘텐츠와 요소요소에 인터랙션을 넣어 화면탐색 하는 재미를 주고, 장시간 사용을 유도 하는 방법!

3) Gesture에 따른 컨셉 : tocuh screen 기반인 것과, PC환경 기반인경우, 원격제어장치인 경우 조금씩 다르다. 터치스크린 기반인 경우 터치 영역이 쉬울 수 있도록 디자인해야하고, PC환경인 경우 호버등 여러가지를 활용가능하다. 마지막으로 원격제어장치는 리모콘이나, 닌텐도 같은 게임 컨트롤기를 말하는데, 필요에 따라 제스쳐를 통해 컨셉을 잡기도 한다. 

4) Development Skill을 고려한 컨셉 잡기: 기존의 인터랙션을 참고해서 디자인을 개발하는 경우가 있는데, 이 경우 구현가능 여부를 개발자분과 필히 확인해야 한다고한다. 개발자마다, 사용하는 언어마다, 개발환경마다 다를 수있기 때문에 개발 가능여부를 꼭 확인하기! 

 

- 2단계 Research 단계 : 레퍼런스를 찾고, 컨셉 무드보드를 만들어서 이해관계자들과 공유하는 것인데, 이 과정에서 컨셉 무드보드가 많은 역할을 함으로 가장 중요하고, 톤앤매너를 잘 맞춰야 한다고 한다.(concept에 맞는 refer 구분 능력 필요) 특히 인터랙션만 보여주는 것이 아니라 UI 디자인도 같이 공유하면서 전반적으로 큰 그림을 함께 볼 수 있도록 해주는게 좋은듯. 

 

- 3단계 design 단계 : 리써치가 끝나면 디자인을 한다. 

1) 상황별 케이스를 정리해본다. : 상태별로 어떻게 변화할지 이를 일관성있게 그려낼 수 있다.

2) 테스트를 해본다. : 방향이나 속도감을 테스트 해보고, 적절한 안을 찾는다

3) 인터랙션 가이드를 제작한다. : 케이스별로 인터랙션을 정의하고, 방향, 타이밍등 구체적인 디렉션을 작성한다.

 

- 인터랙션 디자인은 에펙을 꼭 알아야만 한다고 생각했는데, 막상 인터랙션 가이드 예시로 나온것을 살짝 보니까.. 이미지로도 충분히 줄 수가 있구나 하는 생각이 들었다. 앞으로 남은 인터랙션 디자인 강의들 잘 들어보면서 나도 실무에 적용할 수 있도록 노력해야지! 
 
◆ 그럼 오늘의 수강 인증 샷!