728x90
모바일에서의 소소해 보이지만 중요하고 재미있어보지지만 의미있는 UX인 트랜지션과 애니메이션에 대해서 정리해보았습니다.
페이지 내 대부분의 사례가 동영상이었는데 Slide Share에 PDF로 올리니 확인이 어려운건 아쉽네요. :(
(2014년 7월, UX월드 발표자료)
목차
NUI의 등장
1) NUI의 등장
2) NUI의 동작
트랜지션
1) 길을 잃지 않도록 해줌
2) 스토리텔링을 도와줌
3) 공간감각을 만들어줌
애니메이션
1) 행위에 대한 결과를 알려줌
2) 현재 진행상태를 보여줌
3) 사용자 행위를 유도함
4) 부가적인 정보를 보여줌
5) 감성적 재미요소를 제공함
트랜지션과 애니메이션 디자인 고려사항
1) 과한 애니메이션을 자제할 수 있어야 함 (Exercising Restraint)
2) 일관성을 유지할 수 있어야 함 (Maintaining Consistency)
3) 다양한 원칙들을 조합할 수 있어야 함 (Compounding Complementary Principles)
트랜지션과 애니메이션 디자인하기
1) 세상 아래 새로운 것 없다 (잘 정리된 아카이빙 사이트 이용, 직접 레코딩하기)
2) 새로운 혁신은 만들기 나름 (가장 익숙한 툴 활용, 개발자와 함께 진행, 적절한 프로토타이핑 툴 활용)
* Animation is a great way to provide feedback to users, as long as it's both subtle and meaningful. Although animation pervades iPhone OS, it is used to enhance the user's experience. not as the focus of the user's experience. - iPhone HIG, June 2008
* Conveying a sense of kinetic realism is going to be a Key Differentiator in next generation apps. - Mike Stern, User Interface Design for iOS7 Apps, Apple's iOS 7 Tech Talk
* Motion is the world of material design is not only beautiful, it builds meaning about the spatial relationships, functionality, and intention of the system - Google Material Design