Ir para o conteúdo principal

Como a NIO inovou e entregou rapidamente usando o Figma

No setor automotivo, as coisas nem sempre avançam rapidamente. É uma indústria que se acostumou a ciclos de três a cinco anos, desde o design de um carro até seu lançamento. E, devido à forma como o software precisa ser profundamente incorporado ao hardware, não é incomum que o trabalho de UX em telas veiculares seja concluído anos antes de o carro chegar ao mercado.

No entanto, novos participantes do mercado querem ser ainda mais rápidos. Quando a montadora chinesa NIO precisou de uma nova identidade visual para sua nova submarca, a firefly, a empresa quis trabalhar com uma agência capaz de inovar, iterar e entregar com velocidade. E encontrou o parceiro certo na agência de design forpeople.

Com sede em Londres e Amsterdã, a forpeople tem expertise em diversos domínios, incluindo design gráfico, de produto, espacial e de interação, além de motion, redação, pesquisa e estratégia. Eles eram a escolha perfeita para a NIO, que queria criar um ponto de vista distinto no mercado — com foco no usuário e em uma experiência mais fluida.

O desafio era criar uma marca e um sistema de identidade visual distintos, que fossem marcantes, significativos e consistentes em toda a experiência do usuário. Mas a forpeople sabia que a chave seria uma colaboração intensa e ciclos contínuos de feedback com os líderes de design da NIO em Munique e na China. E, para isso, recorreram ao Figma.

telas de layout de clima com logotipos e um veículo, usando cursores para colaborartelas de layout de clima com logotipos e um veículo, usando cursores para colaborar
Ao colaborar com a equipe da NIO no Figma, a forpeople conseguiu avançar rapidamente e fazer os designs evoluírem com agilidade.

“Se você olhar para a história de como as agências trabalham com clientes, a maioria normalmente depende de apresentações de slides tradicionais. Estávamos compartilhando arquivos, em chamadas, olhando documentos estáticos, pedindo ao cliente para passar para o próximo slide”, diz James Addison, Diretor Criativo da forpeople. “Mas isso não funciona quando você está criando uma enorme quantidade de visuais, precisa de protótipos interativos e tem um cliente inovador que exige agilidade. Para isso, precisávamos do Figma — e, muito rapidamente, o Figma se tornou nosso hub criativo e o núcleo da colaboração que esteve no centro da nossa parceria.”

Uma identidade com a liberdade de brilhar

Desenvolver um novo sistema de identidade visual é um processo profundo e minucioso. Para a nova marca de carros da NIO, a forpeople buscou inspiração na forma como os vaga-lumes se movem, como emitem luz e nos ambientes com os quais interagem.

Marius Holletzek, Diretor de Experiência de Marca, Design e Estratégia da NIO:

“Queríamos que a marca fosse sentida como parte inseparável do próprio carro — não como um elemento adicionado depois, mas como algo vivo dentro dele. Inspirada na linguagem de design do veículo e na magia dos vaga-lumes, nossa direção criativa, ‘Freedom to Glow’, captura um espírito de individualidade que brilha em cada detalhe — da tipografia e das cores à forma como a marca se movimenta e se expressa. Tudo isso foi concebido no Figma como nossa plataforma escolhida para desenvolver e compartilhar ideias.”

telas e ícones de diferentes modos e interações, com sobreposição de cursorestelas e ícones de diferentes modos e interações, com sobreposição de cursores
O projeto envolveu múltiplas rodadas de iteração, sustentadas por um ciclo contínuo de feedback no Figma.

A partir dessas bases, a forpeople começou a trabalhar no logotipo. “Exploramos muitas ideias e variações para o logotipo, e foi aí que a necessidade de colaboração rápida ficou evidente”, diz James. “Esse não era o tipo de projeto que poderia ser enviado ao cliente e depois aguardado o retorno. Foram inúmeras rodadas de iteração, muitos comentários em cada versão do logotipo, e precisávamos de um ciclo contínuo de feedback — algo impossível de alcançar trocando PDFs intermináveis por e-mail.”

Usando o Figma, a forpeople criou um hub colaborativo único para todas as frentes do projeto, no qual a equipe de design da NIO em Munique podia comentar, enquanto a equipe da forpeople avançava rapidamente com os designs.

