“우리가 속한 사회와 주변 환경이 끊임없이 변화함에 따라 사용자가 원하는 경험도 더욱 다양해졌고, 진보된 기술력을 바탕으로 혁신적인 제품이 지속해서 출시되며 오늘날 우리 일상이 바뀌고 있습니다. 이러한 변화의 흐름 속에서도 사용자가 언제나 편안하고 즐거운 모바일 경험을 할 수 있도록, One UI는 고객의 목소리에 귀 기울이며 발전해 나갈 것입니다.”

– 홍유진 부사장 / 삼성전자 MX사업부 UX팀장

One UI 4의 깔끔한 디자인과 짜임새 있는 구조는 누구에게나 자연스러운 사용 경험을 선사한다. 개개인에 따라 섬세하게 맞춤 설정을 할 수 있는 인터페이스로 사용자는 자신의 개성과 스타일을 자유롭게 표현할 수 있고, 편리한 사용과 강력한 보안을 바탕으로 한 차원 높은 모바일 경험을 누릴 수 있다. One UI 4 디자이너들에게 한층 업그레이드된 UI에 관해 들어 봤다.

* 본 콘텐츠 이미지는 이해를 돕기 위해 연출된 이미지입니다. 실제 제품은 차이가 있을 수 있고, 세부 사양은 국가, 지역, 모델, 통신사별로 다를 수 있습니다.

중요한 정보에 집중할 수 있게… 더욱 명확하고 깔끔해진 UI

One UI 4는 불필요한 요소를 걷어내어 중요한 내용부터 먼저 눈에 들어오도록 구성했다. 정보의 배열과 디자인을 깔끔하게 정리해서 한 눈에 우선순위를 파악할 수 있게 했으며, 정보를 직관적으로 이해할 수 있게 컬러와 텍스트도 정돈했다. 또한, 정보를 레이어로 구분하고 시각적 방해 요소들을 과감히 없애, 더욱더 깔끔한 앱 화면을 구현했다.

Q. 컬러 시스템을 개편한 이유는 무엇이고 어떤 부분을 중점적으로 작업했나.

이번 컬러 시스템 개편의 키워드는 ‘정제(Clean-up)’다. 가장 중요한 정보에 컬러를 우선 적용하고, 상대적으로 덜 중요한 정보를 모노톤으로 바꾸는 방식으로 작업을 진행했다.

Q. 유사한 의미를 가진 기능적 색상(Functional Color)을 레드와 그린 중심으로 통일한 작업에 관해 설명해달라.

레드 색상은 중지(Stop), 삭제(Delete), 제거(Remove), 거절(Reject), 감소(Decrease) 등의 의미를 표현한다. One UI 4 이전에는 유사한 의미를 가진 요소들의 색이 조금씩 달랐으나 이번에는 하나의 레드로 통일해 사용자들이 각 기능의 맥락을 명확히 이해할 수 있도록 하는 데 중점을 뒀다. 또한 레드와 그린으로 통일하면서도 명도와 채도를 살짝 높여 기존보다 시인성을 높였다.

Q. 전체적인 폰트 정돈을 위해 조정한 자간과 볼드체에 관해 설명해달라.

정보의 우선순위에 따라 시각 대비를 조정함으로써 기존에 비해 정보의 강약이 두드러지게 작업했다. 콘텐츠의 중요도에 따라 폰트 사이즈와 굵기를 조정하며 최적의 네거티브 스페이스(Negative Space)를 완성했다.

Q. 새로운 날씨 아이콘과 함께 전체적으로 깔끔하고 세련되게 바뀐 ‘날씨’ 앱에 대해 설명해달라.

정보의 중요도는 사용자에 따라 다르다. 현재 날씨가 중요한 사람도 있고, 하루 동안의 날씨 변화에 더 관심 두는 사람도 있다. 기존에는 이런 정보들이 상단 메인 카드 안에 혼재했지만, One UI 4에서는 ‘현재의 날씨’와 ‘오늘의 날씨’로 분리해서 보인다. 현재 온도, 위치, 날씨 아이콘과 같이 중요한 정보들을 세련된 비주얼로 상단에 배치해서 가독성을 높였다.

Q. 어떤 방식으로 캘린더 앱을 한눈에 보기 쉽게 정리했나.

