디자인사전 | 디자인베이스

A/B 테스트 (A/B Testing)

A/B 테스트는 두 가지 버전의 웹 페이지 또는 앱 디자인을 비교하여 어떤 버전이 사용자에게 더 나은 결과를 제공하는지를 확인하는 실험적인 방법입니다. 이를 통해 디자인, 콘텐츠, 레이아웃, 기능 등의 요소를 수정하고 최적화하여 사용자…

Alt 속성 (Alt Attribute)

Alt 속성, 또는 대체 텍스트(Alternative Text)는 HTML에서 이미지 태그(<img>)에 사용되는 속성입니다. 이 속성은 이미지를 표시할 수 없거나, 이미지를 인식할 수 없는 사용자를 위한 텍스트 정보를 제공합니다. Alt 속성은 웹 접근성이 중요한 부분…

App Bar

App Bar는 안드로이드 앱에서 사용자 인터페이스의 중요한 요소로, 화면 상단에 위치하며 사용자에게 앱 이름, 네비게이션, 액션 등을 표시한다. 이는 사용자에게 현재 어떤 화면에 위치해 있는지를 명확하게 보여주고, 사용자가 앱 내에서 쉽게 이동하거나…

CRUD

CRUD는 컴퓨터 프로그래밍에서 데이터의 기본적인 네 가지 함수를 가리킵니다: 생성(Create), 읽기(Read), 업데이트(Update), 삭제(Delete). 이러한 함수들은 대부분의 시스템에서 데이터와 상호작용하는 기본적인 방법을 제공합니다. 프로그래핑 개념이지만, UXUI 디자이너로서 웹 혹은 앱 애플리케이션 디자인시 CRUD…

CTA(Call To Action)

CTA는 '호출 행동'을 의미하며, 웹사이트나 앱, 광고 등에서 사용자에게 특정 행동을 취하도록 유도하는 설계 기술입니다. CTA는 보통 버튼 또는 링크의 형태를 띠며, "구매하기", "더 알아보기", "가입하기"와 같은 강력한 동사를 사용하여 사용자의 의사결정을…

CTR (Click-Through Rate)

CTR 또는 클릭률은 디지털 마케팅에서 광고의 효과를 측정하는 데 사용되는 지표 중 하나입니다. 이는 광고를 본 사람들 중 실제로 그 광고를 클릭하여 해당 웹사이트나 제품에 방문한 사람들의 비율을 의미합니다. CTR은 아래의 공식으로…

dp (Density Independent Pixel)

DP (Density Independent Pixel)는 안드로이드에서 사용하는 단위로, 디스플레이의 밀도와 관련된 독립적인 픽셀 단위이다. 화면의 크기와 비율에 관계없이 일관된 크기로 보이도록 해주며, 다양한 디스플레이 밀도를 가진 디바이스에서도 같은 크기의 UI를 보여줄 수 있다.…

dpi, ppi

이미지의 해상도를 표현하는 단위. PPI PPI는 Pixels Per Inch로 1인치당 얼마나 많은 픽셀이 들어가느냐로 PC, Mobile 등 다양한 디지털 스크린에 대한 단위. DPI DPI는 Dots Per Inch로 1인치당 얼마나 많은 점으로 표현되는지로…

F-패턴 (F-Pattern)과 Z-패턴 (Z-Pattern)

F-패턴이란? F-패턴은 웹페이지의 내용을 읽는 데 사용자들이 가장 자주 따르는 눈의 움직임 패턴입니다. 이는 사용자가 페이지의 왼쪽 상단부터 읽기 시작하여 수평으로 이동한 후, 다시 아래로 이동하여 새로운 정보를 찾는 방식을 따릅니다. F-패턴…

FAB(Floating Action Button)

FAB 이란, 플로팅 액션 버튼의 줄임말로, UI 내에 특정 위치에 고정되어 떠있는 요소로 사용자에게 중요한 행동을 언제든지 클릭할 수 있도록 제공함. 주로 안드로이드에서 볼 수 있는 유형으로 리스트 내에서 액션을 유도하는 버튼임.…

pt (Point)

PT (Point)는 디자인에서 자주 사용되는 단위로, 이는 일반적으로 화면의 물리적 크기에 의존하는 것으로 알려져 있다. 이 단위는 주로 애플의 iOS에서 사용되며, 1pt는 물리적으로 약 1/72 인치를 의미한다. 이 단위는 디바이스의 화면 크기와…

sp (Scale-independent Pixels)

SP (Scale-independent Pixels)는 텍스트 크기를 결정하는데 주로 사용되는 단위로, 안드로이드 환경에서 많이 사용된다. SP는 DP와 매우 유사하지만, 추가적으로 사용자의 글꼴 크기 설정에 따라 크기가 조절되는 특징을 가지고 있다. 안드로이드에서는 디바이스의 화면 크기와…

