미니멀 UI의 차기 트렌드 '컴플렉션 리덕션'
ㅡ SWARM / 번역글
미니멀 디자인이 트렌드가 된 지 꽤 오랜 시간이 지났습니다. 다음 트렌드는 무엇일까요?
지난 몇달간 최첨단 디자인을 달리는 몇몇 서비스들 중 "미니멀 디자인"을 다음 단계로 이끌어나가는 것들이 생겨났습니다. Facebook과 Airbnb, Apple은 각각의 제품들 보다 심플하게 보이는 것에 대해 동일한 방향을 바라보고 있었으며, 이는 모바일 디자인에서의 새로운 트렌드 "컴플랙션 리덕션"을 반영한 것이라 할 수 있습니다.
컴플렉션 리덕션(COMPLEXION REDUCTION)이란 무엇인가?
"컴플렉션 리덕션"이라고 들어본 적 있으신가요? 들어본적이 없다해도 괜찮습니다. 이는 제가 마음대로 이름 붙인 단어로 최근 저는 플랫디자인과 미니멀 디자인과는 다른 방향성을 갖는 디자인들이 생겨난 것을 발견했습니다. (*역자주: Complexion은 안색, 양상이라는 뜻을 가지며 Reduction은 축소, 삭감, 감소, 할인, 축소판 등의 뜻을 지니고 있습니다.)
이는 단지 미니멀 디자인의 연장선상에 있는 걸로 보는 사람도 있을지 모르겠으나 저는 나누어 생각해야한다고 보고 주제넘게도 이름을 붙여보았습니다. 실리콘밸리를 석권하는 이 트렌드의 특징은 이하와 같습니다.
1. 보다 크고 굵은 헤드 라인
2.보다 간단하고 범용적인 아이콘
3. 사용된 색상의 감소
이들을 도입한 결과는 어떻게 될까요? 우리가 자주 사용하는 앱 조작화면이 하나의 브랜드 이름하에 통일된 것처럼 보였습니다.
증거들 (인스타그램, 애어비앤비 등의 예제)
이 트렌드에 대해 제가 가장 처음 깨달았던 것이 5월 초순으로 인스타그램이 화면을 새롭게 바꾸었을 때입니다.
인스타그램 앱
이러한 변경은 청색과 짙은 그레이 색상 대부분이 제거되고, 그 대신 제목이 강조되었으며 하단 메뉴와 아이콘이 단순화되었습니다. 흑백 UI와 주장하는 느낌이 강한 표제에 따라 문장과 사진을 돋보이게 하였으며 기능을 명확화하게 되었습니다.
보다 다듬어진 UI는 전부터 제가 팬이었던 Medium UI와도 비슷합니다. Medium은 2012년 릴리즈 되었을 때부터 흑백의 서로다른 색상을 채택하고 있었으며, 이후 디자인을 쇄신해나갈때마다 보다 심플한 방향으로 세련되게 바껴나갔습니다. Meduim은 처음부터 자연스럽게 컴플렉션 리덕션(이하CR)을 채택하였으며, 선구자가 되었었습니다.
애어비앤비 iOS 앱
Facebook과 Instagram의 새로운 모습을 공개 한 뒤, 저는 어느 순간 Airbnb 앱을 열고 그 익숙한 UI에 충격을 받았습니다. Airbnb가 4월에 디자인을 바꾼 후 제가 이 앱을 접한 것이 처음이었을텐데도 쭈욱 이 화면에 익숙해져온듯한 느낌을 기억합니다.
Airbnb의 UI 변경은 그로부터 한 달 뒤에 발표된 Instagram만큼은 미디어에 다뤄지지 않았었지만(화려한 아이콘 변경이 없었기 때문일지도 모르겠습니다.) 이 Airbnb도 컴플렉션 리덕션 트렌드를 따르고 있는 부분이 많이 보였습니다.
모바일 디자인 개편에서, 제목을 크게 눈에 띄게 하였으며 불필요한 이미지와 색채를 줄이고 아이콘을 단순화함으로써 더 많은 장면에서 시인성 향상을 가져왔습니다. 모노톤으로 통일된 UI가 텍스트 또는 이미지를 더욱 돋보이게 하였으며 기능성도 명확해졌습니다.
애플 뮤직
컴플렉션 리덕션 트렌드에 매료되어, 채택한 것들 중 가장 최근에 나온 예가 Apple입니다. 6월 초 애플은 WWDC에서 "사상최대의 iOS"라고 칭한 iOS10을 발표했습니다.(iOS8 때도 사상최대하고 언급했었으니, 적어도 이후라는 이야기겠네요)
특히 제 눈을 끈 것이 Apple Music 디자인리뉴얼입니다. 리뉴얼에 있어서 중요한 부분은 UX개선 및 추가기능이었다 하지만 제가 처음으로 느낀 것은 '억제'된 UI입니다. Macworld기자인 Caitlin McGarry씨도 이 새로워진 모습에 대해 "전체적으로 완전히 새로운 외관이며, 이미지는 보다 커졌고 커다란 눈에 띄는 폰트와 새하야면서도 청렴한 배경으로 인해 앨범 재킷이 더욱 돋보이는 디자인"이라 표현하였습니다.
이제 아시겠나요? Instagram과 Airbnb에서 도입한 방향성과는 조금 다르겠지만(아이콘이 감춰져있는 건 어떤 뜻일까요?) 핵심 요소는 동일합니다. 커다랗게 주장하고 있는 타이틀과 흑백으로 나눠진 조작화면입니다.
그래서 이들은 무엇을 의미하는가?
앞서 말했듯 우리가 자주 사용하는 앱들의 외형이 점점 비슷해져가고 있습니다. 왜일까 한다면 기술은 모방의 전투이기 때문입니다. 이러한 디자인 리뉴얼은 무엇이든지 호의적인 반응을 갖기 때문에 새로운 앱들도 오래된 앱들도 컴플렉션 리덕션 트렌드에 합류할 것으로 예상합니다.
흑백의 조작 화면을 "개성 결핍"이라며 비판하는 사람도 있지만, 딱 봤을 때 마음이 안정되지 않나요? 앱은 기능을 사용하기 위해 있는 것이지 개성을 위해 있는 것이 아닙니다. 즉, 이는 당신이 갖고 있는 아이폰 홈 화면은 당신을 편한한 여행으로 유혹하는 색색들이 모자이크 문에 지나지 않을 것 입니다.
당신이 흑백 스타일을 좋아하던 그렇지 않건간에 이는 확실한 진화의 흐름입니다.
제품 디자인 프로세스는 오래된 불필요한 요소를 포함시켜왔던 경향을 보이는 디자인에서, 사용자에 초점을 맞춘 '전체에 관련된 디자인'으로 진화하고 있는 것입니다. 오래된 디자인 프로세스에서 UI디자이너는 UX디자이너 또는 기획자로부터 와이어프레임을 전달받곤 "멋있게 해달라"고만 지시받는 경우가 많았었습니다. 그 디자이너는 몇시간 또는 며칠동안 색을 더하거나 빼며 변경해왔겠죠. 와이어프레임이라는 최선의 해결책이 눈 앞에 계속 있었음에도 불구하고요!
최근 더욱 더 발달한 디자인 프로세스에서는 UX디자이너와 UI디자이너 사이의 경계가 모호해지고 있으며, 디자이너는 개별로 드는 책임(예를 들면 멋있게 하기와 같은..)이 줄어들었으며, 사용자를 위한 최고의 제품을 만든다는 궁극의 목표에 주목할 수 있습니다.
컴플렉스 리덕션 디자인의 가이드라인
컴플렉션 리덕션의 매력이 충분히 전해졌나요? 도입하고 싶은 경우엔 다음 가이드라인을 참고하시기 바랍니다.
1. 색채를 없앤다.
색을 제거합시다. 다른 색으로 1가지 색정도는 남겨둬도 좋지만, 많이 사용하지는 않도록 하십시오. 다른건 흑백으로 통일합시다. 가능한 컨텐츠 색들이 빛나도록 합시다.
2. 제목은 대담하게
제목을 더욱 크고 더욱 굵게, 더욱 검게 합시다.
첫 시작을 알리는 제목 폰트를 수십픽셀 끌어올려 중량감을 갖게 합시다.
3. 아이콘은 심플하게
아이콘을 더욱 간단하고 더욱 얇게, 전세계 누구나 바로 알 수 있는 것으로 합시다. 아이콘에서 색을 사용하는 것도 금지입니다. 만일 어떤 순서로 놓아야 할지 헷갈린다면 다음 순서에서 왼쪽부터 오른쪽으로 정렬합시다. 홈, 검색, 메인 동작, 다음 동작 포인트, 프로필 등
4. 여백을 충분히
흰색 영역을 2배 아니 3 배로 합시다. 4배도 좋을지 모르겠습니다. 이에 관해선 많더라도 실수하는 것이 아닙니다.
5. 앱 아이콘은 화려하게
앱 아이콘을 더 밝은 색으로 합시다. 색을 사용한 컬러풀한 것을 디자인하지 못해 근질거릴 경우 아이콘에 그 열정을 쏟아봅시다. 바로 여기서 당신의 개성을 쏟아부어 브랜드를 확립하는 것입니다. 화려하게 돋보이도록 합시다.
(번역끝/묭니)
아이콘들이 숨겨져있으며 흑백으로 절제된 디자인, 이 브런치에서도 해당하겠고 또 어떤 것들이 있는지 저도 계속 찾아봐야겠습니다.
콘텐츠 중심의 앱들이 가장 선구적으로 변화하겠네요.
