CleanShot의 설정을 밀어버린 리디자인

AI 요약

CleanShot의 설정 화면이 버전 5에서 크게 바뀌면서, 오랫동안 다듬어 온 인터페이스의 세부 설계가 한 번에 사라졌다는 비판이 제기됩니다. 글쓴이는 Jim Nielsen이 사용한 표현인 “인터페이스를 불도저로 밀어버리기(bulldozing of an interface)”를 빌려, 실제 사용 사례와 구체적인 이유를 바탕으로 축적된 작은 설계 결정들이 대규모 리팩터링 과정에서 모두 제거됐다고 설명합니다. 그는 CleanShot의 기존 설정 화면을 높이 평가한 지 불과 몇 달 뒤, 버전 5 업데이트가 그 화면을 훨씬 불편한 형태로 바꿨다고 말합니다.

■ macOS를 닮은 설정 화면이 항상 더 좋은 것은 아닙니다

글쓴이는 CleanShot 5의 설정 화면이 macOS Ventura의 System Settings와 일관된 느낌을 주고 더 현대적으로 보이게 하려는 목적에서 만들어졌다는 점을 CleanShot 지원팀으로부터 들었습니다. 지원팀 담당자 역시 이전 설정 화면을 좋아했지만, 운영체제와의 일관성을 위해 새 디자인을 출시했다고 설명했습니다. CleanShot 5로 업데이트한 뒤에도 버전 4로 다운그레이드하는 방법은 남아 있었습니다.

글쓴이는 운영체제의 설계가 좋지 않다면 애플리케이션이 반드시 이를 따라야 하는 것은 아니며, 오히려 디자이너가 나쁜 패턴을 반복하지 않을 책임이 있다고 반박합니다. 특히 2022년 macOS Ventura System Settings가 공개된 뒤 사용자들이 보인 반응을 보면, 해당 디자인의 문제를 이미 확인할 수 있었다고 말합니다. 그는 CleanShot 5가 Ventura의 문제를 그대로 물려받았다고 보고, 설정 화면의 구조와 컨트롤을 항목별로 분석합니다.

■ 두 열 레이아웃이 옵션과 컨트롤을 분리합니다

첫 번째 문제는 두 개의 창으로 나뉜 설정 레이아웃입니다. 글쓴이에 따르면 이 구조는 원래 너비 320px의 첫 번째 iPhone 화면을 위해 설계됐습니다. 그런데 macOS Settings에서는 이 구조가 460px까지 늘어났고, CleanShot에서는 550px로 더 넓어졌습니다. 그 결과 사용자는 화면을 “첫 번째 옵션, 두 번째 옵션” 순서로 읽기보다 “왼쪽 열이 먼저이고 오른쪽 열이 다음”인 구조로 인식하게 됩니다.

이렇게 되면 옵션의 이름과 실제 조작 컨트롤이 서로 떨어져 보여 눈이 화면 안에서 더 많이 이동해야 합니다. 음영과 구분선이 두 요소의 관계를 보완하지만, 글쓴이는 이것이 근본적인 해결책이 아니라 임시 지지대에 가깝다고 봅니다. 구분선과 배경 처리는 오히려 화면의 정보 밀도를 낮춥니다. 반면 CleanShot 4에서는 화면 중앙의 하나의 기준선(spine)을 따라 시선이 움직였기 때문에 옵션과 컨트롤을 더 쉽게 연결할 수 있었다고 설명합니다.

■ 우측 정렬과 위치 불일치가 처리 부담을 키웁니다

CleanShot 5의 두 번째 열은 오른쪽 정렬되어 있습니다. 왼쪽에서 오른쪽으로 읽는 언어 환경에서는 우측 정렬 자체가 처리하기 더 어렵고, 옵션의 레이블과 컨트롤을 더 멀리 떨어뜨리는 효과도 낳습니다. 이전 레이아웃에서도 레이블이 우측 정렬되어 있었지만, 공통 기준선 가까이에 있었고 레이블 자체도 짧고 단순했기 때문에 문제가 덜했다고 합니다.

새 구조에서는 Options… 버튼이 사용자가 기대하는 쪽과 반대편에 놓이는 문제가 생기며, Options…와 Choose… 버튼의 위치도 일관되지 않게 됩니다. 글쓴이는 이처럼 작은 위치 차이가 설정을 반복적으로 사용하는 과정에서 누적된다고 지적합니다.

■ 모든 패널이 비슷해져 위치를 알아보기 어려워집니다

버전 5에서는 각각의 설정 패널이 서로 훨씬 비슷하게 보입니다. 글쓴이는 이를 유용한 일관성으로 보지 않습니다. 버전 4에는 전체적으로는 조화롭지만 패널마다 서로 다른 실루엣이 있었고, 사용자는 그 형태를 단서로 현재 어느 위치에 있는지 빠르게 파악할 수 있었습니다.

