[7주차] Usability 휴리스틱
휴리스틱
사용성을 평가하기 위한 척도로 사용되는 10가지 기준 신규 서비스를 출시 하기 전에 체크 리스트 기준으로 활용
좋은 사용자 환경을 만들 수 있구나
1. 시스템 상태의 시각화
- 기기의 문제점을 확인할 수 있도록 시각호
- 상태 정보 시각화 _ 현재 어디 있는지
- 로딩 중인 표시 _ 우리 브랜드 요소 담을 수 있음
2. 시스템과 실제 세계의 일치 (Metaphor)
사람들은 본인의 경험을 기반으로 새로운 시스템의 동작을 이해하려고 한다. 실제 세계와 일치하는 모델을 차용하면 사용자의 인지에 도움을 준다
ex. 스키노피즘 디자인 ⭐️
***** 적용하기 좋다****
3. 사용자 제어와 자유
사용자들이 무의식중으로 기능을 수행하거나 의도하지 않았던 경로로 이동하는 경우가 있다.
의도하지 않았던 상황을 취소하거나 빠져 나올 수 있도록 기능을 제공해야 된다.
ex. 실수로 문서를 삭제하거나, 네비게이션 위치를 잘못 설정- 빠르게 빠져나올 수 있도록
4. 일관성과 표준 (Consistency)
디자인 표준을 준수하고 일관성을 유지하면 빠르게 기능을 예측하고 학습 하는데 도움을 준다.
다른 앱에서도 따르고 있는 익숙한 플랫폼 가이드라인을 따르면 사용자들이 새로운 서비스일지라도 길을 잃지 않고 친숙하게 긴으을 사용할 수 있다.
## Material 디자인 가이드라인 - 구글 스토어
휴먼 인터페이스 가이드 라인 - 애플
5. 에러방지
사용자가 에러를 발생할 수 있는 상황을 미연에 방지해라
ex. 컨펌 팝업, 유효성 체크 방식, call to action button 활성화
6. 에러 인식, 진단, 복구
에러를 사용자들이 인식하고 복구할 수 있도록 디자인 되어야 한다
어떤 문제인지 명확하게 말해줌- 어떻게 해결할 수 있는지도 알려줘야 한다.
복구할 수 있게 해야한다.
말랑말랑하게 디자인하는 것도 방법.
개발 플랫폼 특징
- 안드로이드 / 웹/ 하이브리드 _네이티브의 형태이지만 안에는 웹.
모바일은 이 3가지에 들어간다.
기준이 되는 해상도
os 설정
표준 가이드라인이 있음
1. 네이티브 앱
안드로이드 앱은 google play store iOS는 앱스토어에서 다운로드 가능하고 해당 OS에서만 실행 된다.
장점
- 다양한 네이티브 기능과 UI를 모두 이용할 수 있음 (카메라, 마이크, GPS, 스와이프 제스쳐)
- 가장 빠르고 안정적이며, 반응이 빠른 환경을 제공
단점
- 해당 OS에서만 다운로드 실행 가능하다
- 수정사항 발생 시 앱을 업데이트 배포해야 한다.
- 해당 플랫폼에서 요구하는 언어의 제약이 있음
언제 유용할까?
- 필수로 사용되어야 하는 플랫폼 기능이 있는 경우
- 입 기능이 많고 복잡한데 성능이 뒷받침이 되어야 하는 경우
2. 모바일 웹
브라우저 URL만 입력하면 어떤 디바이스에서도 동일한 내용을 확인할 수 있다.
장점
- 어떤 플랫폼에서든 동일한 콘텐츠를 볼 수 있다.
- 개발을 할 때 다른 방식보다 훨씬 적은 시간과 비용이 든다.
- 빠르게 최신의 내용으로 업데이트 가능하다
단점
- 디바이스에 대한 접근 권하이 없기 땜누에 모바일 OS에서 제공하는 기능들을 활용할 수 없다
- 네이티브, 하이브리드 앱보다 실행이 까다롭다.
(브라우저를 열고 검색 또는 URL을 입력해서 접근)
언제 유용할까?
- 다중 플랫폼 지원이 필요한 경우, 많은 사용자들이 다양한 채널을 통해 동시 접속할 때 동알한 서비스를 제공하는 목적일 경우 유용하다
- 콘텐츠가 빈번하게 변경될 경우 유용하다.
3. 하이브리드 앱
' 네이티브 +웹앱' , 네이티브 앱에 웹뷰를 띄워 웹앱을 실행시키는 형태이다.
장점
- 네이티브 API와 브라우저 API를 이용한 다양한 개발이 가능 하다.
네이티브 앱과 유사한 UI기능. 스마트폰 제어 기능 (카메라, 마이크 지문 인식 등)
- 크로스 플랫폼 대응이 가능하다. -> 같은 플랫폼을 안드, ios 둘 다 가능.
유지보수가 네이티브앱에 비해 쉽다.
단점
- 복잡한 네비게이션에서는 동선 문제 발생
- 네이티브 기능에 접근하기 위해서는 네이티브 개발 지식이 필요하다.
언제 유용할까?
- 다중 플랫폼 지원이 필요한 경우, 많은 사용자들이 다양한 채널을 통해 동시 접속할 때 동일한 서비스를 제공하는 목적일 경우 유용하다
- 콘텐츠가 빈번하게 변경될 경우 유용하다.
ex. 면세점
반응형 웹
여러가지 디바이스 환경에 맞춰 화면이 변경 됨.
이 전에 적응형 웹
데스크 탑 버전과 모바일 버전의 사이트를 각각 제작해 운영. 주소 앞에 'm'을 붙인 '모바일 웹 페이지'
하나의 소스 코드로 모든 스크린에 최적화 된 웹사이트를 구축할 수 있는 방법
브라우저 가로 넓이에 '반응'하여 구성 요소가 변하는 기술
- 디바이스 해상도에 유연하게 반응하고, 어떤 기긱에서도 동일한 콘텐츠를 볼 수 있어 일관성을 확보할 수 있다.
- 서로 다른 기기의 넓이에 따른 CSS를 추가로 코딩해야 한다. 하나의 넓이로 작업하는 것보다 더 많은 코드가 필요하고 초기 작업시간이 오래 걸린다.
마우스 우클릭> 검사
도구> 더보기>개발자 도구
Toggle > 디바이스 - 모바일로 변경 가능
프론트 링크 - 크롬으로 활용해서 검토 가능하다- 웹에서도
개발 플랫폼 정의
개발 플랫폼 정의 기준
어떤 플랫폼으로 갈 것이냐
1. 서비스의 목적
2. OS에서 제공하는 기능 활용
3. 콘텐츠 변경 주기
개발 플랫폼 출시 기준
국내 모바일 os 시장 점유율
stakecounter- 웹페이지에서 확인
플랫폼 출시 기준
플랫폼 출시 순서를 정할 때 고려하는 점
1. 내부 디자인과 개발, QA리소스를 고려한다. 동시 오픈을 준비하더라도, 일정 간격을 두는 걸 권장한다.
2. 출시 국가에서 OS의 시장 점유율을 고려한다
3. Target User 가 선호하는 OS를 먼저 출시한다.
