brunch

You can make anything
by writing

C.S.Lewis

by 김자유 Apr 26. 2020

앱 디자인 시, 가장 적절한 텍스트 양?

*본 글은 디자인 뉴스레터 디독에서 발행한 글입니다.

해외 디자인 아티클 번역 뉴스레터 '디독' 구독링크: http://bit.ly/2FNQNpv


목차


1. 텍스트 측정

2. 결과 계산

3. 앱에서 살펴보는 텍스트 사례

4. 노출하는데 적절한 양의 텍스트는?

5. 텍스트 작성하기

6. 앱 디자인 시 빠질 수 없는 텍스트


나는 앱의 첫 화면에 얼마나 많은 양의 텍스트가 노출되고 있는지 알아보고자 인기 있는 iOS 앱 25개를 연구했다. 여전히 프로덕트를 디자인할 때 ‘텍스트’ 요소를 무시할 수 없다는 점을 생각하면, 본 연구 결과는 우리가 앞으로 모바일 앱을 디자인할 때 어떠한 원칙을 가지고 적절한 텍스트의 양을 결정할 수 있다는 데 의미가 있다.



오늘날 우리의 디지털 경험은 모바일 앱이 전부라고 해도 과언이 아니다. 이 중 2019년, 사람들은 2,040억 개의 모바일 앱을 구글과 애플 앱스토어를 통해 다운받았다. 구글 검색과 함께 계산기를 두들기다 보면, 지구상의 모든 사람이 갖고 있는 평균 모바일 앱의 개수는 25개라는 결과가 나온다.


코드, 시각적인 것과 상호작용을 제외하고
이 모든 앱들이 서로 갖고 있는 공통점은 무엇일까?
답은, 텍스트.


사실 내 휴대폰에는 그것보다 훨씬 더 많은 수의 앱이 설치되어 있다. 내가 마지막으로 기억하는 앱의 개수는 161개로, 영화, 음악, 날씨, 지도에 이르기까지 거의 모든 상황에 앱을 사용한다. 사회적으로 연관된 수많은 것들, 은행, 여행, 지역 서비스, 피트니스, 요리, 게임 심지어 정부가 만든 앱 서비스까지 말이다. 여기에 코드, 시각적인 것과 상호작용을 제외하면 이 모든 앱이 갖는 공통점은 무엇일까?


답은, 텍스트다. 모든 앱에는 아주 적게라도 텍스트가 일부 포함되어 있다. 텍스트는 인터페이스 조작, 탐색 레이블, 검색 프롬프트 등을 구성한다. 텍스트는 각 앱의 이름을 시작으로 해당 앱 서비스를 소개하며, 가이드와 입력에서부터 설정과 거부에 이르기까지 앱이 어떻게 작동되고 어떤 가치를 제공하는지 안내한다. 서비스의 전반에 걸쳐 텍스트는 사용자가 앱을 통해 가치를 얻을 수 있도록 많은 역할을 수행하고 있다. 만약 텍스트가 없다면 당장에 여러분은 앱을 사용하기 어렵다고 느낄 것이다.


이처럼 텍스트가 앱에 대한 우리의 사용 경험에 중요한 요소라면, 우리는 왜 인터페이스 디자인 시 상대적으로 텍스트의 역할에 소홀한 걸까? 우리의 디자인에 그것이 가장 당연하게 충족되어야 할 요소 중 하나라면, 왜 대부분의 팀에서 이에 대해 마지막에서야 검토하는 일이 비일비재한 걸까?


이에 대한 내 가설은, 주변에 너무 흔하다 보니 텍스트의 중요성을 망각해버렸다는 것이다.


1. 텍스트 측정


나는 200개의 셀 그리드를 이용해, 앱에서 텍스트를 노출하는데 얼마나 많은 공간을 사용하고 있는지, 얼마나 많은 셀이 문자, 숫자, 단어 또는 다른 언어를 포함하고 있는지 알아볼 수 있는 방법을 만들었다. 나는 이 측정 방법을 가지고, 소셜미디어, 라테일, 서비스, 개인 금융 등 다양한 분야의 인기 있는 iOS 25개의 앱 서비스의 첫 번째 화면을 조사했다.


