모바일 UI·UX 디자인시 고려해야 할 가이드라인 3
Brunch Story
🏷 Vivian's curating
디자인 가이드라인 시리즈가 많은 분들에게 도움이 되는 유용한 정보인 것 같아 기뻐요🥰
✍️ 요약
26. 라디오 버튼은 소팅 기능에 사용할 수 없다.
→ 라디오 버튼은 '선택'과 관련된 기능에서만 사용되어야 한다. (상호 배타적인 옵션에서만 사용)
→ 라디오 버튼을 탭했을 경우, 하나의 옵션만 상태가 변경되고 그 외의 액션이 실행되지 않아야 한다.
→ 이용자가 옵션을 선택했을 때 화면의 상태가 바뀌는 액션 실행은 세그먼트 컨트롤(iOS)나 Tab(탭) 또는 토글로 디자인되어야 한다.
27. 라디오 버튼 옵션 내에 또 다른 옵션을 넣지 않는다.
→ 모든 라디오 버튼 옵션은 선택과 관련된 하나의 레벨로 디자인되어야 한다. (체크박스나 입력필드 또한 X)
→ 옵션을 켜거나 끌 때는 스위치나 토글을 사용한다.
28. 링크 텍스트에 밑줄은 사용하지 않는다.
→ 모바일 앱의 경우 링크와 버튼은 구분하지 않고 '버튼'으로 표현한다.
→ 링크 = 네비게이션, 버튼 = 액션 실행 : 이 개념으로 이해
29. 선택 옵션이 5개 이하일 경우, 드롭다운 보다 옵션을 노출하는 것을 권장한다.
→ 일반적으로 7개 이상의 옵션일 경우 드롭다운 사용 권장.
30. 탭바(iOS)의 항목은 최대 5개로 제한된다.
→ 만약 더 많은 네비게이션이 필요하다면 [더보기]를 통해 부가적으로 접근하게 한다.
31. 경고창의 버튼은 테두리가 없는 텍스트 버튼 사용을 권장한다.
→ 테두리나 면으로 된 버튼은 랜딩페이지의 CTA 버튼 같은 중요한 경우에만 사용 권장.
→ 그 외 경고창(다이얼로그, 얼럿) 같은 화면에서는 텍스트 버튼 사용 권장.
32. 테두리 or 면으로 된 버튼보다 테두리가 없는 텍스트 버튼을 기본으로 사용하는 것을 권장한다.
→ 버튼 레이블을 의미있는 단어로 지정하고 메인 컬러나 시스템 컬러를 사용해서 해당 요소가 인터랙션 가능하다는 것을 알린다.
→ 테두리 or 면으로 된 버튼 디자인은 가장 중요하고 강조해야하는 버튼에 사용한다.
33. 중요한 CTA 버튼의 경우 사용자가 스크롤하더라도 지속적으로 볼 수 있어야 한다.
→ 이용자가 페이지 내에 상세한 콘텐츠를 보다가도 필요할 때 사용 가능하게 화면 하단에 지속적으로 노출되어야 한다.
ex. 상품 상세페이지에서 '구매하기' 버튼은 화면 내에서 항상 노출되어 있어야 한다.
#UXUI디자인 #앱디자인 #모바일디자인 #디자인가이드
다음 내용이 궁금하다면?
이미 회원이신가요?
2021년 5월 12일 오전 9:30
1
... 더 보기2
... 더 보기