haleys-archive
🧠 101가지 UIUX 심리학
💡디자이너로 살기
Figma 실무 꿀팁
디자인 기본 지식
📝 디자인 자료
피그마 폰트 프리뷰
피그마 플러그인 모음
디자인 리소스
Share
Sign In
Home
Haley's archive | UIUX 디자인 스터디
관심사가 너무 많아서 필터링이 필요해요
Figma News 👀
Design News 📰
🧠 101가지 UIUX 심리학
📚 UIUX 디자인에 도움 될 심리학 공부
스트라이샌드 효과(Streisand effect)
간결의 법칙 (Law of Prägnanz)
고정편향 (Anchoring Bias)
피드포워드 (Feedforward)
유사성의 법칙 (Law of Similarity)
가용성 휴리스틱(Availability Heuristic)
특이성효과 (The Singularity Effect)
아하! 모먼트 (Aha! Moment)
스포트라이트 효과(Spotlight Effect)
프레이밍(Framing)
미끼효과 (Decoy Effect)
힉의 법칙 (Hick's Law)
몰입상태 (Flow State)
보답 기대 효과(Reciprocity)
변동성 보상 (Variable Reward)
오컴의 면도날 (Occam's Razor)
인지적 불일치 (Cognitive Dissonance)
베버-페히너의 법칙(Weber-Fechner's law)
유혹 번들링(Temptation Bundling)
지식의 저주(Curse of Knowledge)
목표 그라데이션 효과(Goal Gradient Effect)
디드로 효과(Diderot effect)
파노플리 효과(Phenomenon of Panoply)
피크엔드 법칙 (Peak-End Rule)
선택적 주의(Selective Attention)
시각적 계층 (Visual Hierarchy) 효과
인식 우선 원칙(Recognition Over Recall)
상반된 위치 효과 (Juxtaposition)
무현금 효과 (Cashless Effect)
미적-실용성 효과
이케아 효과 (IKEA Effect)
시간 인식 (Chronoception)
스큐어모피즘(Skeuomorphism)
파레토의 원칙(Pareto principle)
시각적 안내 요소(Visual Anchors)
폰 레스토프 효과(Von Restorff Effect)
의사 집합 프레이밍(Pseudo-Set Framing)
그룹 매력 효과(Group Attractiveness Effect)
제이가르닉 효과(Zeigarnik Effect)
간격 효과 (Spacing Effect)
일련 위치 효과(Serial Position Effect)
대비 효과(Contrast Effect)
초월 할인 (Hyperbolic Discounting)
내부 트리거(Internal Trigger)
자체 트리거(Self-Initiated Triggers)
피츠의 법칙(Fitts's Law)
새 출발 효과(Fresh Start Effect)
노력 인식 효과(Labor Illusion)
투자 환원(Investment Loops)
손실 회피 (Loss Aversion)
넛지(Nudge)
테슬러의 법칙 (Tesler's Law)
지시자 효과 (Signifiers)
외부 트리거 효과 (External Trigger Effect)
배너 무시 현상 (Banner Blindness)
공감 간격 효과 (Empathy Gap)
점진적 노출(Progressive Exposure)
중앙 무대 효과 (Centre-Stage Effect)
스파크 효과 (Spark Effect)
사회적 증거 효과(Social Proof)
호기심의 틈 (Curiosity Gap)
피드백 루프 (Feedback Loop)
후광효과 (Halo Effect)
멘탈 모델 (Mental Model)
결핍 효과 (Scarcity Effect)
사회적 책임 효과 (Noble Edge Effect)
밀러의 법칙 (Miller's Law)
약속과 일관성 (Commitment & Consistency)
투자 손실 효과 (Sunk Cost Effect)
결정 피로 (Decision Fatigue)
반발감 효과 (Reactance)
생존 편향 (Survivorship Bias)
주의 편향 (Attentional Bias)
확증 편향 (Confirmation Bias)
기대 편향 (Expectations Bias)
인식 과부하(Cognitive Load)
프라이밍 (Priming)
가까움의 법칙 (Law of Proximity)
부정 편향 (Negativity Bias)
단위 편향 (Unit Bias)
권위 편향(Authority Bias)
반발 효과(Backfire Effect)
거짓 공감 효과 (False Consensus Effect)
2차 효과(Second-Order Effect)
탈출 경로 제공(Provide Exit Points)의 필요성
설문 편향(Survey Bias)
호손 효과(Hawthorne Effect)
사후 확신 편향 (Hindsight Bias)
기본 편향
관찰자 기대 효과 (Observer-Expectancy Effect)
밴드웨건 효과(Bandwagon Effect)
바넘효과(Barnum-Forer Effect)
도구의 법칙(Law of the Instrument)
파킨슨의 법칙(Parkinson's Law)
감정 휴리스틱 (Affect Heuristic)
자기 고양적 편향(Self-serving Bias)
소유 효과 (Endowment Effect)
💡디자이너로 살기
Figma 실무 꿀팁
디자인 기본 지식
📝 디자인 자료
피그마 폰트 프리뷰
피그마 플러그인 모음
디자인 리소스
인식 과부하(Cognitive Load)
정의
특정 작업을 완료하는 데 필요한 정신적 노력의 총량
설명
우리의 작동 기억엔 처리할 수 있는 정보의 양에 제한이 있으며, 이 제한을 초과하는 정보 처리 과정에서 인식 과부하가 발생한다
학습 및 기억력 저하 : 정보 처리에 어려움을 겪으면 학습 효과가 떨어지고 기억력이 저하됨
주의력 산만 : 인식 과부하를 느끼면 주의력을 집중하기 어려워지고 주변 환경에 대한 인지도 저하될 수 있음
판단력 저하 : 정보를 정확하게 처리하고 분석하지 못하면 오판이나 오류를 저지를 가능성이 높아짐
스트레스 증가 : 인식 과부하는 정신적 부담을 증가시키고 스트레스를 유발할 수 있음
원인
1.
정보의 양과 복잡성 : 한 화면에 표시되는 정보의 양이 너무 많거나, 너무 복잡하고 이해하기 어려운 경우
웹사이트 메뉴가 너무 많거나 각 메뉴에 포함된 정보가 너무 복잡하면 어디서부터 시작해야할지 막막할 수 있다. 특히, 모바일 기기와 같은 작은 화면에서 많은 정보를 표시하면 사용자가 정보를 찾거나 이해하는 데 더 많은 어려움을 겪을 수 있다
2.
정보 구조 및 조직화 : 정보가 명확하고 논리적으로 구성되지 않은 경우
혼란스러운 구조, 중요한 정보가 눈에 띄지 않는 경우엔 사용자가 원하는 기능을 찾는데 시간을 낭비하거나 잘못된 정보를 이해하게 될 수 있다.
사용자 예상과 다른 방식으로 정보를 구성한 경우에는 더 많은 인지적 노력을 기울여 정보를 이해해야 한다
3.
시각적 요소 : 너무 어지러운 시각적 효과
과한 색상, 이미지, 애니메이션, 명확하지 않은 글꼴, 텍스트 크기를 사용하는 경우 사용자는 정보처리에 어려움을 겪는다. 특히, 시각적 요소들이 자기들끼리 경쟁하거나 조화롭지 않은 경우 사용자 주의를 분산시키고 인식 과부하를 일으킨다
4.
상호작용 : 안하느니만 못한 상호작용 효과..
사용자 입력에 대한 반응 속도가 느리거나 예상치 못한 방식으로 상호 작용이 이루어지는 경우 사용자는 혼란스러움을 느끼고 인식 과부하를 느낄 수 있다.
로딩속도가 느리거나, 버튼 클릭시 예상하지 못한 페이지로 이동해버린다거나 하는 경우에는 이전 작업이 중단되거나 원하는 정보를 찾는것에 실패할 수 있다
결론UIUX 디자인에 활용하기
1.
정보의 양과 복잡성 감소
한 화면에 표시되는 정보의 양 최소화, 단순하고 이해하기 쉬운 구성
중요한 정보는 눈에 잘띄게 강조, 보조적인 정보는 최소화
모바일 기기와 같은 작은 화면은 더 신중한 정보 구성, 필수적인 정보만 표시하는게 좋다
2.
정보구조 및 조직화 개선
명확하고 논리적인 정보 구성으로 사용자의 이해를 돕는다
정보 구조가 사용자 예상과 일관되게 만들고 중요한 정보는 쉽게 찾을 수 있는 위치에 둔다
정보 분류 시스템을 활용해 사용자가 원하는 정보를 빠르게 찾도록 돕는다
3.
시각적 요소 최적화
명확하고 읽기 쉬운 글꼴, 텍스트 크기, 조화로운 색상, 적절한 명암
이미지와 애니메이션은 정보 전달에 도움이 되는 방식으로 사용해야 하고 과도하게 사용하지 않는다
빈 공간을 적절하게 활용해 정보를 명확하게 구분하고 시각적 혼란을 줄여야 한다
4.
상호 작용 개선
사용자 입력에 대한 반응 속도를 빠르게 유지하고, 예상 가능한 방식으로 상호 작용이 이루어져야한다
사용자 의도 파악 및 필요한 정보만 요구해야한다
명확한 피드백을 적절한 타이밍에 제공하여 사용자가 현재 상황을 인지하고 다음 단계를 수행할 수 있도록 도와야 한다
이 밖에도 사용자 테스트 및 반복적 개선, 접근성과 다양한 사용자 그룹을 고려하는 등의 방법이 있다
Made with SlashPage