이 과정을 Apple Music을 예시로 살펴보면 다음과 같다.


맞다. 지금 보이는 앨범은 NKOTB의 앨범이다. (이게 중요한 게 아니라) 애플 뮤직 iOS 앱의 첫 화면을 위 방법으로 살펴보면, 전체의 약 36% 영역에 텍스트가 포함됐다.

하지만, 나는 앱에 얼마나 많은 텍스트가 노출되는지 보다 더 중요한, 사용자에게 보여지는 적절한 텍스트의 양이 얼만큼인지가 더 궁금했다.


2. 결과 계산


대부분의 iOS 앱에서 시작 화면의 36% 영역을 텍스트를 노출하는 데 사용하고 있음을 확인했다. Snapchat의 경우 3.5% Ticketmaster의 경우 57.5%로 나타났지만, 많은 애플리케이션이 30%에서 40% 사이에 집중되어 있었다. 제일 많은 양의 텍스트를 노출하는 상위 랭킹에는 Uber(50.5%), Paypal(47%), Google Map(44%) 등이 있다.


25개 앱에 대한 연구 및 결과는 여기서 살펴볼 수 있다.


이 모든 앱을 살펴보면, 텍스트를 표시하는 데 사용된 화면 공간의 영역이 매우 유사하다는 것을 알 수 있다. 노출이 가장 많거나 적은 결과값을 제외하면, 평균은 거의 변하지 않는다. 이 차트에서 볼 수 있듯 내가 연구한 앱의 절반 이상이 화면 영역의 30~40% 영역 사이에 텍스트를 노출하고 있음을 확인할 수 있다.



3. 앱에서 살펴보는 텍스트 사례


모든 앱이 동일한 목적이나 용도로 생성되거나 사용되는 것은 아니기 때문에, 표시하는 텍스트의 양은 상황에 따라 크게 달라진다. 이것이 앱을 사용하는 사람들을 위해 우리가 고려해야 할 부분이기도 하다.


가령, Paypal(47%)과 Revolut(35%) 같은 개인 금융 앱은 시작 화면에서 계정, 최근 거래, 활동에 대한 정보를 표시하고자 많은 양의 텍스트가 노출된다. 마찬가지로 Amazon(31.5%)과 eBay(33%) 등 판매/유통에 초점을 맞춘 앱이나, Deliveroo(33.5%), Uber(50.5%)와 같이 사용자에게 즉각적인 가치를 제공해야 하는 앱 서비스는 더 많은 텍스트를 노출해야 할 경우가 많다. 특히, Google Map(44%), Strava(41%), Uber(50.5%) 등 지도에 초점을 맞춘 앱은 라벨 형태로 전달해야 하는 메타데이터가 있다 보니, 사용자가 이동하는데 필요한 텍스트 정보가 가장 많은 것을 확인할 수 있었다.


소셜 미디어 앱은 텍스트 대신,
개인 비디오나 이미지를 공유하고자
대부분의 영역을 비워둔다.

반면, Snapchat(3.5%), TicTok(16.5%), Instagram(20%) 등과 같은 소셜미디어 앱은 인터페이스 대부분을 텍스트 대신 개인 동영상이나 이미지를 공유하기 위해 비워둔다. 해당 매체가 텍스트를 포함하는 경우라 할지라도, 일반적으로 탐색이나 맥락적 상황에서 보조의 역할만 할 뿐이다. Fitbit(29.5%)와 Strava(41%)와 같은 활동 추적 앱은 텍스트나 언어로 데이터를 표현하기 보다는 활동 데이터를 시각적으로 사용자에게 전달하는데 더 많은 화면을 할애하는 경향을 보였다.


다음은, 앱 카테고리별 그룹의 평균 결과이다.

(일부 앱은 두 개 이상의 카테고리에 포함되는 경우가 있어 여러 번 표시되었다)

소셜미디어 (Facebook, Instagram, Snapchat, TikTok, Twitter, YouTube) 26.4%