대부분의 사용자가 하루에 1~3개 정도의 일정을 등록한다는 데이터를 기반으로, 일정이 없는 빈 화면도 어색해 보이지 않도록 디자인했다. 또 기존의 회색 배경을 깨끗한 흰색으로 변경해 월, 일, 일정 등 주요 정보에 대한 주목도를 높였다. 텍스트는 안정적으로 가운데 정렬하고, 주별 정보를 쉽게 파악할 수 있도록 가로선을 추가했다.

Q. 삼성 헬스 앱은 다양한 수치를 효과적으로 배치하면서도 복잡해 보이지 않기 위해 어떤 노력을 했나.

삼성 헬스 앱은 크게 3가지 타입으로 보이게 만들었다. 걸음 수, 심박 수, 스트레스, 혈당과 같이 범위, 진척도, 상태 정보가 중요한 경우엔 바(Bar) 타입이 보기 편하다. 음식 섭취량, 수면 상태, 물 섭취량 등의 정보는 진척도보다 누적 데이터가 중요하기 때문에 심볼(Symbol) 타입으로 표현한다. 그 외 단순히 숫자 자체가 중요한 경우에는 그래프 없이 텍스트로 보여주는 텍스트 온리(Text Only) 타입으로 표현한다.

Q. 이번에 새롭게 선보인 삼성 월렛은 사용자의 중요한 정보가 하나의 앱에 담겨 있기 때문에 간결하면서도 정확한 정보 전달이 중요할 것 같다. 이를 위해 어떤 작업 과정을 거쳤나.

삼성 월렛의 첫 화면인 빠른 실행(Quick Access) 탭은 카드가 쌓여 있는 형태(Stacked View)와 펼쳐진 형태(Expanded View)로 구분이 된다. 쌓여 있는 형태에서는 35%의 비율로 카드의 정보가 보이기 때문에 왼쪽 상단에 로고, 오른쪽 상단에 카드 속성을 보여주는 텍스트를 배치했다. 또 각 카드의 상세 화면에서 성격이 비슷한 정보들은 하나로 묶어 찾기 쉽게 했고, 이용 내역, 작업 실행과 같이 성격이 다른 정보와 기능들은 시각적으로 분리했다.

One UI 4로 언제 어디서나 안심하고 편리하게…

하루 24시간을 함께하는 스마트 기기에서 개인정보가 유출될 수 있다는 불안함은 누구에게나 있다. One UI 4는 사용자가 걱정이나 불편 없이 언제 어디서나 안심하고 사용하는 것을 중요한 가치로 삼는다. 이를 위해 개인정보 보호에 대해 사용자들의 높아진 기준에 맞춰 다양한 보안 장치를 적용했다.

또한, 사용자들이 스마트 기기를 편리하게 사용할 수 있도록 디테일한 부분도 놓치지 않았다. 다크 모드는 세심한 디테일을 살려 사용자의 시각적 피로도를 줄였다. 다양한 폼팩터에 적용한 일관된 비주얼 디자인은 여러 기기를 넘나들며 사용해도 변함없이 편안한 사용감을 제공한다.

Q. 카메라와 마이크가 켜지면 상단 아이콘으로 확인할 수 있다. 이는 어디에서 아이디어를 얻었나.

최근 수년간 프라이버시와 개인정보 보호에 대한 사용자의 관심이 크게 높아졌다. 우리도 이에 대한 필요성을 충분히 공감하던 중 안드로이드 12 OS에 새로 추가된 기능을 동일하게 적용했다.

Q. 카메라, 마이크, 위치 정보 등의 사용 내역을 확인할 수 있는 퍼미션 대시보드(Permission Dashboard)에 관해 설명해달라.

개인 정보 권한을 획득한 후 각종 센서와 데이터에 접근하고 악용하는 악성 앱이 최근 문제가 되고 있다. 퍼미션 대시보드(Permission dashboard)는 이처럼 불필요한 개인 정보 권한을 요구하는 앱이나, 앱을 사용하지 않을 때도 개인 정보에 접근하는 앱을 확인하고 차단할 수 있다.

Q. 다크 모드의 디자인 디테일은 어떻게 완성되었나.

