brunch

You can make anything
by writing

C.S.Lewis

by 제이미 Jan 15. 2024

알아두면 좋은 UI/UX 용어 모음집

모달 팝업 차이, 메뉴 아이콘 유형별 이름 등

알아두면 좋은 UI/UX 용어 모음집

기록하는 기획자 writing.pm


-

오랜만에 돌아온 UI/UX 용어 모음집!

앱에서 자주 사용했던 아이콘인데, 이름이 헷갈렸다면

UI/UX 모음집 읽어보시면 많은 도움이 될 거에요!

1. 메뉴 유형별 아이콘 이름

: 앱서비스를 이용하다 보면 자주 보게되는 다양한 메뉴 아이콘들의 이름, 알고 계신가요?

메뉴 아이콘의 유형별 이름 모두 모아왔습니다!


흔히 볼 수 있는 메뉴 유형은 햄버거 / 케밥 / 캔디박스 / 초콜렛 / 스트로베리 정도가 있겠네요!

특히 초콜렛 메뉴의 경우 일반적으로 '벤또'메뉴라고 불리기 때문에 함께 알아두시는 걸 추천합니다.

2. Pagination (페이지네이션)

: 다수의 컨텐츠를 여러 페이지로 나누고,

페이지 번호 / 이전 / 다음 버튼을 클릭해 페이지를 이동하는 기능으로

페이지 당 보여줄 콘텐츠 개수, 페이지를 이동하는 방법 등을 결정하게 됩니다.


3. Chips (칩)

: 간단한 아이콘과 텍스트로 구성된 UI 요소입니다.

주로 여러개의 칩이 한 세트처럼 활용되며, 정보 입력&선택, 콘텐츠 필터링 등에 사용됩니다.


V 버튼과 혼용되지 않도록 주의해야 해요!

4. Toast & Snack Bar

: 일반적으로 특정 작업 실행 시 일시적으로 노출되며,

일정 시간이 지난 후 사라지는 메시지입니다.

주로 작업에 영향이 없는 안내사항을 노출하기 위해 사용하지만

일부 서비스에서는 '오류'에 대한 알럿을 토스트로 보여주기도 합니다!


V 비슷한 UI 구성의 “스택바"는 토스트에 ‘액션’ 등의 추가 기능이 포함된 메시지입니다.



5. Pop-up (팝업)

: 새로운 웹 브라우저를 하나 더 추가해 광고, 알림, 주요 공지사항 등을 노출하는 영역입니다.


V 최근에는 새 창을 띄우지 않는 ‘모달창'을 더 많이 활용하는 추세에요.



6. Modal (모달)

: 팝업창과는 달리 같은 브라우저 내부에서 상위 레이어를 띄우는 방식을 활용하는 창이에요.

모달을 종료하지 않으면, 원래 서비스 화면을 이용할 수 없는 것이 특징입니다.

(팝업은 새로운 브라우저를 띄우기 때문에 원래 서비스 화면도 이용할 수 있어요.)


-


V 글을 재밌게 읽으셨다면 '라이킷'과 '구독' 부탁드려요.

V 인스타그램 팔로우 부탁드려요! 앞으로 더욱 흥미로운 컨텐츠를 올릴 예정입니다.

https://www.instagram.com/writing.pm/


브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari