[내가 필요해서 정리한 모바일 UX/UI 디자 | 커리어리

[내가 필요해서 정리한 모바일 UX/UI 디자인 가이드라인 4] 🏷Vivian's Curating 이 시리즈의 모든 글이 매우 유용하게 쓰이고 있고, 디자인할 때에 도움이 됩니다. ux/ui 가이드라인은 총 5개로 정리가 되어 있어요. 이제 이 글을 정리하면 1개의 글이 남게 되겠네요. 본인이 직접 디자인하면서 겪어 본 어려운 점들을 이해하기 쉽게 그림과 글로 정리해주신 글쓴이님께 정말 감사드려요😘 ✍️요약 34. 내비게이션 요소와 UI 요소가 콘텐츠보다 더 부각되지 않아야 한다. → 내비게이션은 목표가 아니라 수단. → UI 컨트롤과 내비게이션 요소를 조직화하고 통합하여 콘텐츠보다 부각되는 걸 최소화해야 한다. 콘텐츠 페이지에서 콘텐츠 외적인 요소는 최소화한다. → 내비게이션바는 한단으로 디자인하며 모바일은 데스크탑에 비해 더욱 단순화해야 한다. 35. 삭제와 같이 되돌릴 수 없는 액션의 경우, 다시 한번 확인 요청을 한다. → 항목을 삭제하거나 입력을 하던 중 취소할 경우, 다시 한번 확인 요청을 해야 한다. → 이용자가 실수를 해도 다시 원상 복구 할 수 있어야 한다. 36. 사용자의 노력으로 만들어진 정보는 쉽게 삭제할 수 없게 디자인 되어야 한다. → 블로그, 주소록, 장바구니에 담긴 상품 등. → 액션을 취소하고 다시 실행할 수 있어야 하며, 실수를 했다면 원상 복구 할 수 있어야 한다. → 장바구니의 전체삭제, 선택삭제 기능은 바보같다. 사용성뿐 아니라 전환율에도 좋지 않다. (장바구니는 오랜 시간 탐색을 통한 결과물이고 스팸메일이 아님) → 이용자의 잘못된 사용으로 인한 시간적 손실과 발생 가능한 시스템과 이용자의 위험 요소를 방지하기 위해 자연스러운 인터페이스의 제약이 필요하다. 좋은 예 1)자라 : 편집 버튼을 누른 뒤 편집 모드로 이동하여 항목을 삭제할 수 있음. 좋은 예 2)페이스북 : 개별 삭제만 가능하며 삭제 버튼 노출 X. 팝오버를 통해 삭제 가능. 37. 리스트에서 선택 또는 실행 버튼은 불필요하다. → 리스트 항목을 터치할 경우 주요 액션이 실행되므로 주 액션을 실행하기 위한 버튼, 아이콘, 텍스트는 불필요하다. → 리스트 내에 주 액션 외의 부수적인 액션은 오른쪽에 위치하도록 디자인한다. ex. 배송지 항목 : 목록 중 하나를 탭할 경우 바로 배송지가 적용되도록 하며, 주소를 수정하는 부수적인 액션은 우측에 디자인한다. ex. 음악 차트 리스트: 듣기 또는 재생 버튼을 따로 디자인할 필요 없이 항목 선택히 바로 음악이 플레이 된다. 38. 주 액션과 되돌릴 수 없는 액션은 같은 위치에 배치하지 않는 것을 권장한다. → CTA 버튼은 가장 강조되고 그 외의 부가적인 버튼은 부각되지 않아야 한다. 39. 본문의 행간은 150% 이상이어야 읽기가 쉽다. → 모바일은 작은 화면으로 웹보다 가독성이 떨어지는 환경이기 때문에 글줄의 간격이 더 넓어야 한다. ex. 16pt 폰트에서는 24pt 이상의 행간이 적절. 40. 내비게이션 바에 너무 많은 컨트롤은 피한다. → 콘텐츠 페이지, 상세정보 화면에서는 현재 화면 타이틀, 뒤로가기, 화면 콘텐츠를 관리하는 컨트롤 외에 추가적인 요소는 넣지 않는 것을 권장한다. → 내비게이션 바를 겹쳐서 사용하지 않아야 한다. (한 단만 사용!) #UXUI디자인 #앱디자인 #모바일디자인 #디자인가이드

모바일 UI·UX 디자인시 고려해야 할 가이드라인 4

brunch

2021년 5월 13일 오전 2:33

댓글 0

주간 인기 TOP 10

지난주 커리어리에서 인기 있던 게시물이에요!

현직자들의 '진짜 인사이트'가 담긴 업계 주요 소식을 받아보세요.

커리어리 | 일잘러들의 커리어 SNS