앱 아이콘의 심미성과 주목도를 해치지 않으면서 시각적 편안함을 높이는 적정 수준의 어둡기를 찾으려 노력했다. 그 결과, 전체 앱 아이콘 컬러를 자연스럽고 균일하게 톤다운 했고, 백색 영역으로 인한 눈부심을 방지하면서도 홈 스크린 요소와의 시각적 균형감까지 모두 만족시킬 수 있는 현재의 어둡기를 최종적으로 적용했다.

Q. 삼성의 다양한 기기를 복합적으로 사용하는 데 불편함이 없도록 신경 쓴 부분이 있다면 무엇인가.

One UI 4는 스마트폰, 태블릿, 스마트워치, PC 등 다양한 제품에 일관된 비주얼을 적용한다. 아이콘, 라운드 처리된 모서리, 구성 요소, 메뉴 스타일과 배치 등을 통일해서 기기를 바꿔도 친숙하고 편리하게 사용할 수 있다.

폭넓은 표현 방식으로 세상 하나밖에 없는 나만의 스마트 기기를…

스마트 기기는 개인의 감정과 개성을 표현하는 도구다. One UI 4는 사용자 개인의 생활과 취향에 맞는 기기 사용을 위해 선택과 변화의 폭을 넓혔다.

기기의 비주얼 테마를 바꾸는 컬러 팔레트 기능을 통해 사용자는 본인의 개성과 취향을 맘껏 드러낼 수 있다. 이모지 페어 기능으로 두 가지 이모지를 조합해 애니메이션을 더할 수 있고, AR 이모지로 나만의 개성이 담긴 아바타를 활용할 수도 있다. 다양한 옵션의 워치페이스로 본인의 취향과 라이프스타일에 맞는 스마트 워치를 꾸밀 수 있으며, 통일감을 주는 비주얼의 위젯들을 더욱 편리하게 사용할 수 있다.

Q. 배경화면의 파티클(Particle) 컨셉은 어떻게 나오게 되었나.

다양한 제품에 두루 적용되면서도 자유로운 표현이 가능한 디자인 요소를 연구했다. 그 과정에서 파티클(Particle)이라는 소재가 가진 잠재력과 확장성을 발견했다.

갤럭시 Z로 예를 들자면, 폴더블 구조를 유지하면서도 제품이 지닌 함축적인 메시지를 담고자 고민하던 중 폴딩 아트에서 영감을 찾았다. 폴딩 아트의 다양성, 강인함, 연속성과 확장성이 갤럭시 Z 폴드의 특징과 닮았다고 생각했다. 갤럭시 Z 플립 또한 유사한 맥락으로 작업하되, 보다 패셔너블하고 독보적인 제품 이미지를 부각하는 방향으로 진행했다.

Q. 배경화면에서 다섯 가지 색을 추출해서 기기의 비주얼 테마를 바꾸는 컬러 팔레트(Color Palette)는 어떤 과정을 거쳐 구현되었나.

컬러 팔레트는 안드로이드 12 Material You – Dynamic Color를 One UI에 맞춰 내재화한 기능이다. 구글과 다른 앱 사용을 지원하기 위해 배경화면에서 추출한 다섯 가지 컬러를 사용한다.

다양한 연구 결과를 검토하던 중, 이미지에서 컬러를 추출하는 방법을 연구하는 디자이너들과 협업하게 되었다. 원본 이미지를 분석해서 컬러 그룹을 나누고, 추출한 컬러의 분포도를 파악할 수 있는 프로토타입을 지원해준 덕분에 최적의 컬러 추출 방식을 찾을 수 있었다.

Q. 초기 단계의 작업에 비해 컬러가 더 차분해졌다고 들었다. 어떤 과정을 거쳤나.

사용자가 콘텐츠에 집중해서 더 편안하게 볼 수 있도록 배경화면의 전반적인 무드만 느껴질 수 있도록 디자인을 수정했다. 초기와 비교해 최종 버전의 배경 컬러 채도는 낮아졌고, 버튼은 눈에 피로를 주지 않으면서도 돋보이는 컬러로 조정했다.

Q. 서로 다른 두 가지 이모지를 다양한 애니메이션으로 표현할 수 있는 이모지 페어(Emoji Pair)에 관해 설명해달라.

