brunch

라이킷 195 댓글 3

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 유플리트 Aug 22. 2019

2020년 UX Design Trends 下

U-Biz Consulting Div.

해당 글은 2019년 5월 31일, Tencent에서 발간한 2019-2020년 디자인 트렌드 리포트 중 UX(사용자경험)에 대한 내용을 번역하여 옮긴 글입니다.일부 재해석과 한국식 변형 표현이 포함되어 있습니다.

2020년 UX Design Trends 上 편에서 이어지는 내용입니다.

07. Design for Content

"밤 늦은 시간이라는 것을 알지만 잠을 자지 않는다(know that it's too late but do not sleep at night)"는 사람들이 점점 더 많아지고 있으며, 콘텐츠를 소비하는 단편적이고 한가로운 시간이 더 많아졌기 때문에 더욱 몰입감 있는 앱 디자인이 필요합니다.

07-1. Comfortable and Convenient using experience

(편안하고 편리한 사용 경험)

화면의 크기가 커지면 사용자의 일상적인 작업의 편의성에 영향을 줍니다. 인터페이스 디자인이 어떻게 큰 화면에서의 운영 효율성과 경험을 향상시킬 수 있을까요? 삼성의 One UI는 디스플레이 화면을 콘텐츠를 볼 수 있는 상단 영역과 상호 작용을 위한 하단 영역의 두 영역으로 나눠 사용자의 편의성을 확보하고 있습니다.

페이지 전환이 용이하도록 종료를 하기 위한 슬라이딩 제스처가 추가됩니다.

화면에 표시되는 작업과 콘텐츠는 사용자의 행동에 따라 달라집니다. 사용자는 완료된 작업을 보다 쉽게 알 수 있고 다음 단계를 빠르게 처리할 수 있습니다. 정보는 사용자가 필요한 순간에 제공되어 사용자의 인지 부하를 줄여줍니다.

유연하고 연결성 있는 페이지 전환을 통해 사용자가 페이지를 이동하는 동안 경로를 더 잘 기억할 수 있도록 도와주고, 편안한 경험을 제공합니다. 페이지 간 전환은 더 이상 단순히 진입하고 나오는 형태가 아니라, 콘텐츠 양식에 따라 유연하게 전환됩니다. 사용자가 제스처를 통해 페이지에 지시된 작업을 수행할 때 일관된 조작 경험이 가능합니다.

07-2. Immersive full-screen performance (몰입형 풀 스크린)

많은 제품들이 더 나은 콘텐츠를 제공하기 위해 상단의 '컬러 블록' 디자인을 제거했습니다. 사용자에게 보다 몰입감 있는 경험을 제공하기 위해 틀에 박힌 사용자 세분화는 더 이상 쓰이지 않을 것입니다. 그중에서 흰색과 검은색의 풀 스크린 배경색은 콘텐츠 자체의 차별화를 강조할 수 있는 컬러입니다.

19년 4월 말, Facebook은 더 단순하고 몰입적인 FB5 디자인 스타일을 새롭게 도입했습니다. 상단에 짙은 블루 컬러의 블록 디자인을 제거하고 새로 추가된 '다크 모드'가 비디오 시청 화면에서 나타납니다. 이런 방식은 비디오 콘텐츠를 보는 데에 더 좋은 환경을 제공합니다.

다크 모드는 앱 디자인에서 더 많이 보입니다. 콘텐츠를 탐색하는 동안 사용자의 '몰입'을 만족시키면서, 사용자가 다크 모드로 설정하면 밤 중이나 어두운 환경에서 화면으로 인한 시각적 피로를 줄여줍니다.

07-3. User deep participation in content (콘텐츠에 대한 사용자의 적극적인 개입)

밀레니얼 세대는 다양한 인터랙티브한 경험을 선호하며 인터랙션이 결합된 콘텐츠는 새로운 가능성을 보여줍니다. 인터랙티브 비디오를 통해 사용자는 참여 의식을 높이고 개인화된 게임 경험을 얻을 수 있을 뿐만 아니라, 더욱 재미있고 참신한 콘텐츠를 만들 수 있습니다.

영화, 게임 및 온라인 드라마는 모두 인터랙티브형 작품을 출시했습니다. 사용자는 선택에 참여하기 위해 주도적인 역할을 수행하고 매우 개인화된 콘텐츠가 포함시키도록 합니다. 인터랙티브 비디오는 스토리 콘텐츠의 품질을 보장할 뿐만 아니라 상호적인 경험을 보장합니다. 콘텐츠와 의미 있는 교감과 스토리의 흐름을 좌우하는 인터랙티브가 효과적이어야 사용자의 감성을 더욱 자극할 수 있습니다.

07-4. Content from eye-catching to money-catching

(눈길을 끄는 것부터 결제 유도까지의 콘텐츠)

밀레니얼 세대는 TV 시청보다는 주로 스마트폰으로 제품이나 서비스를 얻어 냅니다. 모바일 결제는 사용자의 결제 습관을 바꾸어 놓았으며, 사용자는 관심 있는 콘텐츠에 대해 기꺼이 지불합니다.

콘텐츠 기반의 이커머스는 쇼핑을 하러 온 사용자가 콘텐츠를 소비하는 동안 보다 풍부하고 재미있는 경험을 제공합니다.

08. Perceptual aesthetic improvement

젊은 인터넷 사용자는 빠르게 발전하는 기술과 문화 환경에서 성장하고 있습니다. 자연스럽게 이들은 제품에 대한 심미적 기준이 더 높아졌습니다. 최근 몇 년 동안, 자신만의 개성을 가진 '작고 아름다운' 디자인 또한 사용자에게 깊은 인상을 남기기 쉬워졌습니다.

08-1. Symbolized icon design (상직적인 아이콘 설계)

Office365의 새로운 아이콘 디자인에서 추상적이고 상징적으로 변한 아이콘 표현을 볼 수 있습니다. 아이콘의 구체적인(텍스트 영역)의 비율을 줄이고 추상적인 모양을 통해 의미를 표현합니다. 아이콘은 보다 간결하고 기하학적인 방향으로 진화하면서 색채와 질감이 풍부한 형태로 아이덴티티를 충족시키고 있습니다.

더불어 아이콘 디자인은 변형에 있어서 적합하고 효율적으로 만들어집니다. Office는 다른 플랫폼에서도 응용 프로그램 확장을 수용할 수 있도록 SVG 형식의 리소스를 사용합니다.

08-2. Close to the natural operational response (자연스러운 작동 반응)

3D 요소 활용, 애니메이션 구현과 같은 기술 성능의 발전으로 반응형 애니메이션의 성능은 더욱 정교해질 것입니다. 포물선 운동(Arc motion), 광각(Light Perception), 조각의 움직임(Particle Performance), 3차원 공간(three-dimensional space) 등 자연을 모방한 모션의 법칙이 더욱 대중화될 것이며, 제품의 디자인 성능을 향상할 것입니다.

인터페이스 내 컨트롤러의 경우, 실제 물리적 규칙에 가깝게 디자인될 것입니다. 디자이너는 애니메이션의 움직임을 통해 조작 장치를 표현함으로써 보다 사실적인 느낌을 줄 수 있습니다.

흥미로운 반응형 애니메이션은 사용자에게 더 즐겁고 친밀한 느낌을 줄 수 있으며, 애니메이션에서 더 많은 '인간다움'을 구현하는 것이 즐거운 경험을 제공하는 비결입니다. 사용자는 아이콘으로 전달되는 감정과 성격을 느낄 수 있습니다.

08-3. Stylization illustration performance (일러스트레이션의 스타일화)

심미적인 향상이 주는 가장 직관적인 느낌은 바로 기하학적 요소의 자체 진보입니다. 따라서 인터페이스의 일러스트에서 시각적 아트가 중요해졌습니다. 사용자는 오랜 기간 동안 쓰인 비슷비슷한 기하학적 형태나 간단한 선형 아이콘에 지쳤으며, 반면 개인화된 캐릭터 퍼포먼스와 페인팅 기술이 젊은이들에게 더 인기가 있습니다.

08-4. Easter Egg (이스터에그)

점점 더 많은 이스터에그가 영화에서 인기를 끌고 있으며, 작은 이스터에그는 사용자에게 놀라움과 인식의 경험을 줄 수 있습니다. 몇몇 흥미로운 디자인은 사용자 요구를 충족시키고 사용자 경험을 창출합니다.

Google 검색에서는 <Avengers : End game>의 타노스와 관련된 이스터 에그를 숨겨두었습니다. 영화의 시그니처이기도 한 '인피니티 건틀렛'* 버튼을 클릭하면 검색 결과가 무작위로 절반이 사라집니다.

*번역자 추가 : 영화 내에서 인피니티 건틀렛을 착용하고 손가락을 튕기면 지구인의 절반이 사라진다는 설정이 있음

또한 Chrome의 생일에는 페이지 오류 시 나타나는 Dino Game에 파티 요소를 추가해 이스터에그를 설정했습니다. 러닝 게임을 하는 작은 공룡은 케이크를 먹을 때 생일 모자를 착용하게 됩니다.

구글 맵스 (Google Maps)는 만우절을 위한 이벤트로 Snake 이스터 에그 게임을 제공했습니다. 지도 내에서 지하철 또는 버스로 이루어진 뱀이 지도의 다른 목표물을 먹으면서 점점 길어집니다.

END.

2019년에 우리는 기술이 디자인과 경험에 미치는 큰 영향을 볼 수 있습니다. <혁신자의 딜레마> 책에서는 '느린 기술부터 빠른 기술, 병목 현상에 이르기까지 모든 기술은 조용히 싹을 틔우고 이전 기술을 대체할 것이다.'라는 구절이 나옵니다. 기술 중심으로 인해 일부 디자인 트렌드가 갑자기 사라지고 기술의 전복으로 인해 사라질 수도 있습니다. 디자이너로서, 혁신과 디자인 향상을 위해 트렌드의 변수와 상수를 인지하는 방법을 배워야 합니다.

기술과 제품은 궁극적으로 사람 중심으로 돌아가고 있습니다. 따라서 디자이너는 인간 본성의 깊은 내면에 있는 니즈를 이해해야 합니다. 화면 내에 있는 디자인에만 초점을 맞추는 것이 아니라 스크린 밖의 디자인에도 주의를 기울여야 합니다. 즉, 제품이나 서비스를 사용하는 사람을 위한 디자인을 향상시키는 것이 넥스트 트렌드입니다.