Diretrizes para animações de transição de conteúdo (aplicativos da Windows Store)

As animações de transição de conteúdo permitem que você mude o conteúdo de uma área da tela enquanto mantém constante o contêiner ou o plano de fundo. O novo conteúdo aparece. Se houver conteúdo existente para ser substituído, esse conteúdo desaparece.

O que fazer e o que não fazer

  • Use transições de conteúdo quando houver um conjunto de novos itens a serem inseridos em um contêiner vazio. Por exemplo, após o carregamento inicial de um aplicativo, parte do conteúdo do aplicativo pode não estar disponível imediatamente para exibição. Quando esse conteúdo estiver pronto para ser exibido, use uma animação de transição de conteúdo para inserir esse conteúdo atrasado na exibição.
  • Use as transições de conteúdo para substituir um conjunto de conteúdo por outro que já está no mesmo contêiner em uma exibição.
  • Ao inserir novo conteúdo, deslize-o para a exibição contra o fluxo geral de páginas ou a ordem de leitura. Por exemplo, se a animação deve inserir um novo conteúdo para um documento que tem o fluxo da esquerda para a direita, o conteúdo de entrada deverá entrar da direita para a esquerda.
  • Introduza novo conteúdo de maneira lógica, por exemplo, introduza o conteúdo mais importante por último.
  • Se houver mais de um contêiner cujo conteúdo será atualizado, dispare todas as animações de transição simultaneamente sem escalonamento ou atraso.
  • Não use animações de transição de conteúdo quando toda a página está mudando. Nesse caso, use as animações de transição de página.
  • Não use animações de transição de conteúdo se o conteúdo só estiver sendo atualizado. As animações de transição de conteúdo devem mostrar movimento. Para atualizações, use animações de fade.

Tópicos relacionados

Para designers
Diretrizes para adicionar e excluir
Diretrizes para animações de arrastar
Diretrizes para animações de interface do usuário baseada em bordas
Diretrizes para animações de fade
Diretrizes para animações de transações de página
Diretrizes para animações de clique de ponteiro
Diretrizes para animações de reposição
Diretrizes para animações de interface do usuário pop-up
Diretrizes para animações de passagem do dedo
Para desenvolvedores (aplicativos da Windows Store em JavaScript e HTML)
Exemplo da biblioteca de animação em HTML
Animando sua interface do usuário
Animando transições de conteúdo
enterContent
exitContent
Para desenvolvedores (aplicativos da Windows Store usando C#/VB/C++ e XAML)
Animando sua interface do usuário
Animando transições de conteúdo
Guia de início rápido: animando sua IU usando as animações da biblioteca
ContentThemeTransition

 

 

Mostrar:
© 2014 Microsoft. Todos os direitos reservados.