‘웃프다’, ‘웃는 게 웃는 게 아니다’처럼 복합적인 감정을 표현하는 이모지는 여태껏 없었다. 다양한 사용자의 목소리를 통해 복합적인 감정 표현에 대한 니즈를 확인했고, 여러 번의 아이디어 회의를 거쳐 이모지 페어가 탄생했다.

Q. 복합적인 감정을 나타내는 이모지 페어로 컨셉이 확장된 이유는 무엇인가.

사용자가 만드는 이모지 조합을 강제할 수 없기 때문에 서로 대립되지 않는 유사한 감정의 이모지를 조합하는 상황도 고려해야 한다고 판단했다. 따라서, 감정 표현의 범위를 양면성에서 복합성으로 확장하게 되었다.

Q. AR 이모지의 세련된 움직임, 위트 있는 제스처가 눈에 띈다. 이러한 모션은 어떻게 만들어지나.

생동감 있는 모션을 위해 애니메이터들이 간단한 동작이나 표정은 키프레임(Key Frame) 방식으로 하나씩 정성스럽게 작업한다. 또한 유명 아티스트와 협업해 전문적인 댄스 동작 등 퀄리티 높은 모션을 만들기도 한다.

Q. 국가나 연령별로 선호하는 AR이모지 스티커는 어떻게 다른가.

한국, 브라질, 미국, 영국 4개국에서 스티커 모션 선호도 조사를 거쳐 AR 이모지 스티커를 제작했다. 국가 간 선호도는 큰 차이가 없었지만 연령대에 따라 약간의 차이가 있었다. 전반적으로 20대가 30대보다 더 우스꽝스럽고 과장된 스티커를 선호했고, 사용자 대부분이 스티커를 사용할 때 진지한 느낌보다 재미있고 유쾌한 인상을 주길 원했다. 따라서, 웃음은 더욱 과장되게 표현하고, 슬픔은 너무 진지하지 않게 표현하고자 했다.

Q. 이번 One UI 4 워치페이스는 어떤 부분에 중점을 뒀는가.

갤럭시 워치 4를 출시할 때 익스프레시브 타입의 스펙트럼을 확장하는데 주력했다. 건강한 식습관을 위한 채소 캐릭터나 챌린지를 위한 곰 캐릭터와 같이 다양한 스타일의 캐릭터를 워치페이스에 적용해 입체적인 라인업을 완성했다.

Q. 다양한 워치페이스를 디자인할 때 어떤 기준을 적용했는가.

워치페이스 간 일관성을 위해 실제 아날로그 시계의 인덱스(Index), 핸드(Hands), 서브 다이얼(Sub Dial)의 종류와 디자인을 참고해서 디자인 시스템을 구축했다. 컬러는 갤럭시 워치 스트랩과 어울릴 수 있도록 스트랩 컬러와 그 주변 색을 1차로 지정하고, 나머지 컬러들은 국제 표색계를 기준으로 구성했다.

Q. 이번 One UI 4 위젯은 전반적으로 단정하고 깔끔한 인상을 준다. 어떤 과정을 거쳤나.

지속적인 협의와 노력 끝에 안드로이드 환경에서 일괄적으로 위젯의 형태를 변경할 수 있게 만들었다. 덕분에 삼성 위젯뿐 아니라 써드 파티(3rd Party) 위젯에도 One UI 비주얼 언어를 적용해 시각적 완성도를 높였다.

위젯은 제공하는 정보 대비 화면 내 사용하는 면적이 넓지 않으므로 시각적 대비를 통해 정보가 한눈에 보이면서도 강조되어야 하는 부분에 시선이 더 쏠리도록 설계했다. 또한, 100% 화이트 배경으로 심플함과 콘텐츠 주목도를 높였다.

삼성전자는 사용자들이 쉽고 편리하게 스마트폰을 사용할 수 있도록, 2018년 11월 One UI를 공개했다. 그리고 2년여간 진화를 거듭해 2020년 12월, 디자인과 효율성, 다양한 기기 간의 경험까지 대폭 개선된 One UI 3이 탄생했다. 뿐만 아니라, 지난 2월 18일부터 One UI 3.1을 통해 신규 기능을 기존 일부 스마트폰에 지원하는 업데이트를 진행 중이다.^[1]

그럼 One UI 3으로 사용자들은 어떤 경험을 누릴 수 있을까? 뉴스룸이 One UI 디자이너들에게 직접 물었다.