A experiência dentro do carro criada no Figma utiliza efeitos sutis de movimento, pensados para encantar os usuários.

A partir de logotipos estáticos, a equipe da forpeople passou a desenvolver movimento. “Há duas telas no carro e, junto com a NIO, decidimos que os elementos visuais deveriam poder se mover de uma tela para a outra”, explica James. “Idealizamos um vaga-lume que atravessasse os dois espaços, flutuando e piscando entre as telas, para criar uma experiência visual pensada para encantar o usuário e gerar uma experiência digital fluida.”

Alguns desses conceitos foram criados como MP4s adicionados pela equipe da forpeople ao Figma; outros foram desenvolvidos diretamente no Figma.

“Começamos experimentando como a própria interface poderia se comportar e como a marca poderia ganhar vida dentro do carro”, diz James. “Usando o Figma, exploramos como o movimento poderia acontecer, como o piscar de um vaga-lume poderia se traduzir em um aviso suave e como a inovação poderia parecer ao mesmo tempo sólida e expressiva. Por meio desses primeiros protótipos, moldamos uma direção que se tornou a base para a equipe da NIO em Xangai desenvolver e adaptar. Foi realmente um esforço global.”

Mas um dos maiores resultados de trabalhar dessa forma foi a conexão próxima que a forpeople construiu com os envolvidos da NIO. Ambas as equipes passaram a ver a tela de trabalho do Figma como o ponto central em torno do qual criavam ideias, colocavam-nas em prática e coletavam feedback dos envolvidos em suas respectivas organizações.

“Avançamos rápido, e colaborar com a equipe da forpeople no Figma melhorou drasticamente nossa eficiência”, afirma Marius. “Não queremos analisar toneladas de apresentações. O Figma nos permite manter uma única fonte de verdade, com ciclos de feedback que ficam registrados no próprio arquivo.”

Embora grande parte da colaboração aconteça com as equipes da forpeople e da NIO trabalhando no arquivo a partir de seus escritórios no Reino Unido e na Alemanha, respectivamente, um exemplo fascinante de como as equipes visualizam os designs vem do centro de design da NIO em Munique.

duas pessoas olhando para uma tela grande com um arquivo do Figma e telas de interface exibidasduas pessoas olhando para uma tela grande com um arquivo do Figma e telas de interface exibidas
Revisar arquivos do Figma no power wall de sete metros da NIO transformou a colaboração presencial.

É ali que fica localizado o teatro do “power wall” de sete metros da NIO. Normalmente, ele é usado como uma tela interativa para que as equipes de design e engenharia da NIO façam análises em escala real de veículos, avaliando um SUV virtual com qualidade de cinema. Mas ele também é a ferramenta de apresentação perfeita para um arquivo do Figma.

“O Figma foi claramente criado para colaboração remota. Mas quando o levamos para o nosso power wall, o trabalho presencial se torna ainda mais eficaz. Ele vira uma tela de trabalho gigantesca, onde as equipes podem se reunir, identificar oportunidades mais rapidamente e transformar ideias em ação — juntas, na mesma sala”, afirma Daniel Wegmann, Líder Criativo da NIO.

A necessidade de velocidade da NIO reformulou o ritmo do design automotivo. Com a forpeople e o Figma, a equipe conseguiu atravessar a complexidade para criar, testar e refinar ideias em tempo real. O resultado: uma nova identidade ousada — e um novo parâmetro de como uma colaboração rápida e focada pode criar um modelo em que o design acompanha a ambição.

Veja como o Figma ajuda a escalar o design

Um design excelente tem o potencial de diferenciar seu produto e sua marca. Mas tudo o que é bom é feito em equipe. O Figma une equipes de produtos em um fluxo de trabalho de design rápido e mais inclusivo.

Entre em contato para saber mais sobre como o Figma pode ajudar empresas a escalar o design.

Vamos abordar como o Figma pode ajudar a:

  • Centralizar todas as etapas do processo de design, desde a concepção até a criação e a construção, em um único lugar
  • Acelerar os fluxos de trabalho de design com um design system compartilhado por toda a empresa
  • Incentivar a inclusão no processo da equipe de produto com produtos que são acessíveis, online e fáceis de usar

Conecte-se com nossa equipe

Ao clicar em “Enviar”, você concorda com nossos Termos de Serviço e Política de Privacidade.