[UI, UX] 언제, 어떤 키보드를 왜 사용해야할까?
사용자를 고려한 작은 배려가 서비스에 대한 기대감으로 연결된다.
모바일 앱을 이용하며 정보를 입력하기 위해 다양한 종류의 키보드를 사용해본 경험이 있으실 겁니다.
키보드에 대해 기억나는 경험들이 있으신가요? 서비스명까지 뚜렷하게 기억나는 경험은 적을지라도, 편의를 느꼈던 부분들에 대한 기억은 비교적 쉽게 떠올릴 수 있을 겁니다.
좋은 UX에 '그냥'은 없음. 진짜 없음.사실 별 느낌을 받을 수 없는 단순한 키보드일 수도 있겠습니다만, 제 경우에는 입력 폼 형식에 적합한 키보드를 볼 때 '조금이라도 내가 더 편하게 입력할 수 있게 배려해줬다. 디테일도 신경쓰는 서비스네' 하는 인상을 받는데요, 이는 '다른 부분에서도 사용자를 섬세하게 배려하겠구나'는 서비스에 대한 전반적인 기대감으로 연결되기도 합니다.
필요에 의한 단순 기능을 넘어, 서비스에 대한 기대감으로 연결시킬 수도 있는 디테일.
오늘은 키보드에 대해 이야기합니다. (키패드라고 부르기도 합니다.)
키보드 UX
우리 모두 익숙한 예시로 시작합니다.
좌 : 앱스토어 카드 번호 입력 / 우 : 따릉이 카드 번호 입력어떤 키보드가 입력이 더 편리할까요? 아쉬운 UI / UX 예시로 이젠 너무 익숙한 따릉이... 따릉아 행복해야 해
카드 번호 입력, 두 가지 포인트
1. 키보드의 종류 : 숫자 키보드(좌) / 일반 키보드(우)
2. 텍스트 필드 1개 / 텍스트 필드 4개로 분리함
일반적인 사용자라면 좌측이 더 편리할 겁니다. 큼직한 숫자 키패드야 말할 것도 없고, 입력에 필요한 화면 터치 횟수 역시 더 적으니까요.
따릉이의 경우 카드번호 필드를 4개로 분할하였습니다. 카드 번호뿐만 아니라 입력 필드를 선택하기 위해 3번의 터치를 더 필요로 합니다. 반면, 앱스토어의 경우 한 개의 필드에 쭉 입력하면 됩니다.
'3번 더 터치하는 게 그렇게 큰 일이냐'싶을 수 있겠습니다만, 네. 큰 일입니다. 피로감으로 연결될 수도 있고, 부정적인 기대감으로 연결될 수도 있으니까요.
키보드의 종류
OS 가이드라인 키보드와, 커스텀 키보드가 있습니다.
OS 가이드라인을 따르는 일반적인 키보드부터, 사용자의 편의를 고려한 커스텀 키보드 등 다양한 종류의 키보드가 있습니다.
OS 가이드라인 키보드 (일반 키보드) 종류
일반 키보드의 종류가 이렇게 많습니다.....와우IOS 기준
1. Twitter : @ 및 # 문자에 쉽게 액세스 할 수 있는 키보드. 인스타그램 역시 트위터 키보드를 사용합니다.
2. DecimalPad : 숫자와 소수점이 있는 키보드
3. WebSearch : 웹 검색에 특화된 키보드 ".", "space" 강조
4. EmailAddress : 이메일에 특화된 키보드 "@", ".", "space" 강조
5. NumbersAndPunctuation : 숫자, 구두점에 특화된 키보드
6. ASCIICapableNumberPad : 표준 ASCII 숫자를 표시하는 키보드
7. ASCIICapable : 표준 ASCII 문자를 표시하는 키보드
8. Default (기본) : 일반적인 기본 키보드
9. URL : 웹 주소를 입력하는 키보드 ".", "/", ". com" 강조
10. NumberPad : 숫자 PIN 입력에 특화된 키보드
11. NamePhonePad : 이름과 전화번호에 특화된 키보드
12. PhonePad : 전화번호를 입력하는 키보드 "*", "#" 강조
안드로이드 기본 키보드와의 차이점은 보조 버튼의 유무와 위치가 조금씩 다릅니다.
샘플
커스터마이징이 들어간 것도, 들어가지 않은 것도 있습니다.커스터마이징이 약간만 들어간 것도 있구요.
앱 서비스를 이용하실 때, 어떤 키보드를 언제 사용했나 관찰해보는 것도 좋은 학습 방법입니다. 타당한 근거로 기획했을 가능성이 높거든요.
왼쪽부터 IFTTT : 이메일 입력 / 현대포인트몰 : 검색창 / 페이스북 : 게시물 작성 / 토스 : 지출내역 입력
왼쪽부터 토스 : 지출처 입력 / 띵동 : 휴대폰 인증 / 인스타그램 : 게시물 작성 / 데일리호텔 : 이름 설정커스텀 키보드
좌측부터 뱅크 샐러드, 슬랙, 노션OS 가이드라인 키보드(일반)에선 구현이 불가능한 기능들을 담아내기 위해 사용됩니다. 본인들의 서비스를 이용하는 사용자의 편의를 위해 특별히 개발된 키보드입니다. 뱅크 샐러드의 경우 금액을 계산할 수 있는 키패드가 추가되어 있습니다. 슬랙과 노션의 경우 자주 이용하는 기능들이 추가되어 있다는 사실을 확인할 수 있습니다.
모든 기능에 커스텀 키보드를 넣을 필요는 당연 없습니다. 또한, 커스텀 키보드를 사용할 때엔 일반 키보드보다 더 많은 고민과 실험이 필요할 겁니다.
마무리
여러 앱 서비스를 통해 이제는 너무 익숙해진 키보드이지만 그 종류와 목적이 이렇게 다양합니다.
화면을 기획할 때 고민 없이 그저 랜덤 한 키보드 샘플 이미지를 삽입하거나, 별 다른 설명을 하지 않는 것보다 '사용자가 어떻게 하면 조금 더 편의를 느낄 수 있을까'에서부터 시작된 고민으로 키보드를 정의하여 명세한다면 개발자와 보다 원활한 소통을 할 수 있을 것이며 우리 서비스 사용자들이 아주 조금이라도 더 편하게 이용할 수 있을 것입니다.
Copyright 2020. 엠케이랩. All rights reserved.
참고자료
