디자인 용어사전

칩(Chips)

칩(Chips)은 사용자가 입력하거나 선택한 항목을 작고 간결한 형태로 표시하는 UI 요소입니다. 이는 버튼, 태그, 필터, 입력값 등의 역할을 하며, 사용자의 인터랙션을 단순화하고 화면을 보다 직관적으로 구성하는 데 유용합니다.…

카드(Cards)

카드는 정보를 시각적으로 그룹화하고 정리하는 컨테이너 요소로, 웹사이트나 애플리케이션에서 다양한 콘텐츠를 표시하는 데 사용됩니다. 일반적으로 이미지, 텍스트, 아이콘, 버튼 등 다양한 UI 요소를 포함하며, 독립적인 정보 블록을 표현하는…

캐로셀 (Carousel)

캐로셀(Carousel)은 여러 개의 콘텐츠를 한 영역에서 슬라이드 형태로 순환하며 보여주는 UI 패턴입니다.이름에서 알 수 있듯이 회전목마처럼 콘텐츠가 일정한 방향으로 반복적으로 이동하며, 사용자는 수동 또는 자동으로 콘텐츠를 탐색할 수…

컬러 시스템(Color System)

컬러 시스템은 브랜드의 아이덴티티를 반영하고 UI의 일관성을 유지하기 위해 조직적으로 정의된 색상 테마를 의미합니다. 이는 사용자의 시각적 경험을 향상시키고, 인터페이스 내에서 정보의 우선순위를 명확하게 전달하는 중요한 디자인 요소입니다.컬러…

타이포그래피(Typography)

타이포그래피(Typography)는 단순히 글꼴(폰트)만을 의미하는 것이 아니라, 글자의 크기, 두께, 자간(글자 간격), 행간(줄 간격) 등을 조절하여 정보의 위계를 시각적으로 표현하는 디자인 개념입니다.UI/UX 디자인에서는 텍스트를 통해 사용자 경험을 향상시키기 위해…

테이블(Table)

테이블(Table)은 정보를 구조적으로 정리하여 행(Row)과 열(Column) 형태로 배치하는 UI 요소입니다. 데이터 테이블(Data Table)이라고도 하며, 정렬(Sorting), 필터링(Filtering), 비교(Comparison), 그룹화(Grouping) 등의 기능을 제공하여 정보를 직관적으로 이해할 수 있도록 돕습니다. 특히,…

텍스트필드(Text field)

텍스트 필드는 사용자가 텍스트를 입력할 수 있는 UI 컴포넌트입니다. 이는 웹사이트와 애플리케이션에서 사용자와 시스템 간의 상호작용을 원활하게 만들어 주며, 폼을 통해 정보를 수집하거나 검색 쿼리를 입력받는 등의 상황에서…

트랜지션(Transition)

트랜지션(Transition)은 웹사이트나 애플리케이션에서 페이지 간 이동 또는 UI 요소의 상태 변화를 부드럽게 연결하는 애니메이션 효과를 의미합니다. 이를 통해 사용자는 화면 전환이 자연스럽게 이루어짐을 인식하고, 인터페이스의 구조적 연계성을 쉽게…

페이지네이션(Pagination)

페이지네이션은 대량의 정보를 여러 페이지로 나누어 표시하는 UI 패턴입니다. 사용자가 한 번에 많은 데이터를 보지 않고, 필요한 정보를 특정 페이지에서 쉽게 찾을 수 있도록 도와줍니다. 웹사이트에서 검색 결과,…

푸터(Footer)

푸터는 웹사이트나 애플리케이션의 하단 영역에 위치하는 UI 요소입니다. 사이트 내 다양한 정보를 제공하며, 사용자가 원하는 정보를 쉽게 찾을 수 있도록 도와줍니다. 브랜드 아이덴티티를 강화하고, 법적 필수 사항을 안내하며,…

프로그래스바 (Progress Bar)

프로그래스바는 작업의 진행 상황을 시각적으로 표시하는 UI 요소입니다. 사용자가 작업이 완료되기까지의 예상 시간을 파악할 수 있도록 돕고, 기다리는 동안 애플리케이션이 정상적으로 작동 중임을 알려줍니다. 이는 사용자 경험을 향상시키는…

해상도

해상도는 디지털 디스플레이나 이미지에서 표현되는 화질의 정밀도를 나타내는 개념입니다. 일반적으로 가로와 세로 픽셀 수의 조합으로 표현되며, 해상도가 높을수록 화면이 더 선명하게 보입니다. 하지만, 해상도가 높아질수록 데이터의 크기와 성능…