Desenhamos no telemóvel, não no Figma

A primeira vez que se abre o modelo Figma cuidadosamente concebido num telemóvel real, há sempre algo que nos surpreende.

O texto é mais pequeno do que pensavas. Os elementos em que se deve tocar estão mais próximos uns dos outros do que pensavas. Todo o layout parece mais sobrecarregado do que no monitor — porque, no monitor, estavas a ver o design isoladamente. No telemóvel, estás a vê-lo em simultâneo com tudo o resto que a tua mão está a fazer.

Continuamos a utilizar ferramentas de design. São úteis para explorar ideias rapidamente, comparar opções e garantir a coerência dos componentes. O que não fazemos é considerá-las como o local onde um design é aprovado.

A nossa regra

Nenhuma decisão de design é definitiva até ter sido testada num telemóvel real durante, pelo menos, 48 horas. Não num simulador. Não espelhada a partir de um portátil. Um telemóvel, na mão, à luz do dia, numa sala escura, no metro, no bolso enquanto o ecrã está desligado e depois voltado a ligar.

A maioria das decisões muda após esse teste. O tamanho das fontes aumenta. O espaçamento torna-se ligeiramente mais generoso. Aquele traço fino e elegante passa a ter 2 px de espessura, porque 1 px não se consegue ler numa paragem de autocarro ensolarada.

Como transferimos os desenhos para um dispositivo

O caminho mais rápido é, normalmente, uma versão preliminar em vez de um protótipo aperfeiçoado. Um ecrã com dados reais, tipos de letra reais e deslocamento real diz-nos mais do que uma maquete clicável perfeita, porque se comporta tal como a aplicação se comportará. No caso de pequenas alterações, basta incorporá-las numa versão de teste e instalá-la nos nossos próprios telemóveis ainda nesse mesmo dia.

Os dados reais são tão importantes quanto o próprio dispositivo. Uma maquete com três entradas devidamente identificadas não diz nada sobre o que acontece quando alguém tem uma lista longa, um nome muito longo ou ainda não tem nada. Por isso, testamos com conteúdos desorganizados: uma lista de convidados com nomes em vários alfabetos, uma viagem com uma dúzia de paragens, um jardim com plantas adicionadas ao longo de meses.

Para além do telemóvel

O mesmo princípio aplica-se às nossas outras plataformas. As aplicações Windows são testadas num ecrã de portátil comum, com a escala normal, e não apenas num monitor externo de grandes dimensões. As extensões de navegador são testadas numa barra de ferramentas real, com o pop-up a abrir-se sobre páginas web reais. As aplicações iPhone executadas num Mac são verificadas numa janela redimensionável. Cada superfície tem a sua própria versão da diferença entre a maquete e a realidade.

O que o telemóvel nos ensina

Isso ensina-nos a ser humildes. Os designs que pareciam sofisticados na ferramenta de simulação ficam esqueléticos ou confusos no dispositivo real. Os gestos que pareciam engenhosos tornam-se desajeitados quando se tenta utilizá-los com uma só mão. As animações que pareciam fluidas num monitor de alta frequência de atualização parecem lentas num Android com três anos.

O que fizemos de errado

Costumávamos aperfeiçoar as maquetes até ficarem com um acabamento impecável antes de as testarmos num dispositivo e, depois, passávamos dias a defender decisões que, na prática, claramente não funcionavam. Esse aperfeiçoamento dava a sensação de que os designs estavam definidos, quando na verdade não estavam. Agora, mantemos as maquetes deliberadamente em bruto e testamo-las num dispositivo o mais cedo possível, para que mudar de ideias não implique grandes custos.

A desvantagem é que as primeiras versões parecem inacabadas, e é preciso alguma disciplina para não as julgar pela aparência. Mas corrigir um layout na primeira semana sai muito mais barato do que corrigi-lo depois de ter sido lançado.

Isto não é uma má notícia. É apenas a realidade em que o teu trabalho se insere. Quanto mais cedo o teu projeto se adaptar a essa realidade, melhor será o resultado final.