피트니스 (Fitbit, Strava) 35.3%

여행 (airbnb, Ryanair) 35.5&

음악 및 오디오 (Apple Music, Spotify Stitcher) 36.3%

스트리밍 미디어 (Apple Music, Netflix, Prime Video, Spotify, Stitcher, YouTube) 38.8%

서비스 (Airbnb, Deliveroo, Uber) 40.5%

유통 (Amazon, eBay, Ticketmaster) 40.7%

개인 금융 (Paypal, Revolut) 41.0%

지도 및 운송 (Strava, Google Maps, Uber) 45.2%


4. 노출하는데 적절한 텍스트의 양은?


나는 앱 화면에 노출하는 적당한, 혹은 가장 좋은 텍스트의 양은 얼마큼 인지에 대한 질문에 대해 명확한 하나의 답은 없다고 가정하고 이 연구를 시작했다. 앱이 제공하는 서비스를 만드는 사람이 사용자에게 어떻게 제공할 것인가에 따라 달라질 수 있기 때문이다.


나는 이러한 가설을 확인하고자,


‘앱 애니’라는 다운로드 순위를 가지고 앱에 노출된 텍스트의 양과 비교하여 앱의 인기 혹은 시장 점유율과 관련이 있는지 알아보았다.

앱스토어의 랭킹과 앱의 텍스트 양 사이에는 매우 약한 관계를 보여주며, 이 조사에서는 어떠한 상관관계도 발견할 수 없었다.


혹여 이러한 요인들 사이에 강한 상관관계가 있다고 하더라도, 우리는 이 상관관계가 인과관계는 아니라는 것을 알고 있다. 전체적으로 내가 발견한 가장 중요한 사실은, 11개의 인기 있는 앱들이 화면의 30~40% 사이의 영역을 텍스트를 노출하기 위해 사용하고 있다는 점이다.


내 이론은, 개발자들이 앱의 첫 화면의 30% 이하
또는 40% 이상을 텍스트 영역으로 사용해서는 안 된다는 것이다.

이를 증명하기 위해서는 더 많은 앱을 연구해야겠지만, 내 이론은 앱 개발자들이 소셜 이미지/비디오 혹은 뉴스/금융과 같은 특정 분야에 집중하지 않는 한, 앱의 첫 화면의 30% 이하 또는 40% 이상을 텍스트 영역으로 사용해서는 안 된다는 것이다.


텍스트 노출을 위해 30~40% 범위 밖으로 화면을 사용하고자 하는 회사는, 그 결정을 신중하게 따져보고 연구와 테스트로 유의미 한지 검증해야 한다. 그렇지 않으면, 전 세계의 인기 있는 앱에 존재하는 분명한 추세에서 벗어난 채로 앱이 만들어질 것이다.  


그렇다면, 이 결과로부터 어떻게 여러분이 앱에 노출된 적절한 양의 텍스트를 결정할 수 있을까?



5. 텍스트 작성하기


내가 연구한 모든 앱 중에서 가장 특이한 앱이 바로 Snapchat이라는 것을 눈치챘을 것이다. 앱의 첫 화면의 3.5% 영역만을 사용해 텍스트를 보여준다.


물론 사진 속 우리 강아지는 100% 사랑스럽지만! Snapchat iOS 앱의 경우, 첫 화면의 약 3.5% 영역만이 텍스트를 담고 있다.


이러한 최소한의 텍스트 사용 사례는 추가로 더 정밀한 조사가 가능했는데, 특히 연구 시 이에 가장 가까웠던 앱은 TicTok으로, 첫 화면의 16.5% 영역만을 사용해 텍스트를 노출하고 있다는 점이다. 이 부분에서 앱 개발자는 사용자에게 노출할 텍스트의 양과 품질에 대해 어떻게 결정을 내야 하는지에 대해 의문이 제기된다.


