오늘의 아티클 선정 : 김혜빈
출처 : https://brunch.co.kr/@tigrisdesign/2
1) UI 용어 정리 💭
2) 오늘의 아티클을 읽어보니__💭
3) 기억에 남는 1등 용어 💭
💌
GNB : 웹사이트 최상의 메뉴
LMB : GNB 메뉴를 클릭 or 마우스 올린 상태일 때 서브 페이지
SNB : 왼쪽에 붙은 메뉴바
FNB, Footer : 최하단 메뉴 (로그, 주소, 전체 메뉴 등)
Tab Menu : 병렬형 콘텐츠 / 탭으로 다른 카테고리 전환
FAB : 자주 사용되는 동작 버튼
Splash Screen : 앱의 시작 화면 / 로고나 성격이 보이는 콘텐츠
Hambueger : 상단에 위치한 버튼 / 전체 메뉴를 한 눈에 볼 수 있음
Drawer : 평상시에 닫혀있고 클릭하면 열리는 버튼 / 앱의 상단 위치
Accodian : 내용을 펼쳤다 접을 수 있으며 리스트 형식 표현에 효과적
💌
Buttom States
1) 디폴트 - 사용자가 터치하기 전 상태
2) 호버 - 사용자가 버튼 위 마우스를 올렸을 때
3) 포커스 - 버튼이 강조된 상태
4) 프레스드 - 버튼을 눌렀을 때 상태
5) 비활성화 - 버튼을 누를 수 없는 상태
6) 프로그래스 - 클릭 시 진행 중인 상태 / 로딩 중~
💌
Label : 입력할 정보에 대해 설명해 주는 문구
Text Field : 텍스트 입력 혹은 수정하는 필드 (아이디, 비번, 검색 등)
Place Holder : 어떠한 것을 입력해야 하는지 힌트 문구 (자리를 지킨다)
Text Area : 긴 문장을 적어야할 때 사용 (자기소개)
Place Holder Images : 사용자가 이미지를 첨부하는 곳 (프로필)
💌
Check Box : 중복 선택이 가능한 체크박스
Radio BTN : 중복 선택 불가 / 실제 라디오는 하나를 누르면 하나가 꺼진다
Toggle : 활성화, 비활성화 2가지 상태 / 허용 비허용
Slider : 수치 값, 카테고리 배율을 지정할 수 있음 / (구매희망 가격대)
💌
Select Box : 리스트 중에 어떠한 값을 골라야할 때 (전공, 직업 등)
Drop Down : 버튼 뒤 숨겨진 메뉴 (역삼각형 표시)
Progress Bar : 작업의 진행상태 표시 (테무에서 쌓인 포인트, 나의 달성 게이지)
Loader : 화면이 진행 중일 때 상태 (버퍼링, 로딩, 다음 화면)
💌
Tooltips : 레이블, 아이콘 등에 간단한 설명 텍스트 (부가 설명)
Carousel : 한 번에 두 개 이상의 콘텐츠를 보여줄 때 방식
Navigation : 앱의 하단에 위치한 UI / (홈, 카톡, 설정 등)
💌
Breadcrumbs : 현재 내가 속해있는 페이지, 위치
Pagination : 콘텐츠가 많은 경우 페이지네이션 <1 2 3 4 5>
🎶UI 용어들을 읽어보며 : UXUI에 관심을 갖기 전 웹사이트와 앱을 사용을 해온 사용자로서
당연히 이것들이 만들어지는 과정이나 용어에 대해서 관심이 없었다
사전강의에서 만들어지는 과정, 오늘의 아티클을 통한 용어들로 수 많은 사이트와 앱에
적용된 아이콘과 버튼들을 작업하신 디자이너분들에게 큰 존경심이 생겼다
용어들은 영어지만 뜻은 한국어인 이것들,, 우선 1개 국어가 가능한 한국인인 나는
영어와 더욱 친해져야겠다는 생각을 했고 언젠가 나도 이 용어들을 자연스럽게 툭 툭
사용하는 멋진 전문성이 생기면 좋겠다
오늘의 기억에 남는 용어 : Hamburger -> 롯데리아 맛피아 버거가 먹고싶다는 생각을 잠시하게 되는 단어이고 입에 착착 감기는 반가운 단어였다
