REALITY

6-1) 레퍼런스 분석 📌 레퍼런스 분석📌· 여러가지 사례를 상세하게 분류해 생각해보고 도움이 될 만한 부분을 찾아보는 과정· 얻고 싶은 정보를 기준으로 다양한 사레 수집하고 세부 요소들로 쪼개서 살펴보기· 세부 요소들을 관찰하면서 좋은 점/나쁜 점, 그리고 그 이유를 찾고 생각해보기· 분석을 통해 얻은 인사이트 정리하기 레퍼런스 분석을 왜 하는지?레퍼런스 분석을 통해 스스로 생각하는 힘을 기를 수 있음UX/UI 디자이너는 시장과 사용자의 문제를 발견하고, 여러 고민을 통해 해결책을 제시하는 사람레퍼런스 분석하는 과정에서 디자인에 대한 영감을 얻고, 좋은 디자인을 구분하는 지식을 쌓을 수 있음 레퍼런스 분석하는 방법화면 구조 분석화면을 구성하는 요소를 나누는 방법에는 여러가지가 존재함e.g. 파운..

5-2) 디자인 원칙 📌 디자인 원칙📌· 인지심리학의 관점에서 디자인할 때 지켜야 할 규칙을 정해놓은 것· 다양한 사람들이 비슷하게 느끼고, 행동하는 방식에 기초해 디자인하는 방법을 제시함· 디자인 원칙을 기반해 디자인하면, 사람들이 편안하게 느끼고 자연스럽게 행동하도록 유도할 수 있음 + 사용성 높은 제품을 만들도록 도와줌 디자인 원칙의 종류게슈탈트 심리학UX 비주얼 디자인 원칙UX/UI 심리학 법칙기업의 디자인 원칙 게슈탈트 심리학사람이 이미지를 인식할 때 주변에 있는 요소 간의 관계와 맥락에 영향을 받는 다는 이론게슈탈트 심리학은 사용자가 제품을 경험하는 데 영향을 끼침제품을 이용하는 사용자의 의식은 계속해서 화면 구성의 통일성, 연속성, 유사성을 기대함화면이 기대한 대로 구성되어 있지 않다..

2-1) 디자인씽킹란?📌 디자인씽킹 📌· 논리적으로 제품을 만들 수 있도록 도와주는 프레임워크 중 하나로, 가장 널리 알려져 있고 많이 사용하는 방법론 · 사용자에 대한 이해를 기반으로 문제를 찾고 제품을 만들어 검증하는 프로세스 디자인씽킹의 5단계공감하기, Empathy· 인터뷰 or 관찰 등 다양한 방법으로 사용자와 공감대 맞추기· 사용자의 경험을 완전히 이해하기 위한 노력을 하는 단계문제 정의하기, Define· 공감으로 얻은 정보를 해석 ▶️ 사용자가 불편함을 느끼는 지점을 발견하는 단계아이디어 발산하기, Ideate· 다양한 아이디어 내기 ▶️ 그 중 가장 적합한 아이디어 선택하는 단계프로토타입 만들기, Prototype· 사용자가 아이디어를 경험할 수 있도록 구체적인 제품 or 서비스로 ..

1. 오늘 학습 키워드클론 디자인 2. 오늘 학습한 내용을 나만의 언어로 정리하기 네이밍 규칙의 중요성구조 파악을 돕기 위한 대명사처럼의 네이밍 필요일관된 규칙으로 정리하면 구조를 파악하는 데 도움이 됨네이밍은 단순 이름 붙이기가 아니라 사람과 시스템이 모두 이해하기 쉽게 만드는 설계의 일부 오픈라이브러리 사용하는 방법은?정답지처럼 받아들이지 말고, 이해하고 내 것으로 소화하기이점원티드 내부의 구조, 컴포넌트 만드는 방식 직접 체험 가능실무에서 사용하는 naming, spacing 등 암묵적 기준 체험표준은 아님 -> 참고 자료로 활용하기 홈화면의 역할전체 서비스 흐름을 보여주는 가장 중요한 페이지사용자에게 가장 강조하고 싶은 정보가 명확히 보이도록 설계해야 함홈 = ‘핵심 정보 요약 + 진입 경로 제..

1. 주제 선정 월별 시세 비교 그래프, 어떤 보기 방식을 선택할까? 2. 개인 의견 [동작없이 그래프보기] 선택 왜 해당 UI가 더 좋은지? 최고값과 현재값이 기본 상태에서 바로 노출되기 때문에 빠르게 핵심 정보를 파악할 수 있다. 별도의 조작 없이도 전체 흐름과 주요 데이터를 볼 수 있다. 나머지 하나는 왜 선택하지 않았는지? 작은 화면(모바일 환경)에서는 정확한 지점을 터치하기 어렵다.지점 확인을 위해 터치라는 추가 행동이 필요해서 탐색에 시간이 걸린다. 최고값은 사용자가 직접 해당 포인트를 터치해야 해서 정보 접근성이 떨어진다. 의견을 뒷받침할 수 있는 사례 토스 실시간 환율 그래프(두 방식의 장점을 모두 취한 형태) : 기본 상태에서 최고/최저 값이 항상 노출됨 + 원하는 구간을 터치하면..