intercom에서는 이런 경우에 어떠한 원칙을 가지고 결정을 내리고자 노력한다. 이미 알려진 실패는 피하고, 성공할 수 있는 방법을 반복하며, 제품에 빠르게 적용하면서 일관성을 유지하는 것이다. 예를 들어 우리는 ‘더 적은 것을 위해 노력하라'는 컨텐츠 디자인 원칙을 갖고 있는데, 이것은 우리가 각기 다른 방법으로 똑같이 좋은 두 가지 옵션을 가지고 있을 때, 우리는 텍스트를 덜 사용하는 옵션을 선택한다는 것을 의미한다.


Snapchat은 카메라 뷰로 실행되기 때문에,
사용자가 가능한 한 빨리 자신의 스냅을 만들 수 있다.
다른 사람의 스냅을 보는 것은 사용자가
자신의 스냅을 만든 다음의 일이다.

Snapchat도 비슷한 원칙을 따를 수 있겠지만, 단순히 카메라 퍼스트 앱만 만드는 것이 아니라, 크리에이터 퍼스트 앱을 만들고 있기 때문에 많은 텍스트를 보여줄 필요는 없다. Snapchat은 카메라 뷰로 열리기 때문에 사용자는 자신의 스냅을 가능한 한 빨리 만들 수 있는 것이다. 다른 사람의 스냅을 보는 것은 사용자가 자신의 스냅을 만든 다음의 일이다.


한편, 앱 중 가장 많은 양의 텍스트를 노출하고 있는 Ticketmaster는 앱 첫 화면의 57.5%를 텍스트 영역으로 사용하고 있다. 이는 유통이라는 앱의 카테고리 때문만이 아니라, 해당 서비스가 행사 티켓을 팔기 위해 대형 텍스트를 특징으로 노출하는 포스터 같은 이미지를 소구하는 데서 비롯된다. 그들은 읽기에 집중하는 Medium(51.5%) 같은 서비스보다도 많은 공간을 텍스트에 할애하고 있다.


Ticketmaster의 iOS 앱 첫 화면의 약 57.5%가 텍스트를 노출하고 있다.

Intercom의 컨텐츠 디자인 원칙 중 또 하나는 Simon Sinek의 “원인으로부터 시작하라"이다. 이 원칙은 우리가 사람들에게 제공하는 가치(그것을 제공하는 동기)가 어떤 것보다 우선되어야 한다는 것을 의미한다.


우리는 이 원칙을 eBay 앱에서도 발견할 수 있는데, eBay 앱에서 사용되는 첫 번째 텍스트는 ‘사용자들에게 상품을 안전하게 팔 수 있고 무료로 매달 100개의 아이템 목록을 얻을 수 있다’는 대비가 큰 배너이다.


나는 이 부분에서, eBay가 자신들이 발견된 두 가지 우려, 즉 1) 판매자는 구매자에 대한 신뢰가 부족한 점 2) 아이템 리스트를 작성하는 비용에 대한 부분을 현명하게 해결했다고 생각한다. 앱을 열 때 그 배너의 텍스트는 신규 사용자에게 가장 의미 있는 메시지로 전달될 수 있는 것이다.


eBay의 iOS 앱 첫 화면의 약 33%가 텍스트를 노출하고 있지만, 가장 중요한 것을 우선시하고 있다.



Intercom 컨텐츠 디자인의 마지막 원칙은 Steve Krug의 ‘사용자를 생각하게 하지마"이다. 이는 모호한 것들을 가능한 제거하고자 하는 것을 의미한다. 우리는 구체적이고 분명하게 전달하고자 보편적으로 사용되는 영어를 사용하고, 사용자가 즉시 봐야 할 가장 중요한 것을 강조하고자 노력한다.


이러한 원칙은 넷플릭스에서도 찾아볼 수 있는데, 이 앱 화면에서 주요 포인트는 Derry Girls라는 시리즈 영상에 있다. 이 시리즈 제목은 Netflix가 내비게이션과는 별개로 강조하고 있는 첫 메시지이며, 전체 화면의 8%를 사용하는, 대문자 텍스트로 표현됐다. UI 텍스트가 화면의 3.5%만 차지하고 Snapchat과 비교하면 Netflix에서는 사용자가 이 거대한 크기의 텍스트들에 관심을 가지길 바라는 것 같고, 분명히 그렇다. 여담이지만, 나는 이 작품을 좋아하고, 이 스크린을 막 캡쳐했을 땐, 바로 얼마 전 새로운 시즌이 시작되던 때였다.


