FrontEnd/UX_UI
-
플로우 차트 작성 규칙FrontEnd/UX_UI 2022. 2. 25. 15:54
플로우 차트 란.. 순서도는 어떠한 일을 처리하는 과정을 순서대로 간단한 기호와 도형으로 도식화한 것을 의미한다. 플로우 차트로 많이 사용하는 5가지 도형 1. 제이콥의 법칙(Jakob's law) 제이콥 닐슨(Jacob Nielsen) End of Web Design 사용자는 여러 사이트에서 대부분의 시간을 보낸다. 그래서 여러분의 사이트도 자신이 이미 알고 있는 다른 사이트들과 같은 방식으로 작동하길 원한다. 사용자는 자신에게 익숙한 제품을 통해 구축한 기대치를 그와 비슷해 보이는 다른 제품에도 투영한다. 기존의 멘탈 모델(Mental Model)을 활용하면 사용자가 새 모델을 익히지 않아도 바로 작업에 돌입할 수 있는 뛰어난 사용자 경험이 완성된다. 변화를 꾀할 때는, 사용자에게 익숙한 모델을 한시..
-
3. IA패턴의 종류FrontEnd/UX_UI 2022. 2. 22. 16:27
1. 계층(Hierarchy) 하향식 범주형 트리 상위 레벨을 통해서만 하위 레벨에 접근가능 논리적 계층 순서가 있는 정보들에 적합 레벨 단위로 이동하기 때문에 탐색이 번거로움 2. 탭(Tab) 계층 패턴의 일반적인 구현 방식 분류체계를 빠르게 이해하고, 각 컨텐츠에 접근 가능 멀티태스킹에 유리 정보가 많을 경우 오히려 복잡해 보이는 문제가 있음 3. 허브 앤 스포크(Hub & Spoke) 중앙 허브를 통하는 방식(산만함 방지) 섹션(스포크)에서 섹션으로 이동 불가 각각의 섹션이 뚜렷한 목적을 가지고 있는 경우 섹션 간 빠른 이동이 불가능하기 때문에 멀티태스킹을 요하는 구조에서는 안좋음 4. 선형(Linear) 콘텐츠를 순차적으로 전개 다음 단계를 진행하기 위해선 전 단계를 반드시 거쳐야 함 단계를 진행..
-
2. IA의 대표적인 5가지 시스템FrontEnd/UX_UI 2022. 2. 22. 15:26
IA란 Information Architecture의 약자이며, 번역하자면 정보 구조로 번역됩니다. 방금 언급했듯이 UI/UX 관련해서 주로 처음에 언급되는 내용이며, 이는 가장 기초적이고 기반이 되는 것이라는 의미이다. IA의 대표적인 5가지 시스템 Organiztion System Navigation System Labeling System Search System Contents Desigh 1. Organization System "모든 이해의 시작은 분류에서 출발한다. 정보를 분류하는 것 이용자별, 작업 지향 별, 기능별 상징 별, 은유형 등으로 정보를 구체적을 분류한다. '사용자가 얼마나 이해하기 쉽게 접근할 수 있는가'를 위한 가장 기초적인 작업이다. 2. Navigation System "..
-
1. 기획의 과정FrontEnd/UX_UI 2022. 2. 21. 15:21
웹 기획자(Web Planner) Director and Product Manager 웹 디자이너(Web Designer) 1. 사업기획 어떤 서비스를 만들지 구성하는 단계 아이디어 수집 시장조사 경쟁사 분석 사업계획서 제작 2. 서비스 기획 사업계획서의 전략을 바탕을 각각의 서비스를 깊게 고민하는 단계 핵심 서비스 쪼개기 서비스별 전략수집 사용자 조사 및 분석 콘텐츠 기획 3. 화면설계 서비스의 구조를 시각화 하는 단계 정보 구조(IA, Information Architecture) 설계 플로추차트(FlowChart) 작성 UI/UX 설계 4. 구축관리 개발자/디자이너와 함께 서비스를 제작하는 단계 일정관리 업무 커뮤니케이션 테스트 5. 운영/마케팅 서비스를 활성화 시키는 단계 운영목표수립 홍보/광고집..