2023년, UX/UI 트렌드 파악하기
패션, 뷰티, SNS, 라이프스타일 등 우리 일상의 모든 곳에는 트렌드가 존재한다는 사실 알고 계시나요? 지난 몇 년 간 코로나19, 팬데믹 등을 겪으며 트렌드 변화 속도는 점점 더 빨라지고 있습니다. 특히 언택트 시대가 본격적으로 도래하면서 UX/UI 분야는 더욱더 민감하고 빠르게 변화하고 있습니다. 따라서 UX/UI 분야 종사자라면 최신 트렌드를 지속적으로 업데이트하는 것은 이제 당연한 일이겠죠.
오늘은 2023년 주목해야 할 6가지 UX/UI 트렌드를 소개합니다.
1. 가상현실과 증강현실
물리적 세계와 디지털 세계를 연결해 주는 가상현실(VR, Virtual Reality), 증강 현실(AR, Augmented Reality) 기술은 게임 분야에서 주로 사용되었습니다. 하지만 최근에는 게임뿐만 아니라 전시, 뷰티, 패션, 인테리어 등 다양한 분야에서도 널리 활용되고 있습니다.
그래프 출처 : https://me2.kr/SdJsy최근 연구에 따르면 증강 현실에서 제품을 먼저 경험해 본 사용자의 구매 전환율이 그 반대 대조군에 비해 94% 증가한 것으로 나타났습니다. 가상현실 기술을 통해 사용자는 서비스 경험을 향상시키고 기업은 잠재적 고객에게 더 쉽게 다가갈 수 있게 된 것입니다. 이처럼 VR/AR 기술은 기업의 매출 상승과도 연관되어 앞으로 더 다양한 분야에서 널리 활용될 것으로 기대됩니다.
저희 비이크도 기업은행, KT 네트워크, 문화재청 등과 함께 다양한 VR/AR 프로젝트를 수행해 왔습니다. VR/AR에 관련해 더 자세한 이야기는 여기를 참고해 주세요!
2. 다크/라이트 모드 전환 옵션
Building a Dark Mode Theme Toggle by Ryan Finni서비스를 이용하면서 다크 모드, 라이트 모드를 전환할 수 있는 버튼을 본 적 있으신가요? 어두운 장소에서 서비스를 이용하거나 시각 관련 장애가 있는 사용자들을 위해 다크 모드로 전환할 수 있는 기능이 점차 확대되고 있습니다.
Dark Vs Light by Dejan Markovic - Dribble특정 사용자들뿐만 아니라 일반 사용자들도 블루 라이트 차단, 시각적 피로 감소, 배터리 절약 등 다양한 이유로 다크 모드를 선호하고 있죠. 하지만 다크 모드에 비해 뛰어난 가독성, 정확한 컬러 표현 등의 이유로 라이트 모드를 선호하는 사용자도 많습니다. 따라서 앞으로 다크/라이트 모드 전환 기능은 반응형 UI와 같은 표준화의 일부가 될 것으로 보입니다.
3. 고도화된 마이크로 인터랙션
Twitter Retweet by Jason Zigrino - Dribble마이크로 인터랙션은 버튼, 막대 등 다양한 요소를 통해 사용자와 상호작용 하는 것을 말합니다. 대표적으로 인스타그램의 '좋아요'와 트위터의 '리트윗' 기능을 떠올리면 쉽죠. 이 같은 상호작용은 너무 자연스럽게 UI에 녹아있기 때문에 사용자들은 어쩌면 인터랙션의 존재를 인지하지 못할 수도 있습니다. 하지만 마이크로 인터랙션은 사용자에게 시스템의 현재 상태와 결과를 명확하게 전달할 수 있기 때문에 사용자의 이해를 돕는 중요한 역할을 합니다.
Tab bar by Bonniebom - Dirbble더불어 창의적인 인터랙션은 사용자의 관심을 얻을 뿐만 아니라 참여도를 높이면서 사용자와 인터페이스를 감정적으로 연결해 주기도 합니다. 따라서 우리는 이를 고도화함으로써 조금 더 눈에 띄지 않지만 사용자에게 더 편리하고 재밌는 경험을 제공하도록 해야 합니다.
최근에는 LottieFiles의 라이브러리를 통해 더욱 쉽게 디자인이 가능해져 점점 더 섬세해지는 인터랙션을 기대해봐도 좋을 것 같습니다.
4. 마이크로 카피
마이크로 카피란 무엇일까요? 사전적 정의를 살펴보면 '사용자 인터페이스에서 사용자가 취하는 행동에 직접 관련된 단어나 문구'입니다. '마이크로카피 2/e'의 저자이자 디지털 콘텐츠 전략가인 '킨너렛 이프라'는 마이크로 카피는 '소소하지만 인터페이스 곳곳에 퍼져 사용자가 맛을 잃지 않게 해주는 잘 배인 양념 같은 역할'을 한다고 말합니다.
토스의 버튼을 예로 들어볼까요? 병원에서 서류를 받았는지 확인하는 버튼에 '네 / 아니오' 대신 '아직이요 / 받았어요'라는 카피를 사용했습니다. 자동 로그인 설정 버튼에도 '자동 로그인 허용'같은 딱딱한 카피가 아닌 '네, 좋아요 / 다음에 할게요'를 사용했습니다. 작은 버튼에도 친절한 카피를 사용함으로써 사용자들은 혼란을 줄이고 브랜드와 긍정적인 상호작용을 경험하게 됩니다.
이처럼 마이크로 카피는 사용자가 서비스를 사용하는 동안 혼란을 덜어줌과 동시에 사용성을 향상시켜 긍정적인 경험을 제공하는 역할을 합니다. 더불어 경쟁 업체 사이에서 서비스와 어울리는 마이크로 카피로 브랜딩을 한다면 차별성을 갖춰 경쟁력을 얻을 수도 있을 것입니다. 좋은 UX Writing 사례로 꼽히는 대표적인 서비스인 '토스'에서는 최근 UX 라이터 직군을 따로 세팅하면서 카피의 중요성이 더욱 알려지고 있습니다. 토스뿐만 아니라 앞으로 많은 서비스들에서 버튼의 문구 하나까지도 신중하게 고려해야 할 것입니다.
5. 미니멀리즘
Appointment booking by Johny vino™ - Dribble작은 모바일 화면에서 복잡한 UI는 사용자에게 정보의 혼란을 주기 쉽습니다. 미니멀리즘(Minimalism)과 단순화가 적용된 UI 디자인은 복잡하거나 많은 양의 정보를 보여주기에 좋습니다.
중앙그룹 홈페이지인터랙션을 사용하는 과정에서는 디자인이 필요 이상으로 복잡해지기도 하는데 미니멀리즘 및 단순화된 디자인은 최소한의 인터페이스를 사용하고 디자인을 덜어내어 직관적인 UX를 제공합니다. 위 이미지의 중앙그룹 홈페이지는 강한 이미지에 최소한의 타이포를 볼드하게 얹어 메인을 구성했습니다. 많은 요소가 있지 않지만 꽉 차 보이고 힘이 느껴지지 않나요? MZ 세대를 타겟으로 한 '브랜디', '무신사'와 같은 모바일 커머스 앱 또한 이런 트렌드를 적극 반영하고 있습니다.
6. 글래스모피즘
Frosted glass ui design by heima ux - Behance글래스모피즘(Glassmorphism)은 물체가 떠 있는 듯한 시각적 계층을 표현하는 그래픽 스타일입니다. 투명도를 조절하여 배경을 흐리게 처리해 개체가 반투명한 유리처럼 보이게 되는 거죠. 이는 사용자로 하여금 어떤 레이어가 상위에 있는지 본능적으로 알아차리게 하여, 깊이와 주목성 있는 디자인이 가능합니다.
이는 2020년에 출시된 Mac OS 빅서(Big Sur)와 Window11 응용 프로그램에도 활용되면서 더욱 인기를 끌고 있습니다. 최근 유행하는 크고 볼드한 폰트 스타일과 잘 어울릴 뿐만 아니라 위에 소개해 드린 미니멀리즘과도 조화롭게 어울려 오랫동안 트렌디한 디자인으로 자리 잡고 있습니다.
마치며
여기까지 2023년 UX/UI 트렌드를 알아보았습니다. 새로운 트렌드는 기존에 익숙한 상태와 기술을 더 발전하기 위해 존재합니다. 때문에 나에게 익숙하고 편한 방식만 고집하기보다는 트렌드를 받아들이고 새로운 기술과 방식을 적용하면서 사용자에게 더 긍정적인 경험을 줄 수 있도록 도전해 보는 건 어떨까요?
출처
UI/UX Design Trends For 2023
https://shakuro.com/blog/ui-ux-design-trends-for-2023
2023: Top UI UX Trends you need to know
https://uiuxtrend.com/top-ui-ux-trends-2023-you-need-to-know/#light-mode-with-dark-mode
마이크로인터랙션 움짤로 알아보기
https://dbdlab.tistory.com/entry/microinteraction
마이크로인터랙션 베스트 사례
https://brunch.co.kr/@ebprux/61
마이크로카피 이야기 : 토스의 UX Writing
https://yozm.wishket.com/magazine/detail/1262/
마이크로카피 : 카피도 디자인이다