Netflix의 iOS 앱 첫 화면의 약 38.5%가 텍스트를 노출하고 있다.

6. 앱 디자인 시 빠질 수 없는 텍스트
  

(자, 계산기를 두들겨보면..) 앱 첫 화면의 36%는 전체 공간의 3분의 1을 조금 넘는다.


특히 모바일 앱에서는 공간이 매우 작다는 점에서 이는 상당한 영역이라 할 수 있다. 즉 화면의 3분의 1을 차지하는 것은 그 영역만큼 가치가 있어야 한다는 것이다. 앱에서 본 텍스트가 사용자에게 어떤 가치도 전달하지 못한다면, 텍스트는 거기에 존재할 이유가 없다.


텍스트는 단순히 메시지를 전달하는 수단 그 이상이다. 텍스트는 인터페이스 자체로 역할을 하기도 한다. 모바일 앱 인터페이스에서 텍스트를 제거하면, 비어있다고 느껴지며 이는 사용자에게 혼란스러운 경험을 주게 된다. Mig Reyes는 6년 전에 데스크톱 웹 사이트를 가지고 이 실험을 진행했고,


“디자인에서 절대 텍스트는 빠질 수 없다"는 그의 교훈은 오늘날 모바일 앱에도 그대로 적용된다.


인터페이스에 텍스트가 있거나 없는 경우의 Revolut 앱 예시를 가져왔다. 과연 이런 앱을 사용했을 때 사용자가 의미 있고 가치 있는 경험을 할 수 있을까?


UI에 텍스트가 없다면, 대부분의 앱의 가치는 훨씬 떨어진다. 아니면 완전히 사용할 수 없게 될지도 모르겠다! 유일하게 예외라고 한다면, Snapchat이나 TicTok과 같은 카메라 기능이 퍼스트인 앱인 경우이다. 그러나 “카메라 퍼스트"가 “카메라만 있으면 완벽하다"는 걸 의미하는 것은 아니다. 이 두 가지 앱 모두 프로필, 친구목록, 설정과 같이 텍스트가 매우 많은 화면을 가지고 있다. 비록 첫 화면에 텍스트가 많지 않다 하더라도, 시스템 전체적으로는 텍스트의 역할이 크다는 것을 알 수 있다.


언어 자체를 유용하면서 사용할 수 있고
 기능적으로 만드는 데 무던한 노력이 필요하다.
마지막까지 끝난 게 끝난 것이 아니다.

대부분의 앱 디자인 팀에서는 게슈탈트 원리, 아이콘그라피, 컬러 구성, 타이포그라피 등 ‘아름다움' 같은 것에 많은 공을 들이지만, 언어 역시 디자인에 중요한 요소라는 점을 명심해야 한다. 이는 당신의 앱을 사용하는 사람들을 안내하는 정보 기반 요소로서, 온보딩이나 오류 상태와 같은 순간에만 보여지는 것이 아닌, 사용자의 앱 경험 전반에 존재한다.


그렇기 때문에 언어를 유용하면서 사용할 수 있고 기능적으로 만드는 데 무던한 노력이 필요하다. 이는 마지막까지, 아니 끝났다 하더라도 끝난 것이 아니며, 계속 유념해야 할 너무 흔하게 발생하는 문제이다. 결국, 언어는 완벽한 ‘경험’에서 벗어나는 존재가 아닌 것이다.


그것 자체로 경험인 것이다.


번역자 : 노효정

저자 : Jonathon Colman      

원문 링크: https://www.intercom.com/blog/text-in-mobile-app-design/?ref=uxdesignweekly
*무단 전재 및 재배포 금지(링크 공유 가능)


*본 글은 디자인 뉴스레터 디독에서 발행한 글입니다.

해외 디자인 아티클 번역 뉴스레터 '디독' 구독링크: http://bit.ly/2FNQNpv


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari