Os dispositivos Android têm vários formatos (smartphones, tablets, dobráveis, dispositivos ChromeOS) com uma grande variedade de tamanhos de tela. O Android oferece suporte a muitos modos de exibição, incluindo várias janelas, várias telas, formato livre e picture-in-picture. Os dispositivos dobráveis podem estar em vários estados ou posições, como de mesa ou livro.
Quando começar a projetá-lo, considere diferentes casos de uso para seu app. Por exemplo:
Os dispositivos de tela grande oferecem aos usuários mais espaço para interagir com o conteúdo do app de música de diferentes maneiras.
Os usuários podem realizar várias tarefas enquanto assistem um vídeo em uma configuração de várias janelas ou aproveitar a tela maior para aplicar edições mais complexas depois de capturar uma imagem.
Os usuários podem recorrer a um tablet para fazer videochamadas e ver amigos e familiares com mais detalhes. Seu app pode mostrar um contexto mais completo sobre um título ou uma cena em uma sobreposição de reprodução personalizada ou oferecer mais opções de controle na tela.
Os carrosséis em uma visualização de navegação podem apresentar mais variedade para aumentar o apelo visual. Além disso, o app de música pode manter os usuários engajados oferecendo um feed navegável lado a lado com a reprodução.
Lembre-se de que seu app de música tem o mesmo código executado em um smartphone padrão, um dobrável, um tablet e dispositivos ChromeOS. Portanto, é necessário projetar para telas grandes desde o início do desenvolvimento do app. Para mais informações e exemplos visuais, consulte Galeria de telas grandes.
Tornar seu app de mídia responsivo por padrão
Evite experiências do usuário corrompidas no app de música tornando o layout adaptável em smartphones, tablets, dobráveis e dispositivos ChromeOS.
Seu app precisa ser responsivo para considerar diferentes tamanhos de tela, orientações e formatos. Um layout adaptável muda com base no espaço de tela disponível. Para mais informações, consulte Suporte a tamanhos de tela diferentes.
Projetar de acordo com diretrizes
A qualidade principal do app é a base de todos os apps Android, independente do tamanho da tela, da posição do dispositivo ou de outras considerações específicas do dispositivo. Seu app precisa atender a esses requisitos básicos antes de começar a projetar para uma tela grande. Para mais informações, consulte Qualidade principal do app.
Seu app precisa oferecer uma excelente experiência do usuário, independente do formato, tamanho da tela, modo de exibição ou posição do dispositivo. Portanto, projete o app de acordo com as diretrizes de nível 1, 2 e 3 a seguir.
As diretrizes definem um conjunto abrangente de requisitos de qualidade para a maioria dos tipos de apps Android.
Nível 3:
Nesse nível básico, o app ainda precisa aderir aos requisitos de interface e gráficos. Seu app está pronto para telas grandes, e os usuários podem concluir fluxos de tarefas críticas, mas com uma experiência do usuário menos do que ideal.
O layout do app pode não ser o ideal, mas ele é executado em tela cheia ou em tela cheia no modo de várias janelas. Ele não tem efeito letterbox e não é executado no modo de compatibilidade. O app oferece suporte básico a dispositivos de entrada externa, incluindo teclado, mouse e trackpad. Para mais informações, consulte Pronto para telas grandes.
Nível 2:
Aqui, o app implementa otimizações de layout para todos os tamanhos de tela e configurações de dispositivo, além de oferecer suporte avançado a dispositivos de entrada externa. Para mais detalhes, consulte Otimizado para telas grandes.
Nível 1:
Esse é o melhor nível de suporte e oferece ao usuário a melhor experiência com seu app, já que especifica recursos e funções premium.
Quando aplicável, o app oferece suporte a multitarefas, posições dobráveis, arrastar e entrada de stylus. Nesse nível, os apps são altamente diferenciados. Portanto, preste muita atenção às diretrizes para ações como multitarefa e postagens dobráveis. Para saber mais, consulte Diferenciado para telas grandes.
Layouts otimizados
Aproveite o espaço maior de telas grandes sem efeito letterbox (devido à restrição da orientação) ou alongamento. Ao otimizar o layout do app para mídia e mídias sociais, você expande o alcance do app e cria uma melhor experiência do usuário em todos os formatos de tela grande (tablets, dobráveis e dispositivos ChromeOS), além de oferecer suporte a todos os tamanhos de smartphone.
Os componentes da coluna e gaveta de navegação oferecem uma navegação simples para conveniência e controle da interface. Os componentes também complementam os layouts canônicos (detalhes de lista, feed e painel de suporte) posicionando os destinos de navegação principais ao alcance de perto, ocupando um espaço mínimo na tela.
Layouts de mídia
Torne seu app mais utilizável implementando layouts específicos de mídia para detalhes de lista, feeds e painéis de suporte. Para mais informações sobre os layouts MDX, Flutter e Compose, consulte Recursos de layout.
Detalhes e listas:projetar seu app com um navegador de mídia interativo permite que os usuários naveguem em diferentes mídias enquanto assistem ou ouvem. Os títulos das mídias são mostrados lado a lado com um arquivo de vídeo ou áudio. Se a orientação do dispositivo mudar, um layout de detalhes e lista responderá para preservar o estado do app. Para saber mais, consulte Layouts de detalhes e listas.
Feed:um layout de feed organiza elementos de conteúdo equivalentes em uma grade configurável para visualização rápida e conveniente de uma grande quantidade de conteúdo, como um feed de música ou filme e quiosque de TV no seu app. Para mais informações, consulte Layouts de feed.
Painel de suporte:com as áreas de exibição primária e secundária, seu app pode incorporar um painel de suporte para contexto, relevância ou referência, como uma lista de rolagem de títulos semelhantes, avaliações publicadas ou outras obras dos mesmos artistas ou atores. Para mais detalhes, consulte Layouts de painel de suporte.
Para conferir uma coleção selecionada de layouts de mídia, consulte Galeria de mídia.
Layouts de mídias sociais
As telas grandes oferecem aos usuários de mídias sociais mais espaço de trabalho para criar, realizar várias tarefas ao mesmo tempo, arrastar conteúdo entre apps e compartilhá-lo. Com recursos e funcionalidades que não são possíveis em dispositivos de tela pequena, seu app de mídia de tela grande pode aproveitar layouts de detalhes de lista, feeds e painéis de suporte.
Detalhes e listas:é ideal para apps de mensagens, gerenciadores de contatos ou navegadores de arquivos. Por exemplo, seu app pode mostrar uma lista de conversas lado a lado com detalhes para ficar por dentro das mensagens mais recentes. Para mais informações, consulte Layouts de detalhes e listas.
Feed:os componentes comuns nesse estilo de layout são cards e listas. Por exemplo, crie uma colagem de postagens em um formato de grade flexível ou use tamanho e posição para chamar a atenção para postagens em destaque. Os usuários podem visualizar rapidamente grandes grupos de conteúdo. Para mais informações, consulte Layouts de feed.
Painel de suporte:apps de pesquisa e referência ou um app de produtividade podem se beneficiar desse estilo de layout. Assim, as ferramentas de criação de conteúdo ficam sempre à mão do usuário. Por exemplo, o app pode permitir que os usuários ajustem configurações, acessem paletas de cores, apliquem efeitos e confiram as mudanças instantaneamente. Para saber mais, consulte Layouts de painel de suporte.
Para conferir uma coleção selecionada de layouts de mídias sociais, consulte a página Galeria de mídias sociais.
Práticas recomendadas para apps de mídia em tela grande
O uso de práticas recomendadas para telas grandes ajuda a evitar a reformulação desnecessária do app. Elas também tornam o app mais fácil de usar em mais dispositivos desde o início, especialmente em relação à orientação, aos atalhos de teclado, ao suporte à visualização da câmera e às posições dobráveis.
Orientação e redimensionamento
Se o app de música declarar restrições de orientação e redimensionamento, o Android ativará um modo de compatibilidade. Embora o modo de compatibilidade garanta que o app se comporte de forma aceitável, a usabilidade é muito reduzida e a experiência do usuário afeta.
Por exemplo, se o app estiver em um tablet, ele será encaixado na orientação paisagem. Se o app estiver restrito ao modo retrato, isso causa o efeito letterbox, o que não é ideal para o usuário final. Seu app precisa permitir que as pessoas usem a orientação preferida delas. Portanto, aproveite o tamanho disponível de uma tela grande no seu design.
Qualquer restrição de orientação reduz a forma como os usuários podem interagir com o conteúdo ou consumir mídia, o que limita o uso do app. Mudar a orientação pode afetar o dimensionamento até certo ponto, mas não necessariamente muda a orientação.
Atalhos do teclado
Em uma tela maior, os atalhos em teclados físicos, como iniciar, parar, pausar, retroceder e avançar, têm maior probabilidade de serem usados, tornando a experiência do usuário consistente com o teclado.
Os usuários esperam essas funções nos apps de música. Para diminuir os pontos de atrito para os usuários, teste seu app com um teclado físico. Isso ajuda a perceber e incluir esses atalhos importantes no app no início do design.
Compatibilidade com a visualização da câmera
Com telas grandes, você pode ter mais problemas com alongamento, corte e rotação. Portanto, não é possível presumir que o tamanho da visualização da câmera é o que a interface no seu app de música realmente renderiza.
Por exemplo, se um usuário tira uma foto com o tablet, mas a tela é renderizada de cabeça para baixo, essa não é a experiência ideal. Incluir compatibilidade com a visualização da câmera em telas grandes.
Para mais informações, consulte Visualização do CameraX ou Visualização do Camera2.
Posições dos dobráveis
Projetar seu app de mídia para telas grandes inclui posições dobráveis. Seu app, por exemplo, pode permitir que um usuário tenha uma configuração de mesa para reprodução de mídia ou usar uma tela traseira e o modo Dual Screen para visualizações e capturas.
Com as posições dobráveis incluídas no plano de desenvolvimento, o app fica disponível para mais dispositivos e tem um impacto maior. Você amplia a experiência de mídia para o usuário de maneiras que outros dispositivos não conseguem sem as posições dobráveis. Para mais informações, consulte Posições dobráveis.