사람은 패턴을 인식하기 때문에 화면의 모양이 달라지면 환경을 매번 의식적으로 읽지 않아도 위치를 파악할 수 있습니다. 반대로 모든 패널이 동일한 형태를 가지면 사용자는 레이블을 다시 읽고 주변을 의식적으로 확인해야 합니다. 글쓴이는 버전 4의 다양한 패널 형태가 이런 인지 부담을 줄였다고 설명합니다.

■ 팝업 버튼이 라디오 버튼과 슬라이더의 역할을 대신합니다

Ventura 스타일의 설정 디자인은 라디오 버튼을 제대로 수용하지 못하고 슬라이더 사용에도 어려움이 있어, 여러 선택지 중 하나를 고르는 경우 팝업 버튼을 사용하도록 유도합니다. 이 방식은 한 화면에 어떤 선택지가 있는지 한눈에 보여주지 못합니다. 예를 들어 Wallpaper 설정에서 “Plain color” 같은 옵션을 찾으려면 팝업을 직접 열어야 하므로, 사용자가 해당 옵션의 존재 자체를 알아차리지 못할 수도 있습니다.

CleanShot 4는 컨트롤의 중요도에 따라 라디오 버튼과 팝업 버튼을 구분해 사용했습니다. 글쓴이는 버전 4의 서브탭(subtab)과 간결한 체크박스도 같은 방식으로 기능했다고 평가합니다. 그러나 버전 5에서는 이런 형태 구분이 사라져, 어떤 선택지가 어디에 있고 어떤 방식으로 조작되는지 파악하기 어려워졌다고 말합니다.

■ 클릭 가능한 영역과 상태 표현도 나빠졌습니다

버전 4에서는 체크박스 옆의 긴 레이블을 클릭해도 설정을 켜고 끌 수 있었습니다. 버전 5의 스위치에서는 이 동작이 더 이상 가능하지 않아, 사용자가 작은 컨트롤 자체를 정확히 클릭해야 합니다. 팝업 버튼의 폭도 더 좁아졌기 때문에 조작 정밀도가 높아졌고, 이 차이가 반복 사용에서 누적된다고 설명합니다.

기존 화면에는 “조작할 수 있는 것은 흰색이고, 나머지는 회색”이라는 일관된 시각적 규칙도 있었습니다. 이 규칙은 사용자가 무엇을 클릭할 수 있는지 빠르게 훑어보게 해주는 역할을 했습니다. 새 시스템에서는 드롭다운 메뉴가 비활성 레이블처럼 보여, 조작 가능한 요소와 단순한 설명을 구별하기 어려워졌습니다.

스위치 자체의 가시성과 대비도 문제로 지적됩니다. 글쓴이는 특히 강조 색상(accent color)을 graphite로 설정한 환경에서 문제가 두드러질 수 있다고 보지만, 이것이 개인 설정에만 국한된 문제는 아니라고 말합니다. 여러 사용자가 스위치의 켜짐과 꺼짐 상태가 비슷하게 보여 상태를 해석하기 어렵다고 계속 피드백하고 있기 때문입니다. 기존 체크박스는 형태 자체가 상태를 구분해 주므로 같은 문제가 없었다고 설명합니다.

■ 기존 설계를 되살릴 여지는 남아 있습니다

글쓴이는 이 변경을 되돌리기에는 아직 늦지 않았다고 말합니다. 그는 1970년대 도시 계획을 비유로 들며, 모더니즘에 매료된 도시들이 콘크리트 건물과 고속도로 중심으로 비슷하게 재개발됐고, 오늘날에는 이전에 생동감 있던 장소를 사람이 머물기 어려운 공간으로 만든 것을 후회한다고 설명합니다. CleanShot 5의 설정 화면도 “현대적이고 일관된 모습”을 얻는 대신, 사용성을 지탱하던 개성과 표지판을 잃었다는 비유입니다.

대안으로는 현대적인 왼쪽 내비게이션은 유지하되, 버전 4의 레이블을 왼쪽 정렬하는 방식을 제안합니다. 화면이 넓어진 오늘날에는 기존의 왼쪽 내비게이션이 더 적합할 수 있지만, 나머지 설정 구조는 이전 버전의 원칙을 살릴 수 있다는 주장입니다. 글쓴이는 이런 수정이 더 많은 작업을 요구한다는 점은 인정하면서도, 운영체제가 좋은 디자인 패턴을 제공하지 않을 때 애플리케이션이 이를 보완해야 한다고 말합니다. CleanShot 4의 설정 화면은 신규 사용자를 위한 진입점이면서 반복 사용에도 빠르게 조작할 수 있는 구조였으므로, 버전 5가 그 장점을 다시 고려해야 한다는 것이 글의 결론입니다.

원문: unsung.aresluna.org / 번역·요약: Trawling