모바일 디자인의 새로운 트렌드: 콤플렉션 리덕션 (Complexion Reduction)
https://medium.com/@chasechang/모바일-디자인의-새로운-트렌드-콤플렉션-리덕션-complexion-reduction-9d24b8020a82
에서 한국어 번역한 글입니다. 1차 출처는
https://medium.com/amazing-stuff/complexion-reduction-a-new-trend-in-mobile-design-cef033a0b978
이곳입니다.
2016년에 쓰여진 글이지만 아직도 이 트렌드가 그리 많이 변형되지 않은 상태로 남아 있고, 또 앞으로 당분간 앱 디자인 트렌드로 이어질거라 생각해 옮겨봅니다. 앱 디자인은 최대한 단순하고 보편적으로, 글자는 크고 볼드하고 명확하게, 배경은 흰색 혹은 아주 옅은 회색, 아이콘은 개성이 드러나는 그라데이션이나 채도 높은 색깔, 그리고 컨텐츠는 최대한 눈에 띄게. 결국 사람들이 스마트폰으로 수많은 컨텐츠를 계속 소비하는 한, 앱 디자인은 UI 자체의 개성보다는 컨텐츠를 보여주기 위한 수단으로 계속해서 진화할 것이라 봅니다.
_
최근 몇 달(2016년) 동안, 혁신적인 디자인의 리더들이 ‘미니멀 디자인’을 더욱 더 성숙하게 변화시켰다. 페이스북, Airbnb 그리고 애플은 모바일 디자인의 콤플렉션 리덕션’이라고 불리는 새로운 트렌드를 따라서 주요 서비스/제품을 단순화시켰다.
콤플렉스 리덕션 (COMPLEXION REDUCTION)이란 무엇인가?
콤플렉션 리덕션이란 단어를 못 들어봤다면 그건 내가 만들어낸 단어이기 때문이다. 즉 모르는 게 당연하다. 최근 들어 나는 플랫 디자인과 미니멀 디자인을 넘어, 그리고 progressive reduction과 독립적인 형태의 새로운 트렌드가 생기고 있음을 알아차렸다.
몇몇은 이 트렌드가 모바일 세계에 적응한 미니멀 디자인의 진화 형태라고 주장하지만, 내 생각에는 뭔가 다른 것이 있다. 이 새로운 트렌드는 이를 정의하는 특유의 유사점 및 특징이 있다.
지금 실리콘 밸리에서 핫하고 새로운 트렌드의 주요 특성은 다음과 같다.
- 더 크고, 더 강렬한 헤드라인
- 더욱 간결하고 일반적인 아이콘
- 흑백
그 결과, 우리가 좋아하는 앱들이 모두 다 같은 브랜드/회사의 것이라고 봐도 이상하지 않을 정도로 비슷해지고 있다.
난 올해 5월 인스타그램이 새로운 UI를 공개했을 때 이 트렌드를 처음 감지했다.
인스타그램은 업데이트를 통해서 앱 전체적으로 쓰이고 있었던 청색과 진회색의 색을 빼고, 헤드라인을 강렬하게 만들고, 하단의 네비게이션과 아이콘 섹션을 단순화하였다. 이런 형태의 강렬한 헤드라인의 흑백 UI는 유저가 컨텐츠에 집중할 수 있게 하면서도, 동시에 각 버튼의 기능성을 명확하게 전달했다. 이렇게 많이 덜어낸 듯 한 인터페이스는 내가 오랫동안 좋아한 다른 플랫폼에서도 발견할 수 있다. Medium말이다. Medium은 2012년부터 흑백을 사용해 왔고, 업데이트 마다 조금씩 디자인을 덜어내 왔다. 그렇게 Medium은 아무도 모르게 컴플렉스 리덕션의 선두주자가 되었다. Medium, 축하해!
인스타그램의 새로운 모습이 나오고 얼마 지나지 않아 Airbnb앱을 열었을 때 그 유사성에 상당히 놀랐었다. Airbnb가 4월에 새로운 디자인을 출시하고 분명히 처음으로 앱을 실행하였음에도 불구하고 전에 어디선가 본 듯 한 인상을 가졌다.
Airbnb의 새로운 UI는 인스타그램만큼 미디아의 노출을 받지는 못 했지만(아마 앱 아이콘을 바꾸지 않아서가 아닐까) 많은 컴플렉스 리덕션의 법칙을 발견할 수 있다. 그들은 새로운 모바일 디자인에서 더 크고, 강렬한 헤드라인을 내세웠고, 필요없는 이미지와 칼라를 없애고 아이콘을 단순화하여 조금 더 대중적으로 명확하게 만들었다. 결국 컨텐츠에 집중할 수 있고 기능성이 뚜렷한 흑백 UI가 탄생했다. 콤플렉션 리덕션 트렌드를 사랑하는 디자이너들이 있는 다른 회사는 애플이다. 최근 Apple WWDC에서 iOS 10같이 새로운 제품들을 소개하는 자리를 가졌다.
그 발표 중 하나가 내 시선을 사로잡았다. 그건 바로 애플 뮤직의 새로운 디자인이었다. 새로운 디자인의 제일 중요한 부분은 UX 업데이트와 추가기능이었지만, 그 아름다움에 먼저 신경을 빼앗겨 버렸다. Mac World의 기자 Caitlin McGarry는 업데이트된 모습을 다음과 같이 표현했다. “완전히 새로운 모습입니다. 큰 카드, 크고 강렬한 폰트, 그리고 깨끗하게 하얀 배경은 앨범 아트를 정말 띄워줍니다."
이제 슬슬 감이 오는가? 인스타그램과 Airbnb가 사용한 청사진은 약간씩 다르지만 (그들의 아이콘은 단순하다. 애플, 어쩔거냐?) 핵심적인 유사성 — 크고 강렬한 헤드라인, 흑백 UI — 는 찾아볼 수 있다.
그래서 이게 대체 무슨 의미인가?
앞서 말한 것과 같이, 당신이 좋아하는 앱들이 점점 더 서로 비슷하게 변할 것이라는 의미이다. 왜냐고? NFL(미국 미식축구리그)과 비슷하게 여기도 카피캣의 경쟁터이기 때문이다. 이 트렌드가 긍정적인 리뷰를 받았고 (물론 몇 몇은 이 흑백 UI가 개별적인 특성이 없다고 불평했지만, 곧 익숙해질 것이다. 앱은 기능을 위해서 실행하는 것이지 개별적인 특성 때문에 사용하는게 아니기 때문에) 이미 나와 있던, 그리고 새로 나오는 앱들도 콤플렉션 리덕션이라는 트렌드를 따르게 될 것이다.
아이폰 홈스크린이 곧 여러분을 잘 만들어진 앱으로 보내주는 다양각색의 아이콘들의 모임, 그 이상의 의미를 가지지 않게 될 것이다라는 이야기이다. 자, 당신이 이 흑백의 트렌드를 반기던 싫어하던 그와 상관없이 이것은 분명히 변화의 사인이다.
제품 디자인 과정은 예전에 표면적인 아름다움을 지향했던 단절된 형태에서 유저에게 진정으로 집중하는 완전된 형태로 발전하고 변화 중이다. 예전의 제품 디자인 과정에서는 UX/제품 담당자로 부터 화면설계도(wireframes)를 “더 예쁘게 만들어 주세요"라는 주문과 함께 받고는 했다. 그 디자이너는 색을 더하고, 빼고, 바꾸는데 시간을 쏟았을 것이다. 해결책은 바로 눈 앞에 있는대로 불구하고 말이다. (Wireframe말이다!) UX와 UI의 경계선이 흐려지면서 디자이너들은 세세한 책임에 덜 신경쓰고 (예를 들어 더 예쁘게 만들어야 한다) 더 중요한 목표를 위해서 일할 수 있게 되었다. 유저를 위한 최고의 제품을 만드는 일 말이다.
콤플렉션 리덕션 (COMPLEXION REDUCTION)의 5가지 핵심 요소
콤플렉션 리덕션이 마음에 들고 한 번 시도를 해보고 싶다면 다음 요소들만 잘 따라해 보라.
1. 색을 빼라. 현재 진행되는 행동/액션을 표기하기 위해서 추가적인 색을 하나 사용하는 것은 괜찮다. 하지만 그 외의 것은 흑백으로 바꿔라. 앱 안의 컨텐츠가 나머지 공백을 색칠할 수 있도록.
2. 더 크고 더 강렬하고 더 검은 헤드라인. 헤드라인이라고 생각하는 파트가 있다면 폰트 크기를 20–30 px로 올리고 두껍게(HEAVY)만들어라.
3. 단순하고, 얇고, 알아보기 쉬운 내부 아이콘. 당신의 아이콘은 보편적이고 색상을 적게 쓰는 것이 좋다. 좀 더 들어가면 홈, 검색, 기본 액션, 보조 액션, 프로필과 등의 아이콘을 왼쪽에서 오른쪽으로 정렬해서 단순하게 배치하라.
4. 공백을 2배, 아니 3배로 늘려라. 가능하다면 4배도 좋다. 다다익선이랄까.
5. 앱 아이콘을 더 밝게 만들어라. 만약 뭔가 반짝이고 다채로운 색깔의 무언가를 디자인하고 싶으면, 앱 아이콘을 디자인하라. 앱의 성격과 브랜드를 녹일 수 있는 곳이다. 눈에 띄게 만들어!.