가시화 (Visualization)

가시화는 데이터나 정보를 이미지나 그래프 등의 시각적 형태로 표현하는 과정이나 결과입니다. 이는 복잡한 데이터를 이해하기 쉽게 만들며, 패턴, 트렌드 및 인사이트를 식별하는 데 도움을 줍니다. 예시 UX/UI 디자이너는 사용자가 정보를 쉽게 이해하고…

개념 증명 (Proof of Concept, POC)

개념 증명(POC)은 Proof of Concept의 약자로, 신규 개발 제품, 서비스, 솔루션 등의 이론이나 아이디어가 실제로 실행 가능한 것을 보여주기 위한 시험, 테스트 또는 실험을 의미합니다. 그래서 어떤 아이디어나 기술이 실제로 실행 가능하고,…

게슈탈트 이론(Gestalt Theory)

게슈탈트 이론은 인식과 인식 심리학에 관한 이론으로, 전체가 부분의 합보다 더 큰 의미를 갖는다는 개념을 강조합니다. 이 이론은 UX/UI 디자인 분야에서 중요한 원리로 활용되며, 사용자의 인식과 인지를 이해하고 설계에 적용하는 데 도움이…

구분선(Divider)

구분선은 UI 요소들 사이에 가시적인 경계를 만들어, 컨텐츠를 명확하게 구분하는데 사용된다. 이는 사용자가 인터페이스를 이해하는 데 도움을 주며, 정보의 그룹화를 촉진한다. 사용 예시 구분선은 메뉴 항목, 리스트 항목, 섹션 등, 서로 다른…

그리드시스템(Grid System)

그리드 시스템은 레이아웃을 잡기 위한 가이드로 콘텐츠 폭, 컬럼, 거터, 마진 4가지 요소로 구성됨.다양한 해상도와 비율의 디바이스에 최적화된 레이아웃을 구현하기 위해서는 그리드 시스템은 필수다. Desktop, Laptop에서는 12단을 추천하며, Tablet은 6단, Mobile은 4단을…

넛지(NUDGE)

넛지(NUDGE)는 사용자의 행동을 유도하거나 관찰된 동작에 대한 간접적인 힌트를 제공하여 사용자 경험을 개선하는 기술적인 개념입니다. UX/UI 디자이너는 넛지를 활용하여 사용자의 행동을 유도하고 원하는 방향으로 인터랙션을 유도할 수 있습니다. "어떤 행동을 하도록 부추기며…

네비게이션(Navigation)

유저가 웹 혹은 앱 서비스 내에서 특정 페이지로 이동하는 탐색 유형을 말함. 웹에서는 주로 헤더, 사이드바에 네비게이션을 제공하며 앱에서는 주로 App bar Top이나 Bottom Navigation Bar에 해당 기능을 제공함. 웹과 앱은 환경이…

네비게이션바(Navigation Bar)

네비게이션바는 웹사이트 또는 앱에서 주로 상단에 위치하는 인터페이스 요소로, 페이지 간의 이동이나 메뉴 항목에 접근하는데 사용된다. 이는 사용자가 앱의 구조를 이해하고, 주요 기능에 빠르게 접근할 수 있도록 돕는다. 사용 예시 네비게이션바는 웹사이트의…

네이티브 앱 (Native App)

네이티브 앱은 특정 운영 체제에서 실행되도록 그 체제의 고유 프로그래밍 언어로 작성된 애플리케이션입니다. 예를 들어, Android 운영 체제의 경우 Java 또는 Kotlin, iOS의 경우 Objective-C 또는 Swift로 개발됩니다.그로 인해, 각 OS마다 제공하는…

다이어로그(Dialogs)

다이어로그는 사용자의 주의를 요구하거나 선택을 하도록 유도하는 UI 컴포넌트이다. 이는 앱의 주요 콘텐츠 위에 나타나며, 사용자가 선택사항을 확인하거나 특정 작업을 완료하기 전에 추가 정보를 제공한다. 사용 예시 다이어로그는 사용자가 앱에서 민감한 작업을…

다크 모드(Dark Mode)

다크 모드는 사용자 인터페이스의 색상 스키마를 어둡게 바꾸는 기능을 의미한다. 밝은 텍스트가 어두운 배경에 표시되며, 이는 야간 사용이나 어두운 환경에서의 가독성을 높이고 눈의 피로를 줄여준다하여 사용되었다. 하지만, 특정 연구에 의하면 다크모드를 사용시…

다크 패턴 (Dark Patterns)

