오늘 한일
-디자인 카타
-디자인 입문 5강 및 5주차 과제
-4시 특강 참여
-디자인 입문 6강 완강
-개인 과제 진행~
내일 할일
-4시 특강 참여
-개인 과제 완성📕UXUI 디자인 입문 5강
디자인 원칙
:인지심리학 관점에서 디자인할 때 지켜야 할 규칙 규정
인지심리학
:인간이 어떻게 보고, 생각하고, 받아들이는 지를 연구하는 학문
디자인 원칙 종류
- 게슈탈트 심리학:사람이 이미지를 인식할 때 주변에 있는 요소 간의 관계와 맥락에 영향을 받는다는 이론
- UX 비주얼 디자인 원칙:UX에 영향을 끼치느 시각 디자인 원칙 정리
- UX/UI 심리학 법칙:사람이 어떻게 행동하고, 왜 그런 행동을 하는지 설명
- 기업의 디자인 원칙:기업 철학을 담고 심미성, 사용성이 높은 제품 제작 제시 가이드
게슈탈트 심리학 원리
- 유사성의 원리
:크기, 형태, 방향, 색 등 특성이 비슷한 것끼리 묶어서 지각 - 근접성의 원리
:가까운 것끼리 묶어서 지각하려는 경향 - 폐쇄성의 원리
:공백이 있더라도 틈, 간격을 메워서 닫힌 형태로 인식하려는 경향 - 연속성의 원리
:연속적으로 직선, 곡선을 이루는 요소를 잘 인지하는 경향 - 공통성의 원리
:같은 방향으로 움직이는 것들끼리 더 관련성이 높다고 인식하는 경향
UX 비주얼 디자인 원칙의 힘
-시각적으로 매력적인 이유를 근거를 들어 설명 가능
-심미적 아름다움+사용성 증가
-원칙에 따라 잘 설계된 디자인은 사용자 제품 몰입, 사용 편리
UX 비주얼 디자인 원칙 종류
- 스케일(Scale)
:상대적 크기를 사용하여 구성의 중요도, 순위 표시 - 시각적 위계
:중요한 순서에 따라 시선의 흐름이 이동하도록 디자인 - 균형
:디자인 요소 간에 적당한 배열, 비율을 주는 것 - 대비
:눈에 띄게 구별되도록 강조하기 위해 두 요소 간의 차이를 두는 것
UXUI 심리학 법칙
심리학 법칙:사람이 어떻게 행동해야 하고, 왜 그런 행동을 하는지 설명
심리학 법칙의 힘
-정량적, 정성적 데이터가 없는 초기 제품에 대한 의사결정의 근거
-명확한 이론적 근거를 바탕으로 주장 가능, 팀원들 설득 무기로 활용 가능
-스스로 좋은 디자인을 할 수 있도록 도와주는 체크리스트
-사용자의 경험을 근원적으로 이해할 수 있도록 도와줌
UXUI에 영향을 주는 심리학 법칙
- 제이콥의 법칙
:사용자는 새로운 제품 사용 시 이미 알고 있는 익숙한 제품과 같은 방식으로 작동하길 원함 - 피츠의 법칙
:터치 대상에 도달하는 시간은 대상까지의 거리, 크기, 함수 관계에 있다는 법칙 - 힉의 법칙
:의사결정에 걸리는 시간은 선택지의 개수, 복잡성에 비례해 늘어난다는 법칙 - 밀러의 법칙
:보통 사람은 작업 기억에 7(+-2)개 정도의 항목밖에 저장하지 못한다는 법칙
기업의 디자인 원칙
:기업의 철학, 심미성, 사용성 높은 제품 만들 수 있도록 제시하는 가이드
-기업과 제품의 비전 공유
-공통된 느낌을 주는 일관된 원칙 제시
-심미적 UI와 인터렉션 구현+사용성 지키는 방법 안내
-의사결정 기준이 되며 시간 절약 가능
📗UXUI 디자인 입문 6강
레퍼런스 분석
-여러가지 사례를 상세하게 분류해 생각해 보고 도움이 될 만한 부분 찾는 과정
레퍼런스 분석 방법
화면 구조 분석->디자인 원칙 기반 분석->인사이트 정리
UXUI 디자인 패턴
:디지털 제품, 앱, 웹에서 자주 사용되는 디자인 요소
-UXUI 디자인 패턴은 보편적인 범위 내에서 디자인 , 동작하는 것이 좋음(제이콥의 법칙)
자주 사용되는 UXUI 디자인 패턴
-온보딩, 로딩, 검색, 회원가입, 리스트, 카드, 캐러셀
온보딩:사용자가 제품을 처음 만나는 과정의 경험
온보딩 종류
- 튜토리얼:제품이 매우 복잡하거나 어려운 경우 조작법, 설명을 넣는 방식, 특정 기능 강조
- 가치 보여주기:제품을 사용하면서 얻을 수 있는 가치를 몇 개의 화면으로 보여주는 방식
- 개인화 설정하기:개인 맞춤 정보 제공할 수 있도록 몇 개의 카테고리, 선택지 제공하여 정보 입력하게 하는 방법
로딩
:앱, 웹에서 화면이 그려지는 동안 사용자가 잠깐 기다려야 할 때 보여주는 화면
로딩 종류
- 스피너 아이콘 혹은 애니메이션 활용
- 프로그레스 바:현재 상황을 시각적으로 파악할 수 있는 로딩 바
- 스켈레톤:불러오는 화면의 빈 버전, 화면에서 가장 먼저 노출되어 실제 페이지 예측 가능
검색:사용자가 원하는 정보를 빠르게 찾을 수 있도록 키워드로 정보를 찾는 방법
검색 화면의 종류
- 기본 검색 화면
- 연관 상품 추천/연관 검색어 노출
- Empty view, 검색 결과 없을 때
