[UX] 1. 정보구조(IA, information Architecture) 서비스를 정보 위주로 시각화한 설계도 구성요소 별 구성 기능 고민 우선순위에 따라 정보 구조 재구성 때에 따라 정보 구조를 생략하고 와이어프레임으로 대체하는 경우도 있긴 함 정보 구조를 그리지 않더라도 전체 구조 생각하기 와이어프레임에 정보 구조 함께 포함해서 공유하거나 팀 회의에서 그려서 공유하기 2. 와이어프레임(wireframe) 화면 설계, 화면 사이의 플로를 비롯해 실제적인 레이아웃을 그려보기 표현에 너무 오랜 시간을 보내지 말 것, 정보의 중요도에 따라 배치하도록 주의 3. 다양한 케이스 대응 어떤 컴포넌트에 관한 문제인지 정의 데이터를 받아올 수 없는 케이스 정의 데이터를 받다가 중간에 실패한 케이스 정의 데이터를 ..
31p : (스리마일섬) 사고 당시 기계와 인간은 상대방이 이해하는 언어로 소통하지 못했다. 37p : 디자이너는 사람들이 왜 지금처럼 행동하는지 이해해야 하고, 존재하지 않는 이상향이 아닌 인간의 약점과 한계를 디자인에 반영해야 한다. 45p : 피드백이 있기에 언어 없이도 디자이너가 사용자와 소통할 수 있다. 48p : 21세기 디자인의 가장 큰 숙제는 환경이나 의료, 정부처럼 현재 피드백이 부족한 영역에 좀 더 양질의 피드백을 자주 제공하는 일이 아닐까. 49p : 새로운 기술이 등장하면 우리가 주고받을 수 있는 피드백의 내용뿐 아니라 속도도 발전한다. 그 결과로 우리는 새로운 정보를 더 효율적으로 활용할 수 있다. 74p : (헨리 드레이퍼스)는 다른 누군가의 삶을 창피하고 혼란스러운 면, 호기심..
1. UI 요소 이미지 캐러셀 : 여러 장 이미지 좌우로 이동하며 볼 수 있는 인터페이스. 캐러셀 이미지는 대부분 고유한 링크 값을 가진다. 코치 마크 : 처음 앱을 열었을 때 중요 기능을 먼저 알려주는 인터페이스 2. 모바일 서비스 개발 방식 비교 네이티브 앱 : 앱이라 부르는 모바일 서비스. 하나의 운영체제에서만 동작. 모바일 웹앱 : 인터넷 브라우저에서 실행되는 웹사이트. 웹 기반으로 모바일 기기에 최적화되어있지는 않음 하이브리드 앱 : 겉보기엔 네이티브 앱 같지만 실제는 웹을 기반. 플랫폼에서만 다운로드 가능. 앱 안에서 웹 페이지를 불러오는 방식 특징 네이티브 앱 모바일 웹앱 하이브리드 앱 디바이스 고유 기능 접근 높 낮 중간 UI 유려함 높 중간 중간 업데이트 유연성 낮(앱스토어) 높 높 개발..
1. UI 구성 요소와 디자인 패턴 어포던스 : 행동 유도성, 사용자가 행동을 이해할 수 있도록 버튼 구성 요소 : 컨테이너(버튼을 구성하는 영역), 레이블, 아이콘, 그림자, 아웃라인 상태 디폴트 default/normal/enabled : 기본 상태, 누를 수 있는 상태 호버 hover : 데스크톱에서, 마우스나 팬 포인터가 위에 올라간 상태 프레스드 pressed : 누른 상태 포커스 focus : 입력장치를 통해 선택된 상태 비활성 disabled/inactive : 비활성화 상태. 선택이 불가능한 상태 로딩 loading/progress : 버튼을 누른 후 로딩이 진행 중인 상태 고스트 버튼 : 배경색이 없고, 버튼의 레이블과 아웃라인 색을 일치시킨 버튼 텍스트 버튼 : 누를 수 있는 텍스트, ..