UX/UI 디자인 노하우
1.어떻게 도출된 기능을 구조화 해야 할까요
요구사항 정리 > 정보화 구조 (IA)
IA는 경쟁사 벤치마킹 효율적
앱 실행 후 홈화면에 도달하기전 지나가는 부분 : 모달2.어떻게 내비게이션을 만들어가야 할까요
유저플로우 만들기
User Goal(사용자 목적) -> Task Flow(각 스크린별 단순 텍스트) -> Wire Flow(각 스크린별 상세정보 )3.어떻게 레이블을 만들어가야 할까요
카드소팅
오픈 카드 소팅 : 사용자가 그룹이름 정함
클로즈 카드 소팅 : 그룹이름 정해져 있음4.어떻게 빠르게 사용성을 평가하고 분석할 수 있을까요
평가와 사용성테스트 구분
평가 : 전문가 측정(신속) 테스트 : 전문가가 사용자를 테스트 시킴
5.어떻게 휴리스틱 평가를 해야할까요
휴리스틱 평가 : 전문가 경험 바탕
5명 내외의 평가자 기준
제이콥 닐슨의 10가지 휴리스틱 평가 원칙6.어떻게 경쟁 및 유사 제품을 벤치 마킹할 수 있을까요
제이콥닐슨의 휴리스틱 평가를 통한 벤치마킹
(동일한 테스크를 진행하면서 발생한 사용성 문제를 비교 분석)
테스크 완료 시간 측정을 통한 벤치마킹
(동일한 태스크를 완료하는데 걸리는 시간을 측정하여 비교 분석)
SEQ(Single Ease Question)를 통한 벤치마킹
(동일한 테스크를 완료한 후 전반적으로 얼마나 어렵거나 쉬웠는지를 측정하여 비교 분석)
모바일UX
애플 개발자 페이지의 디자인 가이드라인을 보며
플랫폼
디자인을 이해한다.
https://developer.apple.com/design/
1.터치스크린 UI는 어떤 특징이 있나요
가장 큰 특징은 제스처를 통해 조작
터치 UI에서 사용자에게 제공해야할 3가지 : 트리거,액션,피드백
2.왜 픽셀 밀도를 알아야 할까요
-1배수 디자인 > 2배수에서 줄이려고하면 픽셀 깨짐 가능성
픽셀 밀도
물리적으로 1인치(2.54cm * 2.
54cm) 안에 들어가는 픽셀(화소) 수
아이폰(PT 단위) : 1X 2X 3X
안드로이드폰(DP 단위) : 0.5X 1X 1.5X 2X 3X 4X
3.앱 아이콘은 어떻게 디자인해야 하나요
앱스토어나 알림아이콘, 설정아이콘
앱 아이콘
디바이스 별 픽셀 밀도와 사용되는 영역에 따라 디자인
iOS 앱 아이콘
아이폰 맥스 60X60@3X 180X180
아이폰 60X60@2X 120X120
아이패드 프로 83.5X83.5@2X 167X167
아이패드, 미니 76X76@2X 152X152
앱 스토어 1024X1024@1X 1024X1024
안드로이드OS 앱 아이콘
MDPI 48X48(1X) 48X48
HDPI 48X48(1.5X) 72X72
XHDPI 48X48(2X) 96X96
XXHDPI 48X48(3X) 144X144
XXXHDPI 48X48(4X) 192X192
구글플레이 스토어 512X512(1X) 512X512
4.앱 구조
애플 휴먼 인터페이스 가이드
애플 human interface guidelines 참조
Bars, Views, Controls
5.사용자 인터랙션
애플 휴먼 인터페이스 가이드
6.시스템 가능 기능
애플 휴먼 인터페이스 가이드 중 컬러,텍스트,스크린 디자인 영역
비주얼 디자인
아이콘과 이미지
바(Bar)
뷰(View)
컨트롤(Control)
익스텐션(Extension)
https://developer.apple.com/kr/design/resources/
디자인 리소스 페이지로 가면 각종 디자인 템플릿이 제공되니 참고하기 바란다.
모바일 디자인에 대한 감이 조금 오는 단계인것 같다.
디자인을 할때 임의로 하는게 아니라 플랫폼에 따라 요구사항이 있고 거기에 맞춰야
출시를 할 수 있다는걸 기억하자.
이상 국비지원교육 3주차 후기를 마친다.
