Um design system é essencial para se construir experiências unificadas dentro de uma interface ou plataforma. O motion dentro destes sistemas tem um papel fundamental em garantir que essa experiência se torne mais prazerosa, intuitiva e que seja consistente. Com a expansão de interfaces para cada vez mais plataformas não é estranho observarmos empresas de automóveis preocupadas em criar um sistema coerente de design. Afinal, cada vez mais vemos telas presentes em nossos carros, e o crescimento disto faz com que os automóveis acabem se tornando mais uma peça de tecnologia do que simplesmente um meio de transporte.
Observando o motion em diferentes design systems, e mais a fundo dentro de design systems de carros, encontramos na Audi uma excelente referência de como o movimento é capaz de traduzir a experiência que um condutor tem em meio a um carro da Audi.
A Audi possui um página em seu sistema de design dedicada exclusivamente para o motion e dentro dele temos alguns pontos que vale a pena termos atenção. O principal a se notar é o fundamento pelo qual o motion dentro da Audi é construído. Como parte do processo de definição de motion systems, os princípios definidos para o design, muita das vezes se traduz para o movimento.
A Audi vai mais além do que é isso. Em uma tradução livre, o sistema Audi define a animação como:
Presença Dinâmica
Nos destacamos por uma mobilidade premium. Desta forma, os movimentos dentro da Audi possuem tipicamente uma característica dinâmica. A base para isso está na curva de animação: inspirada na performance dinâmica de nossos carros, ela é baseada em uma poderosa aceleração no início com uma rápida desaceleração no final.
Essa definição por si só é algo que pessoalmente nos dá arrepio – no bom sentido. Se pararmos para analisar, o sistema de motion da Audi, nada mais é do que um reflexo do que você irá encontrar em seus carros. Ou seja, os movimentos foram construídos para que a experiência Audi pudesse ser vivenciada não somente enquanto você dirige um de seus carros, mas também enquanto interage com seu painel ou app no celular. Isso para nós é um perfeito exemplo de como uma marca pode através da animação criar uma experiência única e memorável que vai de direto encontro com a experiência do produto final que eles vendem.
Se olharmos mais atentamente na curva de animação que é apresentado para a gente neste sistema, conseguimos ver isso muito bem. Como é possível notar na imagem, temos uma velocidade de saída, ou Ease Out, com 75% de influência e uma velocidade de chegada em 95%. Ou seja, dentro do nosso Graph Editor no After, usando o editor de velocidade (Speed Graph), faríamos um gráfico bem acentuado, puxando bastante os handles de cada lado para criarmos animações que estarão presentes dentro deste sistema.
Importante reforçar como a menção do After Effects ali em seu design system, apenas demonstra a relevância deste software para a criação do UX Motion como já falamos diversas vezes.
O Motion tem se tornado cada vez mais fundamental como parte de um sistema de design e o design system da Audi é um grande exemplo de como uma marca é capaz de traduzir aquilo que identifica seu produto, através de design e movimento. Analisar o motion em design systems é um excelente exercício para não somente entender que parâmetros cada empresa leva em consideração, mas também para atribuir maior significado em tudo que construímos e desenvolvemos através da animação.
Fique por dentro das últimas novidades do mundo do UX Motion Design
Inscreva-se para receber atualizações por email relacionados ao mundo das animações para interfaces.
