지난글에서 iPad용으로 디자인하기를 다뤄봤는데, 우리와 가장 밀접하게 닿아있는 것은 iOS라 오늘은 iOS용으로 디자인하기를 살펴보겠다.
사람들은 어디에서나 이동 중에도 iPhone을 통해 소통하고, 게임을 플레이하고, 미디어를 보고, 작업을 수행하고, 개인 데이터를 추적한다.
iOS용 앱 또는 게임을 디자인할 때에는 iOS 경험을 차별화하는 기본적인 기기 특성 및 패턴을 먼저 이해해야 한다.
이러한 특성과 패턴을 사용하여 디자인 결정을 내리는 것은 iPhone 사용자가 만족하는 앱이나 게임을 개발하는 데 도움이 될 수 있다.
5가지 특성
1. 디스플레이 : iPhone에는 중형 크기의 고해상도 디스플레이가 탑재되어 있다.
2. 인체공학 : 사람들은 일반적으로 iPhone을 한 손 또는 두 손으로 잡고 필요에 따라 가로와 세로로 화면 방향을 전환하며 iPhone과 상호작용한다. 사람들이 기기와 상호작용할 때 주시 거리는 대체로 약 30cm 또는 60cm를 넘지 않는다.
3. 입력 : 사람들은 Multi-Touch 제스처, 가상 키보드 및 음성 명령을 사용하여 이동 중에 동작을 수행하고 의미 있는 작업을 완료할 수 있다.
또한 사람들은 대체적으로 앱이 자신의 개인 데이터, 자이로스코프 및 가속도계 입력, 공간 상호작용에 참여하는 것을 원하기도 한다.
4. 앱 상호작용 : 때때로 사람들은 1~2분만 사용하여 이벤트 또는 소셜 미디어 업데이트를 확인하거나, 데이터를 추적하거나, 메시지를 보낸다. 하지만 어떤 때는 1시간 이상 웹을 브라우징하거나, 게임을 플레이하거나, 미디어를 감상하기도 한다. 일반적으로 사람들은 동시에 여러 앱을 열어 놓으며, 여러 앱 간에 자주 전환한다.
5. 시스템 기능 : iOS는 사람들이 친숙하고 일관적인 방식으로 시스템 및 앱과 상호작용할 수 있는 기능을 제공한다.
- 위젯, 홈 화면 빠른 동작, Spotlight, 단축어, 동작 보기
모범 사례
탁월한 iPhone 경험을 제공하려면 사람들이 가장 중요하게 생각하는 플랫폼 및 기기의 기능이 통합되어야 한다. iOS와 잘 어울리도록 디자인하려면 다음과 같은 방법을 우선시하여 이러한 기능을 포함하면 좋다.
1. 인지적 부하 최소화 : 화면상의 제어기 수를 제한하고, 최소한의 상호작용으로 추가 세부사항 및 동작을 찾을 수 있도록 하여 사람들이 주요 작업과 콘텐츠에 집중할 수 있도록 해야한다.
- (예) 음악 앱 (Apple Music) : 재생 목록에서는 곡 제목만 보여주다가, 특정 곡 옆의 ... 버튼을 눌러야 '플레이리스트에 추가', '공유', '삭제' 메뉴 등이 나타남.
2. 유연한 상태 대응 : 기기 방향, 다크 모드, 다이나믹 타입과 같은 화면 모양 변경 사항을 매끄럽게 적용하여 사람들이 자신에게 가장 적합한 구성을 선택할 수 있도록 해야한다.
- (예) 메모 앱 : 사용자가 설정에서 글자 크기를 키우면, 메모 내용의 가독성을 위해 레이아웃이 자동으로 확장되며 줄바꿈이 조절됨.
3. 인체공학적 상호작용 : 사람들이 일반적으로 기기를 잡는 방식과 부합하는 상호작용을 지원해야한다. 대부분의 사람들은 디스플레이의 중간 또는 하단 영역에 위치한 제어기가 사용하기 더 쉽고 편하다고 느낀다. 따라서 사람들이 쓸어넘기기 동작으로 뒤로 이동하거나, 목록 행에서 동작을 실행할 수 있도록 하는 것은 매우 중요하다.
- (예) Safari : 주소창을 화면 상단에서 하단으로 옮겨 엄지손가락이 쉽게 닿게 함. 또한, 화면 왼쪽 끝을 오른쪽으로 쓸어넘겨(Swipe) 뒤로 가기 지원함.
4. 플랫폼 기능 통합 : 사람들로부터 권한을 받아, 데이터 입력을 요청하지 않으면서 경험을 향상하는 방식으로 플랫폼 기능을 통해 사용할 수 있는 정보를 통합해야한다. 결제를 수락하거나, 생체 인증을 통해 보안을 제공하거나, 기기의 위치를 사용하는 기능을 제공할 수 있다.
- (예) 배달 앱 : 주소를 직접 타이핑하게 하는 대신, GPS 위치 권한을 받아 '현재 위치로 설정' 기능을 제공. 결제 시 카드 번호 입력 대신 FaceID로 즉시 승인.
마무리
예전에 유튜브 앱을 사용하면서 숏츠를 내리는데 오른쪽에 좋아요 부분이 너무 위에 있어서 한 손으로 누르기 어렵다는 생각을 했었는데, 그 이후 업데이트 버전에 좋아요 버튼이 밑으로 내려와서 신기했다.
아무래도 개발자가 인체공학적 상호작용 부분에 대해 고민하고 적용한 것이 아닌가 싶다.
또 나는, 인지적 부하 최소화 부분에서는 굉장히 신경쓰려고 노력하지만 유연한 상태 대응 부분에 있어서는 기기 크기, 다크 모드 대응 등 신경 쓸 case가 너무 늘어나다보니 잘 고려를 안했었는데 이 부분에 대해 좀 더 연구해서 잘 적용할 수 있게 노력해봐야겠다.
