안녕하세요? 오늘은 툴팁에 대해 자세하게 알아보겠습니다.
툴팁이란?
툴팁(Tooltip), 인포팁(Infotip) 또는 힌트(Hint)라고 불리는 툴 팁은 마우스를 아이템에 갖다대었을 때(Hover) 나타나는 정보가 적혀 있는 박스입니다. 툴 팁은 정말 흔해서 아무곳에서나 찾을 수 있습니다.
마우스 커서가 아이템에 갖다대었을 때 나타나기 때문에 모바일 버전에서는 이 툴팁 기능을 활성화 시키기 위해서 아이콘으로 모바일 버전에서도 클릭할 수 있도록 고려하거나, 다른 행동, 예를 들어 길게 누르기(Long press)로 대처 합니다.
툴팁의 장점은?
툴팁의 좋은 점은, 사용자들이 웹사이트나 앱(App)을 사용하면서 겪는 문제점 및 자주 묻는 질문들에 빠르게 대처할 수 있습니다. 그렇기 때문에 추가 인력을 요하는 서비스 서포트가 필요하지 않으며, 회사의 인력 리소스를 줄일 수 있습니다.
다양한 툴 팁 디자인 모습
툴 팁은 어느 곳에서나 볼 수 있기 때문에 다양한 모습을 하고 있습니다.
툴 팁 디자인 시
툴 팁 디자인 시, 그 글씨체의 사이즈가 사람의 눈으로 쉽게 읽을 수 있는 폰트 사이즈이어야 합니다. 폰트 사이즈는 12px를 권장합니다. 툴팁의 내용을 적을 때, 실제 서비스 및 프로그램을 사용하는 사용자 입장에서 생각하여 쉽게 작성 합니다.
더 자세한 정보는 아래 사이트를 참조하면 좋을 것 같습니다.
Material Design
Build beautiful, usable products faster. Material Design is an adaptable system—backed by open-source code—that helps teams build high quality digital experiences.
material.io
'UI & UX' 카테고리의 다른 글
| [UX] UX 공부에 참고할 만한 웹사이트 (8) | 2021.02.11 |
|---|---|
| [UI/UX] UI 디자인, 프로토타입, 그리고 피드백까지 - 피그마(Figma)에 대해 알아보자 (0) | 2020.11.08 |
| UX, UI, 프로덕트 디자이너 - 이들이 하는 일은 무엇일까? (0) | 2020.10.21 |
| [UI/UX] 드롭다운(Dropdown)에 대해 알아보자 (0) | 2020.10.09 |
| [UI/UX] 툴 팁(Tooltip)에 대해 알아보자 (0) | 2020.10.07 |