1. 오늘 학습 키워드클론 디자인 2. 오늘 학습한 내용을 나만의 언어로 정리하기 오늘 진행한 디자인 카타🔽 [디자인 카타] 메시지 읽음 표시, 어떤 방식을 선호할까?1. 주제 선정 메시지 읽음 표시, 어떤 방식을 선호할까? 2. 개인 의견 [읽음 상태 표시] 선택 왜 해당 UI가 더 좋은지? 대부분 사용자에게 기본으로 익숙한 기능이다. (카카오톡(전), 라인, 네이버 밴azure326.tistory.com 개인 과제 🔽 상세 화면이랑 UI 스타일 분석은 아직 정리 중..ㅎ.ㅎ.ㅎ... 3. 학습하며 겪었던 문제점 & 에러 - 새롭게 알게 된 점 & 느낀점UI 구조를 설계하면서 아이템 → 모듈 → 섹션 순으로 정리해야 한다고 배웠지만 실제 작업할 땐 모듈부터 만들고, 그 안에서 아이템을 하나씩 뽑아 ..

1. 주제 선정 메시지 읽음 표시, 어떤 방식을 선호할까? 2. 개인 의견 [읽음 상태 표시] 선택 왜 해당 UI가 더 좋은지? 대부분 사용자에게 기본으로 익숙한 기능이다. (카카오톡(전), 라인, 네이버 밴드 등) 대화의 템포를 본인이 조절할 수 있다. 나머지 하나는 왜 선택하지 않았는지?입력 중인 행동을 실시간으로 보여주기 때문에 감시받는 듯한 부담이 생긴다. 입력 중인 상태가 상대방에게 실시간으로 노출되면 답장을 빨리 해야한다는 압박감이 생긴다. 의견을 뒷받침할 수 있는 사례 '입력중...'은 과연 좋은 UX일까?필요 이상의 정보 제공은 오히려 피로감을 불러온다 | '입력중'을 보여주는 건 과연 좋은 걸까? 어느날 넷플릭스의 '애나 만들기' 시리즈를 보던 중 한 남자의 대사가 귀에 들어왔다..

1. 오늘 학습 키워드클론 디자인 2. 오늘 학습한 내용을 나만의 언어로 정리하기 컬러Primary / Secondary 컬러 주요 버튼, 강조 텍스트, 아이콘 등에서 어떤 컬러가 반복되는지배경색 전체 배경, 카드/섹션 배경이 일관된 컬러로 분리되는지텍스트 컬러 본문 / 설명 / 비활성화 상태별로 톤이 달라지는지 (예: 진회색, 연회색 등) 타이포그래피계층 구분: 제목 > 본문 > 설명 > 캡션 식으로 구조화 되어 있는지폰트 스타일: 크기(px), 굵기(weight) 형태모서리 둥근 정도 (radius): 버튼, 카드, 이미지, 입력창 등 라운드값이 통일돼 있는지 여백/간격전체 좌우 여백: 16px / 20px / 24px 등 기본 그리드 단위 사용 여부섹션 간격: 상하 간격이 반복되는지, 리스트/카드 ..

1. 주제 UX 심리학: 타인의 눈을 의식하는 '호손 효과' UX 심리학: 타인의 눈을 의식하는 '호손효과' | 요즘IT이번 챕터에서 이야기해 볼 개념인 호손효과(Hawthorne effect)는 사용자가 자신이 관찰되고 있다는 걸 인식했을 때 행동을 바꾸는 현상을 의미한다. 이는 1920년 대에 일리노이주 호손(Hawthorne)에 있yozm.wishket.com 2. 내용 요약 호손 효과란?사람들이 관찰당하고 있다는 걸 인식할 때 행동을 바꾸는 심리적 현상이다.유사 개념으로는 감시의 눈 효과가 있다. 단순한 눈 이미지(e.g. 트럭 눈 스티커)만으로도 도덕적 행동 증가와 반사회적 행동 감소를 유도한다.일상에서의 호손 효과 사례운동 수업: 선생님이 다가올수록 자세를 더 바르게 잡는다. → 관찰자가 있..

1. 오늘 학습 키워드클론 디자인화면 구조 2. 오늘 학습한 내용을 나만의 언어로 정리하기 컴포넌트를 블록처럼 설계하면 좋은점재사용성: 같은 컴포넌트를 여러 곳에 활용 가능유지 보수 용이: 한 번의 수정으로 전체 UI에 반영 가능유연성: 추가, 삭제, 위치 변경 할 때, 레이아웃에 큰 변화없이 유연하게 적용 가능 오늘 정리한 내용 🔽 [UI 디자인의 모든 것] Ch5: UI 클론 디자인UI 클론 디자인📌 잘 만들어진 제품의 디자인을 모방하여 학습하는 과정!디자인 원칙, 컬러, 타이포그래피, 레이아웃 구성과 활용법 등을 익힐 수 있음전반적인 UI 구조 파악좋은 연습 방법인기azure326.tistory.com 실습🔽 [UI 디자인의 모든 것] Ch4: 컴포넌트 만들기버튼 컴포넌트버튼 컴포넌트(l..