다크 패턴은 사용자 인터페이스 디자인에서 사용자를 의도적으로 혼란스럽게 하거나 오해하도록 만들어, 사용자가 원하지 않는 행동을 하도록 유도하는 유해한 디자인 전략을 말합니다. 이는 일반적으로 비윤리적으로 간주되며, 사용자 경험에 부정적인 영향을 미칩니다. 다크 패턴은…

더블 다이아몬드 프로세스 (Double Diamond process)

더블 다이아몬드는 디자인 프로세스를 구조화한 방법론으로, 영국 디자인 위원회(British Design Council)가 제안한 디자인 생각 프로세스 모델입니다. 문제를 정의하고 해결하는 네 단계를 두 개의 다이아몬드 모양으로 표현한 것이 특징입니다. 이 모델의 기본 원칙은…

데이터 포맷(Data formats)

데이터 형식은 다양한 유형의 숫자 및 언어 데이터를 나타냄. UI 내 시간, 요일, 날짜(Month, day, and year) 등 상황에 맞게 UI에 표기해야 함.타임 존이란 지역마다 시간대가 다르므로 구체적인 표기가 필요함. 예) UTC+5:00…

데이트 피커(Date Pickers)

데이트 피커는 사용자가 날짜를 선택하도록 돕는 사용자 인터페이스 요소다. 이를 통해 사용자는 달력 형태의 UI를 통해 특정 날짜를 쉽게 선택할 수 있다. 사용 예시 데이트 피커는 예약 시스템, 이벤트 생성, 생일 입력…

도허티의 임계(Doherty Threshold)

도허티의 임계는 사용자와 컴퓨터 간의 인터랙션 시 가장 적절한 시간 범위를 나타내는 개념입니다. 이 임계는 사용자 경험 디자인과 인터페이스 디자인 관점에서 중요한 원리로 적용됩니다. "사용자의 주의가 분산되는 것을 막고 생산성을 높이려면 시스템의…

드롭다운(Drop-down)

드롭다운은 사용자가 선택할 수 있는 여러 옵션들을 목록 형태로 표시하는 UI 컴포넌트다. 사용자가 드롭다운 메뉴를 클릭하면, 이용 가능한 옵션들이 목록으로 펼쳐진다.Android에서는 Menus라고 불린다. 사용 예시 드롭다운은 폼에서 사용자에게 여러 선택지 중 하나를…

디자인 윤리 (Design Ethics)

디자인 윤리는 디자인 프로세스와 그 결과물이 사회와 개인에 미치는 영향에 대한 가치 판단을 포함합니다. 디자이너는 단순히 보기 좋고 기능적인 제품을 만드는 것뿐만 아니라, 그 제품이 사람들과 그들의 생활에 어떤 영향을 미칠지 고려해야…

딥링크 (Deep Linking)

딥링크는 앱이나 웹사이트의 특정 페이지 또는 위치를 직접 연결해주는 URL입니다. 기본적인 링크는 웹사이트의 홈페이지를 연결해주지만, 딥링크는 그 이상으로 들어가 사용자가 바로 특정 내용이나 페이지에 접근할 수 있도록 합니다. 웹에서 앱으로 이동시키는 기술로…

라디오 버튼(Radio Button)

라디오 버튼(Radio Button)은 웹 개발에서 사용되는 입력 요소 중 하나로, 사용자가 여러 옵션 중 하나만 선택할 수 있는 버튼을 의미합니다. 라디오 버튼은 주로 선택지가 여러 개 있을 때, 사용자가 단 하나의 옵션만…

랜딩 페이지 (Landing Page)

랜딩 페이지는 특정 목표를 달성하기 위해 설계된 웹페이지입니다. 이는 일반적으로 디지털 광고 캠페인을 통해 사용자들이 '착륙'하는 곳입니다. 목표는 보통 구매, 등록, 문의, 다운로드 등과 같은 사용자 행동을 유도하는 것입니다. 예시 UX/UI 디자이너는…

런처 아이콘(launcher icon)

런처 아이콘은 애플리케이션의 시작화면을 의미하며 앱을 실행할 때 가장 먼저 보는 앱 아이콘이다. 런처 아이콘은 앱의 브랜드 아이덴티티를 대표하여 사용자에게 좋은 인상을 주어야 한다. 앱 아이콘, 폴더 아이콘 등 OS에서 제공하는 기본…

레거시 (Legacy)

레거시는 기술, 시스템, 소프트웨어 등이 오래되어 새로운 버전이나 표준에 대체되어야 하지만 여전히 사용되고 있는 상태를 의미합니다. 레거시 시스템은 종종 업데이트가 어렵고, 유지 관리가 비용이 많이 들며, 새로운 기술과의 호환성 문제를 가질 수…

디자인 용어 사전