Loading animation

A oportunidade

Com a nova tela de Pré-Live, ao acessar a Americanas Ao Vivo, seja pelo aplicativo da Americanas ou através de um link externo da live, nosso backend precisava solicitar da API da B2W a informação se estava ou ocorrendo live ou não. Em outras palavras, era necessário um tempo de carregamento para saber se o usuário deveria ser direcionado para a tela de Live ou a tela de Pre-Live.

Nosso time de desenvolvimento, ao implementar a Pre-Live, não alterou a tela de transição prevista na versão MVP do produto, porém questionamos o quanto impactaria a experiência do usuário, já que agora se tratavam de alguns segundos a mais, podendo ser muitos segundos em casos atípicos. Assim, surgiu a ideia de propormos uma animação, que mantivesse o usuário entretido até o fim do carregamento dos dados.

Impedimentos técnicos

Em alinhamento com o time de desenvolvimento, buscamos entender qual seria o formato de animação que resultaria em mais facilidade para implantação, afinal se tratava de uma oportunidade que seria levada ao cliente e o custo em desenvolvimento seria sua principal preocupação. Foi definido que utilizaríamos a plataforma Lottie Files, que possuí um plugin do After Effects, com o qual é possível transformar animações vetorizadas em .json, formato preferível pelo nosso time devido a facilidade de implementação.