티스토리 뷰
안녕하세요 찐망고입니다.
오늘은 구글 머터리얼 디자인 Sound and motion부분에 대해 포스팅 해볼까요
Sound
사용자가 UI 요소에 설명 레이블을 추가하면, 소리를 사용하여 앱을 탐색할 수 있습니다.
스크린 리더(TalkBack과 같은)를 사용하고 터치 탐색을 통해 탐색할 때,
사용자가 화면의 UI 요소를 터치하면 레이블이 음성으로 읽어집니다.
스크린 리더 사용이 어려울 수 있는 상황:
- 스크린 리더 위로 소리가 재생될 때 (예: 자동 재생되는 배경 음악. 사용자가 이 소리를 일시정지하거나 중지할 수 있는 컨트롤을 제공해야 함).
- 기본 요소에 추가 소리가 삽입될 때 (스크린 리더는 기본 요소를 정확하게 해석할 수 있어야 함).
소리에 대한 대안 (Alternatives to sound)
소리나 중요한 오디오 요소 및 경고에 대해 시각적 대안을 제공할 수 있습니다.
예: 닫힌 캡션(자막)이나 텍스트 기록(transcript).
더욱 접근성 높은 앱 만들기 | App quality | Android Developers
이 페이지는 Cloud Translation API를 통해 번역되었습니다. 더욱 접근성 높은 앱 만들기 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. 접근성 기능이 필요한 사
developer.android.com
Motion
Material Design은 화면 간 초점을 안내하기 위해 움직임을 사용합니다.
화면 요소들은 사용자가 따라갈 수 있는 초점 지점으로 변환되며, 중요하지 않은 요소는 제거됩니다.
움직임이나 시각 민감도를 가진 사용자들이 인터페이스를 편안하게 사용할 수 있도록,
Material Design은 W3C의 다음 지침을 따릅니다:
- 5초 이상 지속되는 경우 자동으로 움직임, 스크롤, 또는 깜박임이 있는 콘텐츠를 일시정지, 중지, 또는 숨길 수 있도록 설정하세요.
- 깜박이는 콘텐츠는 1초에 3번 이하로 제한하여 깜박임과 빨간색 깜박임 임계값을 충족하세요.
- 화면의 중앙 큰 영역에서 깜박임이 발생하지 않도록 피하세요.
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.
m3.material.io
시간제한 컨트롤 (Timed controls)
앱의 컨트롤은 일정 시간이 지나면 사라지도록 설정할 수 있습니다.
예를 들어, 비디오가 시작된 후 5초 후에 재생 컨트롤이 화면에서 사라질 수 있습니다.
고우선순위 컨트롤 (High-priority controls)
중요한 기능을 수행하는 컨트롤은 타이머로 인해 너무 빨리 사라지면 사용자가 이를 놓칠 수 있습니다.
예를 들어, TalkBack은 사용자가 컨트롤에 집중하면 이를 음성으로 읽어줍니다.
그러나 타이머에 의해 컨트롤이 사라지면 해당 작업이 완료되지 않을 수 있습니다.
중요한 기능을 활성화하는 컨트롤은 사용자가 이를 다시 켜거나,
동일한 기능을 다른 방식으로 수행할 수 있도록 해야 합니다.
'UIUX디자인 > 디자인' 카테고리의 다른 글
| UX Design - 디자이너를 위한 접근성 연구 가이드 (1) | 2024.12.24 |
|---|---|
| 구글 머터리얼 디자인 - 접근성 (0) | 2024.12.23 |
| 구글 머터리얼 디자인 - Imagery (1) | 2024.12.21 |
| 구글 머터리얼 디자인 - 접근성 텍스트 (2) | 2024.12.09 |
| 구글 머터리얼 디자인 - Touch Targets 타이포그래피 (3) | 2024.12.03 |
- Total
- Today
- Yesterday
- 웹폰트
- 2024웹디자인
- figma
- UI디자인
- seo
- 웹표준
- 웹디자인
- 반응형웹
- 피그마
- 웹퍼블리싱
- 티스토리챌린지
- 프론트엔드
- 웹디자인팁
- 디자인시스템
- 찐망고사주
- html
- 서비스기획
- UX디자인
- css
- 오블완
- JavaScript
- 바이브코딩
- 구글머터리얼디자인
- uiux
- CSS3
- 웹접근성
- 웹디자인개발기능사
- ai사주
- 디자인팁
- 머터리얼디자인
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | |
| 7 | 8 | 9 | 10 | 11 | 12 | 13 |
| 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 |
| 28 | 29 | 30 |