Esta introdução ao modelo de app de música descreve os principais elementos, as funções básicas que eles fornecem e a arquitetura que os mantém juntos.
Nas seções seguintes, fornecemos descrições mais detalhadas de como cada elemento funciona. Para acessar um guia, consulte a visão geral desta seção.
Anatomia
O modelo de mídia inclui o seguinte:
- Barra de apps: tem a navegação principal dos apps e os controles de apps (para pesquisa e configurações no app) e inclui um ícone do app.
- Espaço de conteúdo navegável: exibe o conteúdo em uma visualização em grade (mostrada aqui) ou em lista.
- Controles de reprodução: a barra de controle minimizada mostrada aqui inclui metadados básicos de mídia e controles de mídia, além de fornecer acesso a uma sobreposição de reprodução com mais controles.
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/spatial-1.png?authuser=6&hl=pt-br)
2. Espaço de conteúdo navegável
3. Controles de mídia (mostrados aqui na barra de controle minimizada)
Este layout de exemplo mostra apenas uma organização possível desses elementos. Por exemplo, os fabricantes de automóveis podem decidir empilhar os controles principais de navegação e de apps em vez de mantê-los em uma única barra horizontal, dependendo das dimensões da tela. A hierarquia de navegação é descrita em mais detalhes nas seções a seguir.
Navegação principal
A navegação principal na barra de apps consiste em guias expostas (exceto em casos raros em que a tela é muito pequena).
Este exemplo mostra uma organização típica de guias:
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/SM_primary_navigation.gif?authuser=6&hl=pt-br)
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/primary_navigation.gif?authuser=6&hl=pt-br)
Controles de apps
Os controles de apps (mostrados no canto superior direito no exemplo abaixo) ocupam a parte da barra de apps que não é usada para branding ou navegação principal. Elas dão acesso às funções de pesquisa e configurações no app de mídia atual.
A seleção de um controle de app abre uma sobreposição. Por exemplo, a affordance de configurações mostrada aqui abre uma sobreposição que exibe a interface de configurações. Quando os usuários fecham a sobreposição, eles retornam ao local anterior no app.
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/SM_setting.gif?authuser=6&hl=pt-br)
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/settings.gif?authuser=6&hl=pt-br)
Espaço de conteúdo navegável
Dentro do espaço de conteúdo navegável, os usuários podem rolar pelo conteúdo e navegar pelo z-space até itens individuais, pelos níveis consecutivos de hierarquia.
Como navegar por vários níveis aumenta a carga cognitiva do motorista, o Google recomenda manter a arquitetura da informação relativamente simples, com o mínimo de níveis possível.
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/spec_content.gif?authuser=6&hl=pt-br)
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/content_browsing.gif?authuser=6&hl=pt-br)
Controles de mídia
Os controles de mídia em apps de mídia podem aparecer de duas formas, dependendo das circunstâncias:
- Barra de controle minimizada (disponível nas visualizações)
- Visualização de reprodução (sobreposição com barra de controle total)
Essas duas formas se alternam na parte inferior da tela no exemplo animado a seguir.
Barra de controle minimizada
A barra de controle minimizado flutua no nível mais alto do espaço navegável, acima do conteúdo. Ele fornece informações sobre o que está sendo reproduzido, juntamente com affordances básicas para o controle do usuário.
Quando o conteúdo começa a ser reproduzido, a barra de controle minimizada permanece disponível enquanto o usuário navega pelo conteúdo de mídia. Ela persiste até que um novo app de mídia seja selecionado ou até que o usuário toque na barra de controle minimizada para exibir a visualização de reprodução.
Visualização de reprodução
A barra de controle total está disponível somente na visualização de reprodução e também flutua acima do conteúdo. Além das affordances disponíveis na barra de controle minimizada, a barra de controle completa pode fornecer controles mais abrangentes definidos por cada app de mídia.
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/SM_control_bar.gif?authuser=6&hl=pt-br)
![](https://developers.google.cn/cars/design/automotive-os/apps/media/images/playback.gif?authuser=6&hl=pt-br)