Asanimações da interface do usuáriosão o rack de temperos do designer de produtos digitais: adicione muito e você arruinará a essência da sua criação. Mas a quantidade certa pode trazer suas melhores qualidades, comunicando idéias novas e radicais complicadas em um instante.
Apesar de raramente obter o devido reconhecimento, as animações são um componente fundamental de qualquer experiência digital- e é por isso que estamos dedicando algum tempo para honrar as oito animações de interface de usuário mais importantes de todos os tempos.
1. O cursor intermitente (1967)
No começo, havia céu e terra … e a linha terminal piscando. O cursor piscante (podemos chamá-lo de Blinky?) É como qualquer arte verdadeira que resista ao teste do tempo e do meio.
Primeiramente arquivado como uma patente por Charles A Kiesling em 1967 , ainda está em uso em telefones, caixas eletrônicos, computadores, navegadores e, certamente, em coisas ainda a serem imaginadas. É a Mona Lisa de animações da interface do usuário – simples, icônica e a base de todo um gênero de expressão artística.
2. A tela inicial do Sega Genesis (1989)
Cada console de videogame teve sua animação de abertura, mas nenhuma mais icônica que a Sega Genesis. Caso você tenha perdido, o Sega Genesis foi a contrapartida combativa do Super NES da Nintendo, rival de 16 bits, muito mais abotoado, e em cada turno, eles se posicionaram de acordo.
O Sonic the Hedgehog da Sega tinha uma atitude, enquanto o Mario era… um humilde canalizador. O hardware da Sega era elegante e preto, cinza e volumoso da Nintendo. A marca realizada até os primeiros segundos da experiência do usuário.
Cada tela de abertura do Sega Genesis para todos os jogos era tão ligeiramente diferente . (Alugando um novo jogo da Blockbuster e vendo sua tela de abertura única foi o material que poderia fazer um dia de 11 anos). Enquanto isso, o Nintendo Entertainment System (lançado em 1985) e o Super NES (lançado em 1991), pulavam a tela de inicialização todos juntos – perdendo a chance de despertar um pouco de alegria.
Mas Sega? Um flash de luz e um clipe de som personalizado de 16 bits do nome da marca.
A Sega ajudou a impulsionar a Nintendo e os videogames para outro nível antes de sair em chamas nos anos 2000. Mas as crianças dos anos 90 nunca vão esquecer: a animação da Sega foi o começo de algo divertido.
3. A tela de login da AOL (1995)
Em 2019, tudo está online o tempo todo. Temos até mesmo alto-falantes sempre em nossos bolsos e em nosso balcão da cozinha prontos para nos conectar à internet com o sussurro de um nome.
Mas houve um tempo em que “ir online” era um ato consciente. Você se sentou, limpou sua agenda (e sua linha telefônica) e mentalmente se preparou para estar conectado a estranhos em todo o mundo.
Para muitas pessoas, a AOL foi sua primeira janela para a Web – e a ideia de que eles não estavam sozinhos. E a tela de login da AOL foi o rolo de bateria. Seu quadro final, uma figura única em transição para fazer parte de um grupo, foi a promessa otimista original da web encarnada.
4. A tela de download do Windows XP (2001)
Antes de navegar por abas e banda larga, optando por baixar um compromisso de arquivo necessário. Mesmo os documentos mais simples levaram vários minutos, enquanto o resto da sua experiência de navegação na internet diminuiu para um rastreamento. Precisávamos de um visual para nos assegurar que sim, aquele arquivo estava a caminho – byte por byte excruciante.
A barra de estimativa de tempo sempre exasperou o absurdo, mas observar esses papéis flutuando languidamente da esquerda para a direita levou você a um estado hipnótico. Você aceitou seu destino. Em algum lugar, vagarosamente, os dados chegavam ao seu computador e, em breve, você conseguiria ver o rebitador relatório do TPS de seu colega. Ou aquela música doente que você ouviu no TRL .
5. A bola de praia Mac (2001)
Digite a bola de praia girando. Espera ainda não é divertido, e em um dispositivo moderno que normalmente significa algo deu muito errado. Mas pelo menos os dispositivos OSX têm alguma empatia pela espera, dando-nos algo bonito para olhar.
6. O iMessage “está digitando” bolha (2007)
Existem poucos elementos de interface do usuário que causam mais ansiedade do que os três pontos do mensageiro. Essa animação icônica do iMessage significa mais do que “seu amigo está digitando” – é uma janela para vários longos segundos de ansiedade.
Minha piada chegou? Estou prestes a ser rejeitado? Eles estão formulando um retorno sarcástico?
Pode-se viver vidas enquanto esses três pontos se movem – e morrem mil mortes se você visse os pontos aparecerem e desaparecerem novamente. Embora eu tenha certeza de que o resumo do projeto seja apenas “deixe o usuário saber que seu contato está digitando”, acabou sendo um comentário sobre a condição humana: nunca podemos realmente saber o que as pessoas realmente pensam sobre nós. E esses três pontos nos lembraram a cada conversa. Eles que se danem.
7. A animação do Uber “à procura de carona” (2010)
Todos os que adotam caronas iniciais devem lembrar-se da primeira vez que usaram o Uber para se transportar e um amigo ou pai que adotou tardiamente.
Espere, o carro acabou de aparecer? E tudo o que você precisava fazer era apertar um botão? E nós não temos que trocar dinheiro?
O Uber é uma revolução que está refazendo a maneira como navegamos em nossas cidades, mas a empresa também foi pioneira em muitas das animações de aplicativos para dispositivos móveis que tomamos como garantidas.
Abrir o Uber e ver uma pequena frota de potenciais motoristas pessoais parece uma realeza – mas também parece segurança. É um reconhecimento sutil de que essa coisa assustadora de compartilhamento de conteúdo é, na verdade, uma das melhores coisas que já nos aconteceu; que não importa onde você esteja e como chegar lá, você pode chegar em casa. Não acredite em nós? Tudo que você precisa fazer é verificar o aplicativo.
8. Twitter puxar para atualizar (2010)
Quando Steve Jobs revelou o iPhone em 2007, muitas das interações do usuário cuidadas por um mouse ou botões foram deixadas totalmente ambíguas. Como, exatamente, eu deveria digitar isso?
E na era do feed de conteúdo sem fim, a atualização era a principal entre as convenções que precisavam de uma séria reinvenção. Foi quando Loren Brichter lançou o aplicativo Twitter Tweetie, com uma das mais revolucionárias animações de interface do usuário para dispositivos móveis: a atração para atualizar.
A atração para atualizar estava em nós o tempo todo – apenas levou um aplicativo do Twitter para mostrá-lo.