Aprender / Guias / Guia de web design
Entenda a diferença entre web design e UX design
Quando se trata de criar produtos, sites ou apps eficazes, o web design e o UX design devem trabalhar juntos como elementos complementares da mesma estratégia, mas há diferenças claras na forma como cada campo aborda o design.
Neste capítulo do nosso guia de web design abordamos as diferenças entre web design e UX design e apontamos as sutis nuances entre os dois. Com uma compreensão clara de como cada função se encaixa na empresa e contribui para seus objetivos, você verá com mais clareza quais tarefas pertencem à equipe de UX design e quais são mais adequadas à equipe de web design.
Use insights sobre a experiência do produto para melhorar seu design
Use o Hotjar para entender como usuários reais experimentam seu produto, site ou app — e depois faça melhorias para eles!
O que é web design?
Web design é o processo de planejar, criar e apresentar do design de front-end de um site. Isso pode abranger vários aspectos, incluindo layout das páginas, produção de conteúdo e design gráfico.
Em uma organização, o objetivo do web design é gerar a estrutura do site e conteúdos esteticamente agradáveis que serão apresentados ao usuário.
Quais são as responsabilidades de um web designer?
Um web designer, profissional que gera conteúdo para um site, é responsável por projetar o layout do site usando vários sistemas criativos, técnicos e relacionados a processos.
Geralmente, os web designers trabalham no desenvolvimento front-end, enquanto um desenvolvedor web se concentra no back-end. Eles lidam com o processo de criação de designs estáticos, como landing pages, criadas especificamente para serem renderizadas e visualizadas em navegadores da web.
O web design é mais do que apenas design gráfico. Esses profissionais precisam considerar a funcionalidade, assim como restrições técnicas, tendências digitais e expectativas dos usuários — que mudam frequentemente — para abordar e resolver desafios do web design.
Em geral, o web design envolve vários componentes visuais, inclusive:
Design gráfico
Conceitualização criativa
Codificação de front-end
Layout das páginas
Produção de conteúdo
Otimização para mecanismos de busca (SEO)
Programação HTML/CSS
No dia a dia, as responsabilidades específicas de um web designer dependem das exigências do cliente, empregador ou projeto. Suas atividades podem envolver a colaboração com estes departamentos:
Equipes de produtos, para projetar o front-end do site, criando elementos visuais e gráficos da marca, e elaborar modelos para agilizar seu trabalho.
Equipes de marketing e suporte ao cliente, para criar conteúdo em texto para páginas e seções específicas do site.
Equipes de desenvolvimento, para codificar o front-end do site em HTML, CSS e JavaScript.
No que diz respeito a entregas, os web designers são responsáveis por projetos como:
Mapas de site
Inventários de conteúdo
Esboços
Mockups de baixa e alta fidelidade
O que é UX design?
Design da user experience (UX ou experiência do usuário) é o processo de criar produtos que são úteis, fáceis e agradáveis de usar para as pessoas. A experiência do usuário considera todas as interações que os usuários têm com o produto ou serviço e depois as otimiza.
Se o web design é uma categoria abrangente, o UX design e o design da user interface (UI ou interface do usuário) são suas especialidades.
Dentro de uma organização, o objetivo do UX design é considerar como a experiência do produto, app ou site faz o usuário se sentir, como é a aparência da interface e quão fácil é para o usuário atingir seus objetivos.
Quais são as responsabilidades de um UX designer?
O trabalho do UX designer começa e termina com o usuário. Ele é responsável por examinar o comportamento dos usuários conforme interagem com o site, serviço ou app e otimizar o design do site para incentivar certos comportamentos, criando uma atmosfera propícia.
A UX envolve iteração, na qual o feedback do usuário é aplicado a mudanças e melhorias incrementais ao longo do tempo. É um processo de criação de ideias e teste de hipóteses com base em inputs de usuários reais.
O UX designer considera como a experiência faz o usuário se sentir e quão fácil é para alcançar o resultado desejado. Para tanto, emprega métodos de UX como pesquisa de usuário, arquitetura de informações, design de interação, testes de usabilidade e estratégia de conteúdo.
Além da estética do produto, serviço ou site, os UX designers focam na utilidade e funcionalidade. Esses profissionais podem ser responsáveis por:
Determinar a arquitetura de informações do produto digital.
Desenvolvimento de estratégias com base em pesquisas e testes com usuários.
Finalizar o modelo de interação correto.
Criar personas por meio de pesquisas com usuários.
Construir protótipos.
Teste de protótipos e experiências de usuário.
Colaboração com UI designers para criar designs atraentes e úteis.
O UX design foca no usuário final para entender seus hábitos, necessidades, comportamentos, motivações e emoções. É um conjunto de habilidades sociais, analíticas e de storytelling que geralmente envolve trabalhar em tarefas como:
Realizar pesquisas de usuário e otimizar sua experiência.
Fazer pesquisas de mercado para estabelecer metas para o site e as páginas.
Compreender a psicologia do usuário.
Entender as especificações do produto.
Criar de personas de usuários.
Projetar wireframes e fluxos de usuário.
O objetivo é descobrir a melhor maneira de o usuário interagir com o produto, concluir tarefas e alcançar o resultado desejado da maneira mais fácil e agradável possível para encantar o cliente. Os UX designers também devem trabalhar em equipe para atender às necessidades dos stakeholders envolvidos. Isso pode envolver a colaboração multifuncional com:
Equipes de produto, para refinar continuamente a experiência do produto, tornando-a mais fácil para os usuários conforme o produto se desenvolve.
Equipes de desenvolvimento, para implementar alterações validadas e otimizações que melhoram a user experience.
Marketing, suporte, design e outras equipes, para compartilhar dados e feedback do usuário, colaborar em grandes mudanças de UX design e manter outras equipes informadas.
Embora precisem se adaptar a necessidades comerciais ou de marketing, os UX designers devem estar sempre atentos para não romper a conexão central com seus usuários e suas necessidades, realizando projetos como:
Entrevistas e pesquisas com usuários.
Personas de usuários.
Mapas da jornada do usuário.
Cenários de usuário.
Relatórios analíticos.
Esboços.
Wireframes e protótipos.
Dica: pratique UX design obtendo feedback de usuários reais.
Para criar protótipos e iterar soluções de design, é preciso entender profundamente o problema e as pessoas para quem você está projetando.
Converse com seus usuários, peça que falem sobre seus problemas e experiências. Depois use esse feedback direto para descobrir as melhores maneiras de interpretar e usar essas informações para possíveis otimizações.
Use o widget de feedback do Hotjar para coletar insights dos usuários em escala e com contexto. Os usuários podem:
Avaliar seu nível de satisfação.
Descrever sua experiência ao usar certas páginas e seus elementos (ex. imagens e descrições de produtos, botões, títulos, página de checkout).
Fazer uma captura de tela de um elemento específico da página.
Fornecer contexto e detalhes.
Um widget de feedback do Hotjar em ação
O que o web design e o UX design têm em comum?
O design de um produto, serviço ou site não inclui apenas a aparência, mas também seu funcionamento. Além dos elementos básicos de branding e web design que o tornam visualmente atraente e convincente, um produto deve ser sempre fácil de usar.
Aqui estão alguns aspectos do web design que também podem ser encontrados no UX design, para ilustrar por que tanto a aparência quanto a funcionalidade do produto desempenham papéis importantes em seu sucesso.
Afinidade com a solução de problemas
Tanto o web design quanto o UX design usam a solução de problemas como um mecanismo para atingir objetivos específicos.
Os web designers procuram resolver problemas para seus clientes, empregadores ou até mesmo clientes. Após identificar o problema, eles projetam uma solução para a web e trabalham com outras equipes para desenvolver e testar o site antes de lançá-lo. Em seguida, coletam feedback do usuário e continuam a reiterar o design depois que o site é lançado.
Os UX designers buscam resolver problemas para os usuários. É também um processo iterativo de solução de problemas que começa com a pesquisa de usuários — visando conhecer usuários potenciais, quais são seus problemas e como resolvê-los. Depois disso, os designers de UX geralmente usam uma abordagem como o design thinking para criar uma solução que atenda às principais necessidades dos usuários e apresentam um protótipo aos usuários para testar sua validade ou usabilidade.
Consideração pela jornada do usuário
Tanto os web designers quanto os UX designers precisam considerar a jornada do usuário ao criar e desenvolver o design do produto.
Dependendo do projeto, cliente ou empregador, cada uma dessas funções pode ser responsável por diferentes aspectos do fluxo do usuário. Enquanto o web design trata da aparência do site, o UX design considera como será a experiência do usuário com elementos específicos.
Dica: use pesquisas para entender a jornada do usuário, sem interrompê-la.
As pesquisas no site geralmente aparecem ou deslizam da borda da página com 1-3 perguntas abertas. Você pode acionar pesquisas no site que apareçam somente em algumas páginas ou após uma determinada ação, o que as torna perfeitas para coletar feedback sobre elementos específicos do seu produto.
Já as pesquisas externas podem ser colocadas numa página independente e direcionadas a segmentos de usuários para conhecer sua experiência detalhadamente. Use pesquisas externas para fazer uma longa lista de perguntas abertas que abranjam toda a user experience, para entender a perspectiva do usuário nas suas próprias palavras.
Exemplos de perguntas abertas para pesquisas
Criatividade baseada no design emocional
Design emocional — o conceito de criar designs que evocam emoções que resultam em experiências positivas para o usuário — é uma parte essencial do web e UX design.
Os web designers criam designs que provocam emoções nos usuários com elementos de design visual, como fontes, imagens e tipografia. Considerando que grande parte da tomada de decisões vem da emoção e do instinto, faz sentido que o design do site possa incentivar comportamentos que levem a mais conversões e a uma maior taxa de retenção.
Os UX designers também buscam evocar emoções nos usuários durante toda a experiência de uso do produto. Eles também se baseiam muito nos princípios do design gráfico — como criar um fluxo visual previsível entre as telas e colocar CTAs nos pontos certos, além de levar em conta outras questões, como interatividade e timing.
Quais são as diferenças entre web design e UX design?
Web design e UX design não são intercambiáveis, e há diferenças significativas entre os dois. Estes três princípios de web design versus UX design mostram como cada área aborda questões essenciais.
Foco principal
No web design, o foco principal é a criação de ótimos sites para a internet. O web designer depende da tecnologia — as últimas versões de linguagens de codificação e navegadores da web — para acompanhar as especificações necessárias para designs modernos, dinâmicos e responsivos, bem como os requisitos mais recentes dos navegadores.
Já o UX design mantém o foco nos usuários. Os UX designers focam na pesquisa para reunir insights e fazer otimizações que atendam às necessidades específicas dos usuários. A tecnologia ainda está envolvida, mas principalmente como um meio para os usuários obterem o que precisam. Seu objetivo final é atender aos requisitos dos usuários, e não dos navegadores da web.
Plataforma
O campo do web design está estritamente vinculado aos navegadores usados em computadores e dispositivos móveis.
Por outro lado, o UX design é independente de plataforma e pode ser aplicado a quase tudo que dependa de interação humana: apps móveis, videogames, softwares de desktop e até mesmo espaços de varejo.
Estratégia
O web design tende a não adotar a estratégia focada nos seres humanos do UX design. Em vez disso, um web designer pode enfatizar mais a estética do site, em vez de como o usuário lida com ele.
Isso fica mais óbvio quando se trata de problemas comuns, como tempos de carregamento lentos. Se uma página demorar muito para carregar, o web designer pode compactar arquivos e ajustar o conteúdo da página para reduzir excessos e economizar largura de banda. O foco do UX designer está na probabilidade do usuário abandonar o site e como melhorar a interatividade e resolver o problema do tempo de carregamento nas páginas mais importantes, antes de resolver o problema em todo o site.
O UX design é definido pela coordenação de melhorias contínuas ao interagir com os usuários, aprender com suas experiências e aplicar insights para criação de um produto melhor. O processo de web design não é tão profundo e, no geral, é menos iterativo.
Como o web design e o UX design funcionam juntos?
Digamos que uma empresa esteja querendo projetar um produto, mas não tenha certeza de quem é seu mercado-alvo — nem como alcançá-lo. Antes de iniciar o design do software ou site, os UX designers e researchers geram personas de usuários e desenvolvem uma estratégia para criar uma experiência que ajude os usuários a atingir seus objetivos no produto.
Conforme o design ganha vida, são criados protótipos interativos ou wireframes estáticos simples. Em seguida, testes de usabilidade pode ser feitos navegando pelo protótipo e decidindo onde fazer avaliações e ajustes na funcionalidade.
Agora, um web designer pode pegar todas as informações disponíveis sobre o produto e a marca — como aparência, sensação e recursos — e criar um site que as exiba de forma concisa e apresente os benefícios do produto.
Isso pode envolver a coleta de capturas de tela, criação de gráficos e ilustrações, geração de conteúdos e textos para o site e incorporação de outros recursos visuais. Sua tarefa também envolve estar atento à aparência e ao comportamento do site em diferentes tamanhos de dispositivos e navegadores, como parte de um design responsivo e adaptável.
Após a conclusão do design e antes do lançamento, é hora de fazer mais testes e tomar decisões sobre o desenvolvimento web, que envolvem como o site será codificado, onde os ativos gráficos e arquivos da web ficarão e como serão entregues.
Próximos passos para acertar em cheio no seu design
A forma como você incorpora o web design e o UX design na sua organização depende das necessidades, objetivos e desafios únicos da sua empresa.
Cada campo aborda problemas diferentes, mas eles podem (e devem) trabalhar juntos para criar um produto melhor para seus usuários.
Use insights sobre a experiência do produto para melhorar seu design
Use o Hotjar para entender como usuários reais experimentam seu produto, site ou app — e depois faça melhorias para eles!
