Categorias do Site

A Revista do Profissional Web

40+ Templates Grátis de UI para Figma

Acelere seu design com mais de 40 templates de UI gratuitos para Figma. Ideal para projetos web e mobile.

UI/UX DesignDesign Gráfico
Interface de usuário com elementos de design, incluindo ícones, paletas de cores e tipografias, distribuídos de forma organizada ao redor de um ícone central colorido.

Projetar uma interface de usuário é uma tarefa complexa que requer consideração cuidadosa de elementos como layout, tipografia, cor e usabilidade. No entanto, com as ferramentas certas, o processo se torna muito mais gerenciável.

Figma é uma popular ferramenta de prototipagem para designers, conhecida por suas funcionalidades amigáveis que facilitam a criação de interfaces bonitas. Como uma ferramenta de design colaborativo, permite que vários usuários trabalhem em um projeto simultaneamente, sendo perfeita para equipes grandes ou remotas.

Projetar uma interface do zero pode ser demorado, por isso usar um kit de UI para web ou mobile é uma ótima maneira de acelerar o processo. Com um kit de design pré-fabricado, você não precisa criar cada elemento de UI do zero, podendo focar em organizar esses elementos de forma lógica e visualmente atraente. Um kit de UI também ajuda a garantir a consistência em todo o design, fazendo sua interface parecer profissional e polida.

Curamos uma coleção dos melhores kits e templates de UI gratuitos para web e mobile no Figma. Confira abaixo, faça o download e economize tempo no seu próximo projeto de design de UI. Com esses kits de UI, você poderá criar interfaces de alta qualidade em uma fração do tempo que levaria para projetá-las do zero.

Templates de UI para Web no Figma

Template de Portfólio Responsivo

Baixe este template de portfólio pessoal responsivo para Figma com 24 páginas. Inclui versões para desktop e mobile, compatível com Sketch e Adobe XD.

Responsive Portfolio free figma template

Bricks Wireframing UI Kit

Bricks é uma biblioteca extensa de componentes para Figma, projetada para criar wireframes ou como ponto de partida para seu próprio sistema de design.

Bricks UI Kit Free Figma Web UI Kit Template

Mechanical UI Kit 1.0

Mechanical é um kit de UI gratuito para interfaces de desktop que inclui um conjunto completo de componentes, incluindo botões, entradas, menus, e mais.

Mechanical UI KIT 1.0 Free Figma Web UI Kit Template

Relume Library Figma Kit

Com mais de 800 componentes, páginas e templates, o kit gratuito Relume Library é um download obrigatório para usuários do Figma.

Relume Library Figma Kit Free Figma Web UI Kit Template

Kits de UI para Mobile no Figma

iOS UI Kit para Figma

Este arquivo gratuito do Figma inclui uma variedade de componentes e templates para ajudá-lo a começar rapidamente seu próximo projeto iOS.

iOS UI Kit for Figma Free Figma Web UI Kit Template

Nucleus UI Component Library

Nucleus é uma biblioteca de UI gratuita com 300 componentes e mais de 30 telas. Ela fornece todos os blocos de construção necessários para projetar rapidamente seu próximo aplicativo móvel.

Nucleus UI Component Library free figma ui kit

Onir Mobile App Landing Page Template

Este template é fácil de usar e personalizar, inclui camadas bem organizadas, 15 artboards e três variações de página para criar landing pages móveis.

Onir - Mobile App Landing Page Figma Template free figma ui web layout template

Conclusão