One UI 디자인의 4가지 원칙

1) 눈앞의 일에 집중할 수 있도록(Focus on the task at hand) 2) 매끄러운 흐름으로 자연스러운 사용성을(Interact naturally) 3) 시각적인 편안함을(Be visibly comfortable) 4) 사용자의 패턴과 디바이스를 고려한 능동적 반응(Make things responsive)까지 생각하는 것. 이 네 가지는 One UI 디자이너들이 사용자에게 최상의 경험을 선사하기 위해 세운 원칙이다.

▲ 삼성전자 무선사업부 Core UX 그룹 최정건 디자이너

특히 네 번째 원칙은 기존에 있던 원칙들과 달리, 이번 One UI 3을 위해 새롭게 세워진 것. 최정건 디자이너는 “최근 태블릿부터 폴더블폰, 일반 스마트폰까지 사용자들이 사용하는 기기 종류가 다양해졌고, 기능 또한 늘어났다. 이러한 흐름에 맞춰 기기에 맞는 최적의 레이아웃이나, 최상의 사용성을 제공하기 위해 새롭게 원칙이 추가됐다”고 설명했다. 예를 들면 어느 하나의 앱이 갤럭시 S21에서 구동될 때와 갤럭시 탭 또는 폴더블폰인 갤럭시 Z 시리즈에서 구동될 때, 각각의 디바이스에 최적화된 UI를 구성하는 것이다.

▲ 갤럭시 S21(좌)과 갤럭시 탭 S7+(우)에서 각각 네비게이션 메뉴(파란색 표시)가 어떻게 보이는지를 보여줌

삼성 노트 앱은 디스플레이 크기가 작은 일반 스마트폰에서는 좌측 상단에 있는 내비게이션 메뉴 버튼을 눌러 앱 메뉴로 바로 진입하지만, 갤럭시 Z 폴드나 탭 시리즈에서는 대화면의 장점을 살려 내비게이션 메뉴를 누르지 않아도 디스플레이 좌측에서 앱 메뉴를 모두 볼 수 있게 디자인했다.

▲ 접근성 기능의 고대비 글자를 활성화하기 전(왼쪽)과 후(오른쪽)

접근성 기능 중 사용자 패턴에 따라 유용한 기능을 보여주는 ‘당신을 위한 추천’도 네 번째 원칙과 맞닿아 있다. 저시력자가 시인성을 향상시켜주는 고대비 글자를 사용할 때, ‘사용해 보기’ 탭에 ‘글자 굵게’, ‘다크 모드’ 등 함께 사용하면 좋을 기능들을 알아서 추천해 준다. 또 ‘사용 중인 기능’을 통해 바로 해당 기능을 끌 수 있는 버튼도 제공해 여러 번 조작해야 하는 번거로움을 줄였다.

최정건 디자이너는 “접근성 기능이 워낙 다양해 100% 활용하지 못하는 경우가 많은데, ‘당신을 위한 추천’ 기능은 사용자가 필요할 법한 기능을 파악하고 추천해 편리함을 배가시킨다”고 말했다. 또 “‘이용하고 싶은 기능은 빨리 찾고, 필요하지 않게 되면 빨리 끄고 싶다’는 사용자 의견을 받아들여, 사용 중인 기능을 한 페이지에서 한눈에 볼 수 있게 디자인했다”고 디자인 배경을 설명했다.

다양한 기기가 자연스럽게 연동되는 갤럭시 생태계

스마트폰, 태블릿, 노트북까지 다양한 기기를 자연스럽게 넘나들면서 사용하는 것도 One UI 3에서 누릴 수 있는 특별한 경험 중 하나다. 이번 업데이트에서도 재택근무나 화상 수업 등으로 늘어난 태블릿, PC 사용에 맞춰 ‘기기 간 연결 경험’에 주안점을 뒀다. 업무 또는 학습 효율을 높이는 데 중요한 부분이기 때문.

