Apple과 Microsoft가 ‘콘텐츠에 집중’한다는 목표로 UI 크롬을 문서와 섞어온 흐름을 Pages 스크린샷 비교로 살펴보고, 그 결과가 오히려 산만함을 키울 수 있음을 비판한다.
WWDC 2011 세션에서 Dan Schimpf는 Mac OS X Lion에서 Aqua 디자인을 새로 고치며 추구한 목표 중 일부가 “사용자의 주의를 활성 윈도우 콘텐츠에 집중시키기 위한 것”이었다고 설명했다. 이 취지는 _Ars Technica_에 실린 John Siracusa의 Lion 리뷰에서도 반복됐다:
Apple은 Lion 사용자 인터페이스의 목표가 주변 사용자 인터페이스 요소들을 덜 강조함으로써 콘텐츠를 돋보이게 하는 것이라고 말한다.
Apple이 2014년에 Yosemite로 Mac OS X를 다시 디자인했을 때는 이렇게 약속했다…
[…] 컨트롤은 더 명확하고, 더 똑똑하며, 더 이해하기 쉬워지고, 간소화된 툴바는 기능을 훼손하지 않으면서도 여러분의 콘텐츠에 초점을 맞추는 신선하고 현대적인 외관.
그리고 2020년에 Big Sur 리디자인을 공개했을 때는 이렇게 설명했다:
전체 경험은 더 집중된 느낌, 더 신선하고 익숙한 느낌을 주며, 시각적 복잡성을 줄이고 사용자의 콘텐츠를 전면 중앙에 둡니다.
그리고 2025년에 MacOS Tahoe와 Liquid Glass를 발표하며, Alan Dye가 소개한 내용에서 무엇을 약속했는지는 여러분도 절대 맞히지 못할 것이다:
우리의 목표는 모든 사용자 경험에 기쁨과 즐거움을 주는 아름다운 새 디자인입니다. 더 개인적이면서도, 여전히 즉시 익숙하게 느껴지도록 하면서, 여러분의 콘텐츠에 더 큰 초점을 맞추는 디자인 말이죠.
Apple만 그런 것도 아니다. Microsoft의 당시 새로운 Metro 디자인 언어에서 핵심 목표를 Build 2011에서 Jensen Harris가 설명한 내용은 이렇다:
Metro 스타일 앱은 숨 쉴 공간이 있습니다. 크롬에 관한 게 아니라 콘텐츠에 관한 겁니다. […] 수년 동안 Windows는 언제나 뭔가를 추가하는 것이었죠. 바를 추가했고, 창(pane)도 추가했고, 잡다한 것들(doodads)도, 위젯도, 가젯도, 바도 — 어디에나 잔뜩 있는 것들 말입니다. 그리고 우리는 새로운 위젯을 무엇을 추가했는지에 따라 UI를 정의해 왔죠. 이제 우리는 뒤로 물러났고, 앱이 무대 위에 서 있습니다.
그리고 나중에 Microsoft가 Fluent Design 언어로 앱 업데이트를 배포하면서도, 그것을 익숙한 표현으로 설명했다:
업데이트된 OneDrive에서는 여러분의 콘텐츠가 무대의 중심에 섭니다. 향상된 시각 디자인은 어수선함과 산만함을 줄여, 중요한 것 — 여러분의 콘텐츠 — 에 집중할 수 있도록 합니다.
반대가, 내 추측으로는, 사용자 인터페이스의 어수선함을 늘리고 더 산만하게 만드는 것이라면, 이는 칭찬할 만한 목표다. 아무도 그런 걸 원하지 않는다. 다만 목표 자체는 충분히 타당할지라도, 달성하는 방법은 분명 여러 가지가 있을 텐데 — Apple은 하나의 전략을 받아들였다: 인터페이스를 문서에 섞어버리는 것. (나는 가장 익숙한 플랫폼인 MacOS에 초점을 맞출 것이다.)
다음은 Mac OS X Lion에서 실행 중인 Pages 문서가 어떻게 보이는지다:
Click to expand.
다음은 같은 문서를, 이전의 디자인 언어를 대체한 Yosemite 시대의 디자인 언어를 적용한 상태로, MacOS Catalina에서 더 최신 버전의 Pages로 실행한 모습이다:
Click to expand.
다음은 Big Sur에서 도입된 디자인 언어를 사용하는, MacOS Tahoe에서의 최신 버전 Pages다:
Click to expand.
그리고 마지막으로, 현재의 Liquid Glass 시각 디자인 언어를 사용하는, MacOS Tahoe에서의 가장 최신 버전 Pages다:
Click to expand.
이 비교에서 더 최신 버전에는 환영할 만한 개선도 있다. 예컨대 오른쪽에 “Format” 패널이 도입되어, 와이드스크린 가로형 디스플레이를 더 잘 활용하고, 더 큰 컨트롤을 제공한다. Lion 시대 스크린샷의 밀도는 마음에 들지만, 그 포맷팅 메뉴의 미니 크기 컨트롤은 클릭하기가 더 어렵다.1
하지만 전체적으로 보면, 이 기간 동안 Apple이 Pages에 적용한 변화는 사용자 인터페이스 요소들끼리, 그리고 문서 자체와의 경계를 최소화하는 더 큰 흐름을 대표한다. 도구함에 있는 도구는 이것 하나뿐이고, 나는 이것이 Apple이 의도한 바를 달성하는지 회의적이다.
다시 최근 두 스크린샷을 그 이전 것들과 비교해 보자. 각 화면 맨 위의 툴바에 집중해 보라. 오래된 두 스크린샷에서는 툴바 — 즉 윈도우 자체 — 와 문서 사이에 명확한 분리가 있다. 하지만 Big Sur의 시각 언어에서는 툴바가 문서와 같은 밝은 흰색이다. Tahoe와 Liquid Glass 언어에 이르면 구분이 거의 사라져, 버튼이 문서 위에 그냥 떠 있는 것처럼 보인다. 그리고 기이하게도 “Reduce Transparency” 손쉬운 사용 설정을 켜면 더 악화된다:
Click to expand.
(그리고 아니, 여러분의 눈이 속는 것이 아니다: 오른쪽 아래에서 거의 보이지 않는 드롭 캡 메뉴의 아이콘들은 정말로 픽셀화되어 있다.)
내게 이것은, 창 전체가 비슷한 시각 언어를 갖기 때문에 문서로부터 지속적으로 주의가 분산된다는 뜻이다. 툴바와 그 버튼들이 문서와 하나가 될수록, 배경으로 사라지는 능력을 잃는다. 오래된 두 예시에서는 명확히 정의된 툴바의 대비 덕분에, 그것들을 내가 신경 쓰지 않아도 되는 완전히 별개의 것으로 취급할 수 있다.
이는 오래된 두 툴바 내부 의 더 낮은 대비로도 뒷받침된다. Lion에서는 회색 배경과 적당히 채도 있는 색상이, 방해가 되지 않으면서도 사용할 수 있는 도구가 있음을 조용히 상기시킨다. 형태의 혼합은 충분한 구분점이었고, Apple은 다음 스크린샷에서 그것을 버렸다. 모든 버튼을 문자 그대로 만들고 같은 밝은 배경에 얹으면서, 툴바는 조금 더 산만해졌다 — 하지만 적어도 문서와 섞이지는 않는다. 이전 스크린샷이라는 맥락이 없으면 각 아이콘의 색은 거의 무작위처럼 보이고, 나는 흰색 위 노란색의 “Table” 버튼이 흰색 위 노란색 위 검정색의 “Comment” 버튼과 한눈에 구별하기 어렵다고 느낀다.
솔직히 말해 Big Sur 시대의 디자인 언어는 끔찍한 퇴보다. 이질적인 형태는 돌아왔지만, 균일한 흰색 배경 위에 단색 중간 회색 아이콘이라는 형태로 돌아왔기 때문이다. 아이콘 자체가 나쁘다고까지는 할 수 없다 — 다만 기본 툴바 배치에서 둘 다 플러스 기호로 표시되는 “Add Page”와 “Insert”를 서로 옆에 두는 것은 조금 혼란스럽다. 하지만 나는 여러분이 이들 중 일부는 버튼이고, 또 일부는 서브메뉴가 달린 팝업 버튼이라는 사실을 알아맞히지 못할 거라고 장담한다.
마지막으로 Liquid Glass가 있다. 기본 형태에서는 앞선 예시보다 대비가 더 크다. 내가 MacOS를 쓰는 방식인 “Reduce Transparency”를 켜면, 대비가 오히려 더 작다. 버튼 자체는 흰색 배경 위에 더 크고 더 진한 회색 아이콘을 사용해 내부 대비가 더 크다. 이는 이전 예시의 얇고 작고 대비가 낮은 버튼에 비하면 툴바 맥락에서는 더 낫지만, 그 결과 이 툴바는 문서 자체와 비슷한 대비를 갖게 된다.
Pages ’09가 완벽한 사용자 인터페이스를 갖고 있고 그 이후가 전부 퇴보라고까지 주장하고 싶지는 않다. 두 오래된 툴바에서 아이콘 채움에 사용된 평균 색상은 대체로 손쉬운 사용 대비 검사에 실패하는데, 놀랍게도 Big Sur 디자인은 그 검사를 통과할 것이다. Pages ’09의 아이콘은 짙은 외곽선과 독특한 형태에 의존해 툴바 배경과 충분한 대비를 만든다. 하지만 Apple은 이후 이런 인터페이스를 설계할 때 바꿀 수 있는 변수 대부분을 버렸다. 모든 버튼에는 단 하나의 균일한 색을 가진 아이콘이 들어가고, 거의 정의되지 않은 동일한 형태의 컨테이너에 담기며, 기본적으로 텍스트 레이블도 없다.
이 단색 위주의 외관에서는 어떤 색상 튀김이든 산만하다. Pages에서 쓰이는 노란색 강조는 촌스럽다 — 다행히도 대부분은 시스템 설정의 모양 아래에서 테마 색상을 바꾸면 완화할 수 있다. (안타깝게도 최신 버전 Pages에서 “Update” 버튼의 노란 배경은 시스템 강조 색상과 무관하게 그대로 남아 있다.) 하지만 아마도 여러분은 위의 Liquid Glass 스크린샷에서 보라색 아이콘도 봤을 것이다. 전체 툴바는 이렇다:
Click to expand.
이 보라색 아이콘들은 Apple Creator Studio의 일부 기능을 뜻한다. 이는 Pages 및 다른 애플리케이션을 대상으로 한 유료 구독으로, — 위에 제시된 순서대로 — 이미지를 생성하고, 이미지 해상도를 인위적으로 높이며, 스톡 이미지 라이브러리에 접근할 수 있게 해준다. 여러분의 Pages 문서에 여러분이 가진 이미지를 삽입하고 싶다면, 그 기능은 종이클립 아이콘으로 옮겨졌다. 그렇다. 바로 옆에 있는 확대/축소 메뉴처럼 드러내기 삼각형이 없는데도, 이것은 버튼이 아니라 메뉴다. 그리고 “Content Hub”와 “Generate Image” 기능도 또 상기시켜 준다. Lion의 Pages에서는 사용자가 작업을 완료하는 과정에서 길잡이가 되도록 아이콘에 색을 사용했다 — 도형을 추가하려면 초록색을 클릭하고, 표를 추가하려면 더 짙은 노란색을 클릭하라는 식이다. 더 최신 버전에서는 “Writing Tools” 아이콘이 짙은 회색으로 남아 있기 때문에, 색이 이것들이 A.I. 기능임을 나타내는 데 쓰이고 있는 것도 아니다. 이 버전에서 색이 들어간 아이콘은, 사용자가 현재 그 비용을 내고 있는지 여부와 상관없이, 프리미엄 추가 기능으로 사용자를 유도하기 위해 존재한다.
나는 이 비교를 위해 Pages에 집중하기로 했는데, 이는 MacOS에서 너무나 다양한 생애를 살아왔기 때문이다. 하지만 시스템 나머지 부분을 대표하기에는 불완전할 수도 있다. 예를 들어 Mac OS X Lion 전반에서 Finder나 Preview 같은 자사 앱의 툴바는 거의 전적으로 단색 아이콘만 사용한다. 이는 Mac OS X Leopard 이후로 거의 구분되지 않는 폴더 아이콘과 함께 이어져 온 흐름이기도 하다. 2년 앞서 출시된 Tiger의 일부 툴바에는 균일한 캡슐 형태 안의 아이콘이 있었다. 당시에도 의심스러운 아이디어들이었지만, 그래도 정의적인 특성은 남아 있었다. 예컨대 캡슐은 형태는 균일했을지라도, 그 안에는 풀 컬러 아이콘이 들어 있었다. 무엇보다도, 그것들은 모두 문서와 구분되는 컨트롤임이 분명했다.
Apple이 그렇지 않다는 사용자 연구를 가지고 있을지도 모르지만, 인터페이스와 문서 사이의 선을 흐리게 만드는 것이 사용자에게 어떻게 이득이 되는지 나는 도무지 이해할 수 없다. 적어도 내가 쓰는 방식에서는, 이런 변화가 앱에서 작업할 때 산만함을 줄이는 결과로 이어지지 않는다. 사실 종종 그 반대다. 처방이 10년 전의 디자인 언어로 되돌리는 것이라고는 생각하지 않는다. 그러나 Apple은 툴바 안에서 도구들을 구분하고, 윈도우 크롬을 문서에서 더 분명히 분리하기 위해, 바꿀 수 있는 변수의 풍부함을 탐색해 볼 필요가 있다고 생각한다.
