Nova coleção de designs para seletor de idiomas da Digidop

Qualquer pessoa que já tenha trabalhado com design de sites — ou mesmo apenas pensado nisso — sabe disso: não é tão fácil encontrar o equilíbrio certo entre um design bonito e atraente. Também não é fácil encontrar um design que proporcione uma experiência de usuário simples e eficaz. Isso vale para todos os elementos de um site e, neste artigo, seremos ainda mais específicos, concentrando-nos nos botões de alternância de idioma.

Além de ser uma solução de tradução de conteúdo web, Weglot permite publicar um site em vários idiomas do ponto de vista da experiência do usuário, graças a um botão de alternância de idioma. Depois de integrar Weglot um site, você encontrará um botão padrão que é tão simples quanto eficaz. Mas se você estiver se sentindo criativo, provavelmente vai querer algo mais personalizado. Nesse caso, você pode aproveitar algumas configurações básicas, usar modelos ou até mesmo criar seu próprio botão, se você for um mestre na arte do CSS.

Neste artigo, vamos dar uma olhada nesses modelos de alternador de idioma, que você pode encontrar em nossa própria Galeria de Alternadores. Para ainda mais opções, dê uma olhada em nossa coleção, feita em colaboração com a Finsweet.

Sobre a colaboração

Há vários anos, colaboramos com a Finsweet, uma agência web bem conhecida na Webflow , em vários designs de seletores de idioma que poderiam ser clonados e reutilizados em qualquer Webflow . Ele está disponível para uso em qualquer tecnologia. Foi um grande sucesso, pois esses seletores de idioma foram copiados mais de 8.000 vezes em todos os tipos de sites!

No entanto, cada vez mais designers e, em especial, equipes de agências da Web, começaram a pensar fora da caixa, ajustando ou até mesmo projetando seus próprios switchers para oferecer uma experiência exclusiva aos usuários dos sites que desenvolvem.

E esse é obviamente o caso da Digidop. Fundada em 2021, esta agência web é a primeira e única agência francesa especializada em Webflow possuir tripla acreditação: Webflow , Client-First e Webflow Leader. Desde então, a agência concluiu mais de 60 projetos web para clientes em uma ampla gama de setores e compartilhou seu know-how por meio de conteúdo gratuito e uma academia online. Florian e Thomas, os dois fundadores da agência, estão entre os parceiros mais ativos Weglot desde o início. Eles compartilharam sua experiência com Weglot sua comunidade por meio de várias documentações e vídeos, mas acima de tudo, sempre estiveram dispostos a fornecer feedback relevante sobre Weglot, o que nos permitiu melhorar continuamente nossa ferramenta.

Quando pensamos em oferecer uma nova coleção de comutadores de idiomas em colaboração com uma agência, sabíamos que a experiência e o olhar crítico e técnico da equipe da Digidop resultariam em uma colaboração frutífera.

Portanto, o primeiro passo foi a equipe Weglot e a equipe da Digidop pensarem em como melhorar a integração técnica e o comportamento dos seletores para torná-los o mais perfeitos possível. Em seguida, foram os talentos artísticos e de design da equipe da Digidop que criaram cinco designs de seletores de idioma, que apresentaremos em detalhes aqui.

5 designs de seletor de idioma para usar em seus sites

O minimalismo e as linhas elegantes têm sido uma grande tendência na web recentemente. E é exatamente essa tendência que o primeiro seletor de idiomas da Digidop segue. É um menu suspenso simples, bastante semelhante ao oferecido por padrão pela Weglot, mas com linhas muito simples. Fácil de manusear para o usuário, mas acima de tudo, muito universal, adaptando-se a todos os designs de sites.

Para manter a simplicidade em termos de experiência do usuário, aqui está o segundo seletor de idioma. O nome do idioma, uma seta e nada mais. Este botão de escolha de idioma é universalmente acessível e não sobrecarrega o design do seu site. Simples, eficaz e discreto.

Uma das limitações desses designs muito simples surge quando um site oferece um grande número de idiomas. O seletor de idiomas deve permanecer simples e não parecer uma lista de compras. Para lidar com isso e, ao mesmo tempo, manter um design simplificado, a agência Digidop desenvolveu este terceiro seletor de idiomas, que pode ser acessado simplesmente clicando no idioma para abrir uma janela de seleção de idiomas. Menus na forma de janelas grandes também são uma tendência recente em sites. Este seletor de idiomas é ideal para sites com muitos idiomas.

Ao navegar na web nos últimos meses, você provavelmente se deparou com sites com poucas cores ou até mesmo sites com duas cores e contrastes fortes. Para obter um resultado bonito e eficaz, é preciso ter cuidado para manter os elementos organizados. Esse é exatamente o desafio assumido por este quarto seletor de idioma. Aqui, você escolhe o idioma clicando em um ou outro, como um interruptor de luz. É claro que esse design funciona melhor se você oferecer apenas dois idiomas.

Da mesma forma, alguns sites estão adotando a abordagem bicromática e rude, usando fontes grandes, às vezes em negrito, chegando ao ponto de usar letras maiúsculas. É isso que o site Citadium oferece. Com base nessa tendência, a equipe do Digidop criou esse quinto e último switcher. Ele pode ser usado para 2 ou um grande número de idiomas e garante que seja facilmente acessível ao usuário.

‍

Esses alternadores de idioma foram criados para você usar, brincar ou até mesmo se inspirar neles. Você pode cloná-los e personalizá-los de acordo com seu design e experiência do usuário. Para essa nova colaboração, e com base nas recomendações da Digidop, levamos essa coleção um passo adiante, oferecendo a você a chance de reutilizá-los no front-end. Você também pode usá-los durante a fase de maquete de seus projetos.

Thomas Labonne, cofundador da Digidop, revela todos os segredos dessa colaboração e explica como usar os seletores de idioma diretamente no Figma neste vídeo. Aqui, você encontrará o arquivo Figma.

Então, se você quiser dar o salto e reutilizar esses modelos de seletor de idioma diretamente no seu Webflow , aqui você encontrará todos os componentes clonáveis, e deixo você com Florian Bodelot, cofundador da Digidop, que irá guiá-lo pelo uso desses seletores de idioma.

Conclusão

Agora cabe a você aproveitar a reutilização desses componentes em seus projetos de design de sites. Gostaríamos de agradecer à equipe da agência Digidop pelo feedback, suporte técnico e excelentes habilidades de design. Não se esqueça de conferir o conteúdo educacional deles, que o ajudará a levar seus projetos ainda mais longe.

Como o design da Web está em constante evolução, estamos planejando lançar novas coleções de alternadores de idioma. Portanto, se você tiver alguma ideia de design, não hesite em nos informar.