"그거 있잖아, 오른쪽 아래 둥근 버튼..."
AI가 찰떡같이 알아듣는 실전 UI/UX 용어

화면 상단이나 하단에 잠깐 떴다가 몇 초 뒤 자동으로 사라지는 가벼운 알림입니다. 사용자가 하던 작업을 방해하지 않고(비간섭형) 저장 성공, 오류 등을 알릴 때 씁니다.

화면 중앙에 뜨면서 뒤쪽 배경이 어둡게 블러 처리(Backdrop)되는 창입니다. 로그인, 중요한 삭제 확인, 설정 등 사용자의 즉각적인 결정이 필요할 때 씁니다.

모바일 화면 아래쪽에서 스르륵 위로 밀려 올라오는 서랍형 창입니다. 모바일 환경에서 한 손 엄지손가락으로 조작하기 쉬워 모바일 앱의 90% 이상이 모달 대신 채택합니다.

화면의 왼쪽이나 오른쪽 가장자리에서 서랍처럼 슬라이딩되어 튀어나오는 메뉴 창입니다. 메뉴 항목이 많거나 카테고리 전체를 탐색할 때 사용합니다.

마우스를 올리거나 터치했을 때 작은 말풍선 형태로 보조 설명을 띄워주는 미니 안내 창입니다. 아이콘 버튼의 기능을 설명할 때 필수입니다.

버튼을 누르면 목록이 아래로 착 펼쳐지면서 하나를 선택할 수 있게 해주는 컴포넌트입니다. 정렬 방식(최신순, 인기순)이나 프로젝트 선택 등에 씁니다.

스크롤을 아무리 내려도 화면 우측 하단(또는 좌측)에 항상 둥둥 떠서 고정되어 있는 대표 버튼입니다. 1:1 문의, 맨 위로 가기(Top), 글쓰기(+)에 최적입니다.

모바일 웹/앱의 화면 최하단에 항상 붙어 있는 가로형 퀵 내비게이션 바입니다. 홈, 검색, 프로필 등 핵심 화면을 원터치로 오갈 수 있습니다.

가로 세 줄(≡) 모양의 아이콘으로, 공간이 좁은 모바일 화면에서 숨겨진 전체 메뉴를 펼치기 위해 누르는 토글 버튼입니다.

스크롤을 아래로 쑥 내려도 화면 상단(또는 하단)에 딱 달라붙어서 계속 따라다니는 고정 영역입니다. 로고, 핵심 메뉴, 저장 버튼 등을 상시 노출할 때 씁니다.

데이터를 불러오는 동안 빈 화면이나 딱딱한 글자 대신, 콘텐츠 형태의 은은한 회색 뼈대가 번쩍이며(Shimmer) 로딩 중임을 체감시키는 최고급 기법입니다. (유튜브, 페이스북 표준)

동그란 원형 테두리가 빙글빙글 회전하며 백그라운드에서 작업이 열심히 진행되고 있음을 알리는 가장 대중적인 로딩 인디케이터입니다.

아이콘 모서리에 붙는 빨간 점이나 숫자(미확인 알림 개수)를 배지(Badge)라 부르고, 카테고리를 눌러 선택할 수 있는 알약 형태의 버튼을 칩(Chip)이라 부릅니다.

파일 업로드, 쿼터 사용량, 시험 문제 풀이 진행률(예: 3/5 완료) 등을 가로 막대 그래프 게이지로 채워나가는 직관적 표시기입니다.

마치 투명한 젖은 유리판을 얹어놓은 것처럼 뒤쪽 배경이 뽀얗게 비치는(Blur) 디자인 기법입니다. 애플 iOS, 맥OS, 사이버펑크 UI의 핵심 트렌드입니다.

악기 아코디언처럼 제목을 클릭하면 아래로 내용이 스르륵 펼쳐지고 다시 누르면 접히는 컴포넌트입니다. 자주 묻는 질문(FAQ)이나 긴 문서를 깔끔하게 정리할 때 필수입니다.