최근 실시된 One UI 3.1에서 강화된 ‘기기 간 연결성’에 대해 장민영 디자이너는 “스마트폰으로 실행 중이던 인터넷 사이트나 삼성 노트 앱에서의 작업을 태블릿에서 그대로 이어서 작업할 수 있는 ‘다른 기기에서 앱 이어서 사용’^[2]이 추가됐다”고 설명했다. 또 “스마트폰에서 복사한 텍스트를 태블릿에 붙여넣기도 가능해졌다”며 강화된 연결성의 편리함을 강조했다. 뿐만 아니라 사용자는 태블릿과 연결해 사용하던 외장 키보드를 휴대전화와 바로 연결해 사용할 수도 있고, 갤럭시 버즈 무선 이어폰을 스마트폰과 태블릿에 연결해두면 음악을 재생하는 기기에 따라 자동으로 전환해주는 기능을 활용할 수도 있다.

기기 간의 연결 경험은 모바일 제품뿐 아니라 가전 영역으로도 확대됐다. One UI 3부터 스마트 뷰(Smart View)를 활용해 TV로 영상을 시청하면서 스마트폰의 전면 카메라가 비추는 영상을 함께 TV에 띄울 수 있는 기능을 지원하기 시작한 것. 특히 ‘홈트’를 즐겨하는 사용자에게는 자신의 동작과 트레이너의 동작을 비교할 수 있어 더욱 유용하다. 최정건 디자이너는 “이번 One UI 3.1 업데이트부터는 ‘스마트폰의 구글 듀오(Duo)’ 영상 통화 중 아이콘을 눌러 빠르게 TV 화면으로 전환해 띄울 수 있게 됐다”며 “화상으로 가족과 만나고, 재택근무 중 비대면 회의를 하는 경우가 많아진 요즘 특히 유용한 부분”이라고 덧붙였다.

가장 ‘나’다운 갤럭시를 쓰는 경험

스마트폰은 다양한 일을 할 수 있는 도구를 넘어, 자신의 개성을 표현하는 수단이 되기도 한다. 갤럭시 Z 플립에 다양한 스티커를 붙여 ‘나만의 폰’을 만드는 것이 대표적인 예. 최정건 디자이너는 “이처럼 스마트폰을 통해 자신을 표현하고 싶은 트렌드를 반영해 다양한 기능을 도입했다”고 말하며 “전화 수·발신 화면을 영상으로 지정하거나, 메시지 앱의 배경화면을 다양하게 꾸밀 수 있도록 해 ‘나만의 갤럭시 경험’을 만들어 갈 수 있다”고 덧붙였다.

▲ 퀵 패널을 내렸을 때 전(왼쪽)과 후(오른쪽). 간결한 디자인과 원하는 기능을 빠르게 찾을 수 있도록 사용성이 높은 버튼을 선정해 배치했다. 기존에 있던 기능은 맨 마지막 페이지에 나타나는 ‘+’ 버튼을 통해 추가 가능하다.

또한 이번 One UI 디자인 작업은 철저히 갤럭시 사용자들의 이용 패턴을 분석한 빅데이터를 활용했다. 장민영 디자이너는 “사용자가 많이 쓰는 기능과 잘 사용하지 않는 기능을 파악해, 우선순위가 높은 것들은 상위에 배치하고 낮은 것들은 간소화해, 복잡하게 느끼지 않도록 했다”고 설명했다.

단, 1초라도 사용자의 수고로움을 덜 수 있도록

▲ 삼성전자 무선사업부 UX디자인2그룹 장민영 디자이너

또 One UI 3.1에서는 시계 앱에서 디지털 웰빙의 취침모드^[3]를 연계해 사용할 수 있다. 갤럭시에서 사용자가 알람을 자주 사용할 경우, 시계 앱에서 취침과 기상 시간 설정을 유도하는 알람을 보여준다. 이를 통해 사용자는 수면 전·후로 이용하는 두 가지 기능을 두 앱을 오가지 않고도, 더 적은 움직임으로 빠르고 쉽게 활용할 수 있다.

최정건 디자이너는 “One UI 디자인의 수많은 개선점을 사용자들은 크게 인식하지 못할 수 있지만, 이것들이 모여 사용자들이 빠르고 직관적으로 인지하고 단 1, 2초라도 시간을 아껴 줄 수 있다면 충분히 의미가 있다고 생각한다”며 “앞으로도 One UI 디자이너들은 갤럭시 제품을 통해 사용자들이 일상에서의 만족과 기쁨을 느껴볼 수 있도록 최선을 다할 것”이라고 의지를 보였다.