시스템 환경

세로 모드 참조 환경을 디자인할 때는 시스템 환경, 앱 환경, 추가 기능에 중점을 둡니다.

세로 모드 참조 디자인은 홈 화면에 의해 고정되며 다음과 같은 영구 시스템 UI 요소를 포함합니다.

홈 화면

홈 화면은 운전자가 모든 컨트롤에 쉽게 액세스할 수 있는 올인클루시브 시작점을 제공합니다. 이 기능은 대부분의 운전자의 요구사항을 충족하므로 운전자는 앱 간에 전환하는 대신 도로를 탐색하는 데 집중할 수 있습니다.

운전자는 이 화면을 벗어나지 않고 다음 항목에 액세스할 수 있습니다.

  • 빠른 컨트롤과 프로필 선택기가 있는 상단의 상태 표시줄
  • 화면 본문의 기본 레이어로, 일반적으로 내비게이션 앱을 실행합니다.
  • 하단의 컨트롤 및 시스템 탐색 메뉴
홈 화면 조회수

컨트롤 바

컨트롤 바는 미디어 (동영상 및 음악), 팟캐스트, 블루투스, 라디오, 진행 중인 통화의 컨트롤을 호스팅합니다.

미디어 및 전화 앱의 경우 컨트롤 바는 화면 하단의 탐색 메뉴 위에 있습니다. 사용자가 수신 전화를 수락하면 컨트롤이 미디어에서 활성 전화 통화로 변경됩니다.

미디어 제어

미디어 컨트롤로 재생, 일시중지, 되감기, 앞으로 감기 기능이 제공됩니다. 또한 사용자가 즐겨찾기를 표시하고 추가 맞춤 컨트롤(있는 경우)에 액세스할 수 있습니다.

표준 미디어 컨트롤
확장된 미디어 컨트롤

활성 전화 통화 제어

휴대전화 컨트롤은 스피커를 음소거하고 블루투스로 전환하며 통화를 취소하는 기능을 제공합니다.

휴대전화 제어

상태 표시줄

상태 표시줄은 화면 상단에 표시되며 프로필 선택기, 빠른 컨트롤, 시간 및 날씨 정보를 호스팅합니다.

상태 표시줄 요소

  1. 빠른 제어:
    1. 블루투스: 블루투스 상태
    2. 연결: Wi-Fi, 모바일 네트워크, 핫스팟
    3. 밝기 디스플레이: 사용자가 화면 밝기 수준을 조정할 수 있습니다.
  2. 시계: 현재 시간을 디지털 방식으로 표시합니다.
  3. 날씨 정보: 외부 온도를 표시합니다.
  4. 프로필 선택기: 현재 사용 중인 사용자 프로필을 표시하고 필요한 경우 사용자가 다른 프로필을 선택할 수 있도록 합니다.

상태 표시줄의 요소는 좌/운전 차량과 오른쪽 핸들 차량의 동일한 순서로 표시됩니다.

사용자는 설정에서 날씨 표시를 켜거나 끌 수 있습니다.

상태 표시줄 맞춤설정에 관한 권장사항과 안내는 상태 표시줄 권장사항을 참고하세요.

빠른 컨트롤

상태 표시줄의 빠른 컨트롤을 사용하면 블루투스, 연결, 디스플레이 밝기에 쉽게 액세스할 수 있습니다.

블루투스 제어
연결 제어
표시 설정

프로필 선택기

상태 표시줄의 프로필 선택기를 사용하면 프로필을 빠르게 선택하고 바로가기로 프로필 설정에 액세스할 수 있습니다.

프로필 메뉴가 있는 프로필 선택기

상태 표시줄 권장사항

앱 개발자를 위한 권장사항:

  • 투명성을 사용하여 앱 콘텐츠를 가리지 않도록 함: 앱이 상태 표시줄 전체 아래가 아닌 뒤에 부분적으로 배치된 경우 앱 개발자는 상태 표시줄을 투명하게 유지해야 합니다.
  • 전략적으로 색상 적용: 앱 전체가 상태 표시줄 아래에 있으면 앱 개발자는 상태 표시줄의 색상을 선택해야 합니다.

시스템 탐색 메뉴

시스템 탐색 메뉴는 앱 런처, 디지털 어시스턴트, 알림 센터 및 쾌적 컨트롤을 위한 컨트롤을 호스팅합니다.

시스템 탐색 메뉴는 화면 하단에 있으며 다음과 같은 컨트롤을 표시합니다.

시스템 탐색 메뉴 요소

  1. 좌석 온도: 차량 내부 온도
  2. 앱 런처: 운전자가 사용할 수 있는 앱
  3. 디지털 어시스턴트: Google 어시스턴트와 같은 선택한 디지털 어시스턴트에 액세스합니다.
  4. 알림 센터: 알림 센터에 액세스할 수 있습니다.
  5. 냉난방/공기청정: 차량 내 실내 온도 조절기 액세스

시스템 탐색 메뉴 맞춤설정에 관한 안내는 시스템 탐색 메뉴 맞춤설정을 참고하세요.

앱 런처

앱 런처는 기본 앱 공간의 표준 앱 런처 그리드 뷰에 표시됩니다. 앱은 A부터 Z까지 정렬됩니다. 사용자는 선호도에 따라 앱을 재정렬할 수 있습니다.

앱 런처

디지털 어시스턴트

탭하면 이 어포던스가 음성 커뮤니케이션을 위해 현재 활성화된 디지털 어시스턴트를 호출합니다.

디지털 어시스턴트

알림 센터

알림 센터는 읽은 알림 메시지와 읽지 않은 알림 메시지를 저장된 모든 알림 메시지로 사용자를 안내합니다.

알림 센터

실내 온도 조절기

실내 온도 조절기 아이콘을 사용하면 자동차의 실내 온도 조절기에 쉽게 액세스할 수 있습니다.

확장된 실내 온도 조절기

추가 기능

시스템 환경과 앱 환경 모두에 적용되는 세로 모드 참조 디자인의 추가 기능에는 음성 레이어와 테마가 있습니다.

음성 레이어

음성 레이어는 모든 레이어 위와 컨트롤 및 시스템 탐색 메뉴 위에 있는 투명 레이어입니다.

Google 어시스턴트와 같이 시스템에 통합된 모든 유형의 디지털 어시스턴트를 실행할 수 있습니다.

테마

조명 상태에 따라 두 가지 테마를 사용할 수 있습니다.

어두운 테마
밝은 테마

야간이나 조명이 어두운 환경에서는 빛 반사를 줄이기 위해 어두운 테마를 사용합니다. 야간의 가시성에 대해 자세히 알아보세요.

밝은 테마를 사용하면 직사광선이 닿는 곳에서 운전자와 승객이 자동차 화면을 볼 수 있습니다. 시스템 탐색 메뉴는 하드웨어와 혼합되도록 검은색으로 유지할 수 있습니다.