O Figma facilita a criação rápida de protótipos bonitos para aplicativos móveis, aplicativos web, dashboards, sitemaps e qualquer outro projeto de UI que você precise. Com a ajuda desses kits de UI para Figma, você poderá prototipar seus designs mais rapidamente, então não deixe de adicioná-los à sua biblioteca hoje.

  • Como o viés da IA mantêm o poder e prejudica a compreensão

    Análise crítica sobre como as salvaguardas da IA reforçam hierarquias e distorcem a percepção dos usuários.

    Análise crítica sobre como as salvaguardas da IA reforçam hierarquias e distorcem a percepção dos usuários.

    Ler notícia completa
    Imagem abstrata de blocos sobrepostos em tons de preto, cinza e coral, com texto sobre IA na parte inferior.

  • Escalando UX: Modelo de Excelência de Oxford

    Descubra como Oxford escalou UX sem aumentar a equipe, utilizando um Centro de Excelência inovador.

    Descubra como Oxford escalou UX sem aumentar a equipe, utilizando um Centro de Excelência inovador.

    Ler notícia completa
    Três jovens, dois andando e um em cadeira de rodas, usam smartphones próximo a um prédio gótico imponente, sob um céu claro.

  • 40+ Templates Grátis de UI para Figma

    Acelere seu design com mais de 40 templates de UI gratuitos para Figma. Ideal para projetos web e mobile.

    Acelere seu design com mais de 40 templates de UI gratuitos para Figma. Ideal para projetos web e mobile.

    Ler notícia completa
    Interface de usuário com elementos de design, incluindo ícones, paletas de cores e tipografias, distribuídos de forma organizada ao redor de um ícone central colorido.

  • Debugando mais rápido no Chrome DevTools Console

    Desenvolvedores iniciantes em JavaScript e desenvolvimento web geralmente começam a depurar usando o método console.log(). Outros métodos populares incluem console.error() e console.table(). Como a maioria dos desenvolvedores profissionais, usei a abordagem de depuração tradicional por vários anos antes de desejar uma abordagem mais produtiva. Ao experimentar recursos do console do Chrome DevTools, encontrei funcionalidades que […]

    Descubra como usar recursos menos conhecidos do Chrome DevTools Console para aumentar a produtividade no debug.

    Ler notícia completa
    Ícones de tecnologia com um quadrado azul contendo espirais geométricas e um círculo amarelo com as letras

  • V0: Ferramenta Essencial para Prototipagem Ágil

    Você já fez o trabalho de descoberta. Conversou com potenciais clientes, obteve insights e tem algumas ideias de como prosseguir. Seja criando um novo produto ou adicionando uma funcionalidade a um já existente, o próximo passo é o mesmo: construir um protótipo para validar suas suposições. O objetivo não é a perfeição, mas sim a […]

    Descubra como V0 acelera o design de protótipos, reduzindo erros e aumentando a eficiência.

    Ler notícia completa
    Fundo abstrato com ondulações em tons de roxo e a logo

  • AI e a Importância da Autopercepção na Comunicação

    Introdução Com sistemas de IA cada vez mais capazes de conversas inteligentes, surge uma falha filosófica crítica no design e interpretação dessas interações: a falta de compreensão da autopercepção — como indivíduos percebem e interpretam sua própria identidade — na comunicação humano-IA. Paradigmas tradicionais tratam o usuário como receptor passivo de informação, em vez de […]

    Exploramos como a autopercepção influencia a comunicação humano-AI, destacando falhas nos modelos tradicionais de alinhamento.

    Ler notícia completa
    Pessoa segurando um quadro transparente com texto sobre IA contra um céu azul com nuvens.

  • Redesign de UX aumenta resgates em mais de 58%

    Como um designer de UX, acabei discutindo métricas e influenciando decisões que elevaram a taxa de sucesso de um recurso de resgate de 60% para 95%. Se você ainda não explorou a análise de produtos ou UX como designer, espero que esta história mostre o quão poderosa ela pode ser. No meu caso, significou salvar […]

    Descubra como um redesign de UX elevou a taxa de sucesso de resgates de 60% para 95%, melhorando a confiança e satisfação dos usuários.

    Ler notícia completa
    Imagem ilustrativa de uma interface de página da web estilizada em tons de roxo e rosa, destacando ícones de design e codificação sobre fundo suave.

  • Introdução aos Runtimes de Agentes de IA

    O que são Runtimes de Agentes de IA? Os runtimes de agentes de IA são plataformas de infraestrutura que impulsionam agentes de IA—sistemas autônomos de software que podem perceber, raciocinar e agir para alcançar metas empresariais. Pense neles como o ‘sistema operacional’ dos agentes de IA, lidando com execução, orquestração, monitoramento e integração com sistemas […]

    Descubra o que são runtimes de agentes de IA e como eles impulsionam soluções empresariais eficazes.

    Ler notícia completa
    Imagem dividida em duas partes: à esquerda, canteiro de obras com guindaste e materiais de construção; à direita, prédio moderno ao pôr do sol com estrada curva.

  • Guia de Runtimes de Agentes de IA: Escolha o Certo

    No mundo em rápida evolução da inteligência artificial, os agentes de IA estão transformando a operação dos negócios. Esses sistemas inteligentes podem executar tarefas autonomamente, tomar decisões e interagir com usuários — desde simples chatbots até fluxos de trabalho complexos de múltiplos agentes que lidam com análise de dados, atendimento ao cliente ou mesmo desenvolvimento […]

    Descubra como escolher o melhor runtime de agentes de IA para sua empresa em 2025 com comparações e recomendações.

    Ler notícia completa
    Ilustração estilizada dividida em três partes com cores vivas mostrando, da esquerda para a direita, um rosto com olhos grandes e um laptop, um perfil humano com um chip no cérebro, e um gráfico de barras com setas.