10 tendências de design gráfico para 2024 - InboundCycle
Estética futurista e design técnico são tendências de design gráfico que se unem em 2024. Inspirado no minimalismo e no surgimento de interfaces ...
experiência do usuário
A escolha deste tipo de cores no web design tem um impacto significativo na aparência e na <anchor>experiência do usuário</anchor> devido às associações emocionais e psicológicas. As cores têm a capacidade de influenciar o humor do usuário, além de trazer originalidade e criatividade ao design, tornando o site memorável.
ᐅ O que é UX e UI? Confira 8 dicas sobre web design | InboundCycle
ᐅ O que é UX e UI? Confira 8 dicas sobre web design \| InboundCycle

- [Português](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui)
- [Español](https://www.inboundcycle.com/blog-de-inbound-marketing/trucos-diseño-ux-ui)

Português

- [Quem somos](https://www.inboundcycle.com/pt/agencia-de-inbound-marketing)



- [Empresa](javascript:;)
  - [Quem somos e o que fazemos](https://www.inboundcycle.com/pt/sobre-inboundcycle/agencia-inbound-o-que-fazemos)
  - [Parceiro HubSpot](https://www.inboundcycle.com/pt/hubspot-partners-brasil)

- [Serviços](https://www.inboundcycle.com/pt/nossos-servicos)



- [Inbound Marketing](https://www.inboundcycle.com/pt/servicos-inbound-marketing)
- [Marketing Automation](https://www.inboundcycle.com/pt/agencia-automacao-marketing)
- [Inbound Sales](https://www.inboundcycle.com/pt/inbound-sales)
- [Account Based Marketing](https://www.inboundcycle.com/pt/account-based-marketing)
- [HubSpot](https://www.inboundcycle.com/pt/servicos-contratar-hubspot)

- [Academia](javascript:;)



- [Recursos](javascript:;)
  - [Conceitos-chave do inbound marketing](https://www.inboundcycle.com/pt/academia/dicionario-inbound-marketing)
  - [Centro de recursos](https://www.inboundcycle.com/pt/academia/ebooks-inbound-marketing)
  - [Podcast Líderes de Marketing e Vendas](https://www.inboundcycle.com/pt/podcast-lideres-de-marketing-vendas)
- [Favoritos](javascript:;)
  - [O que é Inbound Marketing?](https://www.inboundcycle.com/pt/inbound-marketing-o-que-e)
  - [Cresça com as vendas inbound](https://www.inboundcycle.com/pt/inbound-sales-o-que-e)
  - [Como funciona o ABM?](https://www.inboundcycle.com/pt/account-based-marketing-o-que-e-como-funciona)
  - [Benefícios da automação de marketing](https://www.inboundcycle.com/pt/automacao-de-marketing-ou-marketing-automation)
  - [A HubSpot é para sua empresa?](https://www.inboundcycle.com/pt/hubspot-o-que-e-como-funciona)

- [Blog](https://www.inboundcycle.com/pt/blog-de-inbound-marketing)



- [Categorias](javascript:;)
  - [Marketing digital](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/marketing-digital)
  - [Atração de tráfego](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/atra%C3%A7%C3%A3o-de-tr%C3%A1fego)
  - [Captação de leads](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/capta%C3%A7%C3%A3o-de-leads)
  - [Social Media](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/social-media)
  - [Inbound Sales](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/inbound-sales)
  - [Automação de marketing](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/automa%C3%A7%C3%A3o-de-marketing)
  - [Análise do site](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/an%C3%A1lise-do-site)
  - [HubSpot](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/hubspot)
- [Conteúdos destacados](javascript:;)
  - [AI marketing: aplicativos de inteligência artificial](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/ai-marketing)
  - [O que é Marketing Outbound?](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-marketing-outbound)
  - [Valores de marca ou brand values: o que são e importância](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/valores-de-marca)
  - [Plano de marketing: o que é e como fazê-lo](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/plano-de-marketing-o-que-e-e-como-fazelo-passo-a-passo)
  - [Como fazer um orçamento de marketing](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/orcamento-de-marketing)
  - [Lead Nurturing: O que é?](https://www.inboundcycle.com/pt/lead-nurturing)

- [Contato](https://www.inboundcycle.com/contacto)



Telefones




[Brasil\
\
\
(+55) 21 96947-7223](tel:(+55)%2021%2096947-7223) [Chile\
\
\
(+56) 2 2405 4544](tel:(+56)%202%202405%204544) [México\
\
\
(+52) 55 5101 4752](tel:(+52)%2055%205101%204752) [Barcelona\
\
\
(+34) 936 116 054](tel:(+34)%20936%20116%20054) [Madrid\
\
\
(+34) 918 318 229](tel:(+34)%20918%20318%20229) [França\
\
\
(+33) 1 89 53 35 86](tel:(+33)%201%2089%2053%2035%2086)




Escritórios




[Brasil\
\
\
R. Visconde de Pirajá 470\
\
sala 701, Ipanema \
\
Rio de Janeiro](https://goo.gl/maps/kJ6ZPgtt2bqfvHot6) [Chile\
\
\
El Coihue 4117, Vitacura\
\
Región Metropolitana](https://goo.gl/maps/e3kfNgob1EZYMuXU8)

México


Paseo de los Tamarindos 90, Piso 21,

Ciudad de México
[Barcelona\
\
\
Plaça Francesc Macià 8-9, 7B\
\
08029, Barcelona](https://goo.gl/maps/gBhDR3c2gR1qhFAX6) [França\
\
\
15 rue de l'Estrapade, \
\
75005 Paris, \
\
França](https://goo.gl/maps/QfGHQ58zZYicKxaN9)

[Formulário de contato](https://www.inboundcycle.com/contacto)


1. [Inicio](https://www.inboundcycle.com/ "Página de inicio")
2. [Blog](https://www.inboundcycle.com/blog-de-inbound-marketing/ "Blog")
3. [Atração de tráfego](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/tag/atração-de-tráfego "Atração de tráfego")
4. O que é UX e UI? Confira 8 dicas sobre web design

# O que é UX e UI? Confira 8 dicas sobre web design

Escrito por [Marc Cerrillo](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/author/marc-cerrillo)

_access\_time_






7 minutos de leitura


_calendar\_today_
14 de Junho, 2022


O que é UX e UI design? O que exatamente esses termos significam? Por que eles são tão importantes para qualquer negócio online? Neste artigo, respondemos a todas essas perguntas. Vamos lá!

## O que é UX e UI?

Primeiro, vamos ver os conceitos e, depois, as diferenças entre eles.

### Definição de experiência do usuário ou UX

Don Norman, cientista cognitivo e arquiteto de experiência do usuário, descreve a experiência do usuário da seguinte maneira: “A experiência do usuário engloba todos os aspectos da interação do usuário final com a empresa, seus serviços e seus produtos”. Portanto, podemos definir UX como um conglomerado de tarefas focadas em otimizar um produto para que seu uso seja eficiente e agradável.

Um exemplo fácil de entender é quando encontramos dois produtos bastante semelhantes em termos de função: como escolher um em detrimento do outro? O design da experiência do usuário (UX) é o que faz você preferir um produto a outro, recomendá-lo, apreciá-lo e escolhê-lo novamente na próxima vez.

Por exemplo, por que você usa o [Canva](https://www.canva.com/pt_br/criar/) em vez do [Desygner](https://desygner.com/pt/)? Você pode gostar mais dos filtros e dos layouts disponíveis ou, simplesmente, achar mais fácil de usar. É provável que haja um motivo para sua preferência, e é isso que os designers de UX buscam entender. Dessa forma, eles poderão oferecer a melhor experiência possível na utilização de um aplicativo. É importante que esse aplicativo seja visto, pelos usuários, como mais simples ou com maior valor agregado do que o da concorrência, e ser escolhido por isso.

Você gosta do que está lendo? Inscreva-se para receber os novos posts e notícias de marketing e vendas no seu e-mail

### Definição de interface do usuário ou UI

Agora que sabemos o que é a experiência do usuário, o que é interface do usuário, ou UI? A resposta mais objetiva seria a de que a UI é o complemento da UX, ou seja, ela se refere a aparência, apresentação e interatividade de um produto.

Dessa forma, podemos entender o UI design como uma prática puramente digital, que leva em consideração todos os elementos visuais e interativos da interface de um produto, incluindo botões, ícones, espaçamento, tipografia, esquemas de cores e [design responsivo](https://brasil.uxdesign.cc/a-import%C3%A2ncia-do-design-responsivo-5f31966323d1).

Seu objetivo é guiar visualmente o usuário pela interface de um produto. Trata-se de criar uma experiência intuitiva que não exija que o usuário pense muito.

O design da interface do usuário traduz os pontos fortes da marca e os recursos visuais para a interface de um produto, garantindo que o design seja consistente, coeso e esteticamente agradável.

### Diferença entre UX e UI design

Podemos resumir as principaisdiferenças entre UX design e UI design na tabela a seguir:

![design-ux-vs-ui](https://www.inboundcycle.com/hs-fs/hubfs/design-ux-vs-ui.png?width=740&name=design-ux-vs-ui.png)

## UX e UI design

Antes de explicar as fases do processo de design, podemos vê-las, de uma forma mais intuitiva, neste gráfico:

![design-thinking-1](https://www.inboundcycle.com/hs-fs/hubfs/design-thinking-1.png?width=517&name=design-thinking-1.png)

### 1\. Empatía

A empatia é a peça central de um processo de design centrado no usuário. Assim, a empatia consiste em entender a forma como alguém faz as coisas, suas necessidades físicas e emocionais, a forma como pensa e, em última análise, conhecer seus comportamentos.

O contato direto com as pessoas revela muito sobre sua forma de pensar e seus valores. Além de entrevistar os indivíduos, você também deve observar como eles se comportam, pois nem sempre as pessoas se comportam da maneira que dizem.

O mais importante nessa fase é processar tudo o que você observou para entender as pessoas e tirar conclusões úteis. Coloque todas as informações em um papel em branco onde você pode começar a fazer conexões: colocar fotos do seu usuário, post-its com citações, mapas de viagens ou experiências... qualquer coisa que capture impressões e informações sobre o usuário.

[![Nova call to action](https://no-cache.hubspot.com/cta/default/136661/54887ac4-8eb0-4e16-8fb4-46744c2591c2.png)](https://cta-redirect.hubspot.com/cta/redirect/136661/54887ac4-8eb0-4e16-8fb4-46744c2591c2)

### 2\. Definição

A definição, no processo de design, consiste em trazer clareza e foco ao espaço de design. É o momento de entender as variadas informações que você coletou sobre a experiência do usuário. Aqui, você deve definir perfeitamente o problema que pretende resolver com um produto ou serviço.

### 3\. Idealização

A idealização consiste na produção de ideias. Ela fornece o combustível e o material inicial para construir protótipos e trazer soluções inovadoras para os usuários.

O processo ideal é buscar o maior número possível de ideias, para poder escolher entre elas, e não simplesmente encontrar uma única solução. Aqui, o consciente e o inconsciente são combinados, os pensamentos racionais e a imaginação. Fazer um brainstorming é um bom exercício nessa fase do processo.

Quando você tiver ideias suficientes, selecione algumas delas para ir para a próxima fase: a criação de protótipos.

### 4\. Protótipo

A fase do protótipo é a produção de artefatos destinados a responder questões que se aproximam da solução final. Nos estágios iniciais, devem ser criados protótipos de baixa resolução que sejam rápidos e baratos de fazer, mas que possam trazer feedback útil do usuário. Dessa forma, você poderá experimentar diferentes soluções a um custo baixo, tanto em termos de tempo como de dinheiro.

É comum começar a fazer esses protótipos com materiais muito baratos, como papel, fita adesiva, objetos de escritório, etc. O principal não é que o design seja bonito, mas que satisfaça a necessidade do usuário.

Nas etapas posteriores, os protótipos que passarem pelos filtros da experiência do usuário serão refinados aos poucos.

### 5\. Teste

Na fase de teste, a opinião dos usuários é solicitada sobre os protótipos que foram criados e você terá outra oportunidade de exercer a empatia com as pessoas para quem está projetando. Esse momento é importante, pois você poderá aprender como os usuários usam o protótipo e as possíveis maneiras de melhorá-lo.

Para aproveitar ao máximo esse processo, não se deve dar muita orientação ao usuário sobre como usar o protótipo, apenas deixá-lo experimentar livremente. Assim, você poderá ver suas reações e verificar se ele consegue utilizar o protótipo intuitivamente e resolver o problema inicial.

[![Nueva llamada a la acción](https://no-cache.hubspot.com/cta/default/136661/194fe81f-4d68-4714-90d9-eb57f2743dab.png)](https://cta-redirect.hubspot.com/cta/redirect/136661/194fe81f-4d68-4714-90d9-eb57f2743dab)

## Dicas para aplicar o design UX-UI

Já identificamos o problema a ser resolvido e temos um protótipo da melhor solução para os usuários. Com isso, projetamos, sem nem perceber, a experiência do usuário UX, e temos a interface do usuário UI.

### Dicas de design de experiência do usuário (UX)

A seguir, vamos ver algumas dicas que você não deve esquecer na hora de aplicar o UX design:

#### 1\. Faça uso das notificações

É muito comum que os usuários se inscrevam em um teste gratuito e depois o esqueçam, o que faz com que eles paguem por uma assinatura que não querem mais ou nunca utilizaram realmente.

Por isso, sua empresa deve manter os usuários informados e permitir que eles cancelem sua assinatura após o período gratuito de avaliação caso eles não a considerem mais útil. Ou, melhor ainda, se você oferecer um teste grátis, não peça o cartão de crédito por ser grátis, certo?

Não tenha medo de informar seus usuários toda vez que eles forem cobrados, pois, se seu produto for satisfatório para eles, eles não hesitarão em pagar pela assinatura e terão um sentimento de confiança em sua marca.

#### 2\. Informar o usuário sobre os possíveis aspectos negativos de sua decisão

A empresa deve deixar muito claro os aspectos negativos de uma possível decisão do usuário, ao invés de deixar que ele se informe a respeito por si só. Os usuários apreciam a honestidade das marcas.

#### 3\. Pare de enviar spam

Respeite o tempo de seus usuários enviando apenas as notificações mais relevantes quando necessário. Também é essencial que você permita que os usuários ajustem suas preferências de notificação de forma rápida e fácil.

E, se a notificação não for respondida após um determinado período, ela não está cumprindo sua função e deve ser desabilitada automaticamente.

#### 4\. Pare de esconder tudo atrás de uma política de privacidade

Se você estiver coletando informações valiosas, deixe isso claro para o usuário, pois ele precisa saber e consentir. Especificar os detalhes apenas em sua política de privacidade não é exatamente uma política honesta da empresa.

#### 5\. Facilite o cancelamento para o usuário

Se o usuário assinar um produto, garanta que seja fácil para que ele o cancele. Ninguém gosta de se inscrever e receber e-mails sobre algo que deixou de se interessar. Não crie empecilhos, pois não compensa ter usuários em seus bancos de dados que não estão interessados ​​em sua marca.

[![Nova call to action](https://no-cache.hubspot.com/cta/default/136661/0dbba784-7b72-4332-8bd7-e3267c4ab03b.png)](https://cta-redirect.hubspot.com/cta/redirect/136661/0dbba784-7b72-4332-8bd7-e3267c4ab03b)

### Dicas de design da interface do usuário (UI)

Vejamos mais algumas dicas técnicas de interface do usuário:

#### 1\. Design para densidade, não pixels

Densidade é o número de pixels por polegada em uma tela, também conhecido como "PPI". A unidade "dp" ou "dip" é a abreviação de "pixel independente de densidade".

Por que usar densidade em vez de pixels? Ao projetar uma interface, é recomendável não projetar para pixels, mas para a densidade de pixels do dispositivo. Isso garante que os elementos sejam dimensionados adequadamente para caber em diferentes tamanhos de dispositivos.

Assim, se você projetar um ativo de botão em, digamos, 200 x 50dp, ele será exibido em 200 x 50px em uma tela de 160 ppi e em 400 x 100px em uma tela de 320ppi, ou seja, o dobro do tamanho do ativo original.

#### 2\. Use incrementos de 8dp

Por que projetar com espaçamento em incrementos de 8dp? A explicação é simples: o número 8 é usado porque ele permite representar corretamente os números ímpares. Ao contrário de 5, por exemplo: em um dispositivo com resolução de 1,5x, os números ímpares não são renderizados corretamente.

Além disso, a grande maioria das dimensões da tela moderna é divisível por 8, facilitando o alinhamento adequado dos layouts nesses dispositivos.

Ao projetar em incrementos de 8 em uma grade de 8 pontos, seus projetos se tornam consistentes. Não é necessário adivinhar o espaçamento e tudo se alinha perfeitamente com as convenções de espaçamento definidos.

#### 3\. Use o peso da cor para estabelecer uma hierarquia

Cada [cor](https://www.agenciacanopus.com.br/site/2016/08/09/influencia-das-cores-na-criacao-no-design/) tem um peso visual, que pode ser usada para criar uma hierarquia entre o conteúdo. Utilizando tons mais claros de cor, é possível atribuir diferentes níveis de importância aos elementos.

Qual é a regra geral para o peso da cor? Se um elemento é mais importante que outro, deve ter maior peso visual. Isso permite que o usuário percorra rapidamente a página e diferencie informações importantes das menos importantes.

A informação maior e mais atraente é aquela que chama a atenção do usuário primeiro, que só então passa para as informações complementares.

#### 4\. O produto/experiência é rápido e eficiente

Para o usuário, velocidade e eficiência são de extrema importância ao interagir com um produto. Não deixe que sua criatividade torne o processo de compra menos eficiente ou mais lento.

Lembre-se que se animações e microinterações acrescentam um tempo desnecessário que não melhora a experiência do usuário. As animações podem aprimorar o design, mas se adicionarem distrações e movimentos desnecessários, não estão cumprindo sua função.

Se você quer saber mais sobre qualquer uma dessas seções, recomendo que visite nossa lista de vídeos sobre o [HubSpot](https://br.hubspot.com/), onde você pode aprender sobre gerenciamento de campanhas, relatórios, painéis, etc.

Espero que você tenha achado este artigo útil e interessante.e você ficou com alguma dúvida fale conosco na seção de comentários!

[![Nueva llamada a la acción](https://no-cache.hubspot.com/cta/default/136661/d0ff3604-a60f-4fbf-8b99-d2f918f634a0.png)](https://cta-redirect.hubspot.com/cta/redirect/136661/d0ff3604-a60f-4fbf-8b99-d2f918f634a0)

_Publicado em 14 de junho de 2020._

_Revisado e validado por [Jalusa Lopes](/pt/blog-de-inbound-marketing/author/jalusa-lopes), Country Manager da InboundCycle Brasil._

![Marc Cerrillo](https://www.inboundcycle.com/hubfs/Marc%20Cerrillo.jpeg)

### Marc Cerrillo

Desenvolvedor Front End na InboundCycle, responsável pelo desenvolvimento de blogs e páginas de clientes, além de fornecer suporte técnico ao time de contas. Formação como técnico sénior em Desenvolvimento de Aplicações Web.

[marccerrillomatas](https://www.linkedin.com/in/marccerrillomatas/)

Compartilhar artigo

- [![Facebook icon](https://www.inboundcycle.com/hubfs/icon-facebook.png)](http://www.facebook.com/share.php?u=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=facebook "Share in Facebook")
- [![Twitter icon](https://www.inboundcycle.com/hubfs/icon-twitter.png)](https://twitter.com/intent/tweet?original_referer=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=twitter&url=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=twitter&source=tweetbutton&text=%E1%90%85+O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design+%7C+InboundCycle: "Share in Twitter")
- [![Linkedin icon](https://www.inboundcycle.com/hubfs/icon-linkedin.png)](http://www.linkedin.com/shareArticle?mini=true&url=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=linkedin "Share in Linkedin")
- [![Pinterest icon](https://www.inboundcycle.com/hubfs/icon-pinterest.png)](http://pinterest.com/pin/create/button/?url=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=pinterest&media= "Share in Pinterest")
- [![Whatsapp icon](https://www.inboundcycle.com/hubfs/icon-whatsapp.png)](https://wa.me/?text=%E1%90%85+O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design+%7C+InboundCycle:%20https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=whatsapp "Share in Whatsapp")
- [![Email icon](https://www.inboundcycle.com/hubfs/icon-email.png)](mailto:?subject=O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design&body=%E1%90%85+O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design+%7C+InboundCycle:%20https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=email "Share in Email")

Compartilhar artigo

- [![Facebook icon](https://www.inboundcycle.com/hubfs/icon-facebook.png)](http://www.facebook.com/share.php?u=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=facebook "Share in Facebook")
- [![Twitter icon](https://www.inboundcycle.com/hubfs/icon-twitter.png)](https://twitter.com/intent/tweet?original_referer=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=twitter&url=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=twitter&source=tweetbutton&text=%E1%90%85+O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design+%7C+InboundCycle: "Share in Twitter")
- [![Linkedin icon](https://www.inboundcycle.com/hubfs/icon-linkedin.png)](http://www.linkedin.com/shareArticle?mini=true&url=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=linkedin "Share in Linkedin")
- [![Pinterest icon](https://www.inboundcycle.com/hubfs/icon-pinterest.png)](http://pinterest.com/pin/create/button/?url=https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=pinterest&media= "Share in Pinterest")
- [![Whatsapp icon](https://www.inboundcycle.com/hubfs/icon-whatsapp.png)](https://wa.me/?text=%E1%90%85+O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design+%7C+InboundCycle:%20https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=whatsapp "Share in Whatsapp")
- [![Email icon](https://www.inboundcycle.com/hubfs/icon-email.png)](mailto:?subject=O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design&body=%E1%90%85+O+que+%26eacute%3B+UX+e+UI%3F+Confira+8+dicas+sobre+web+design+%7C+InboundCycle:%20https://www.inboundcycle.com/pt/blog-de-inbound-marketing/o-que-e-ux-ui&utm_medium=social&utm_source=email "Share in Email")

![Marc Cerrillo](https://www.inboundcycle.com/hubfs/Marc%20Cerrillo.jpeg)

### Marc Cerrillo

Desenvolvedor Front End na InboundCycle, responsável pelo desenvolvimento de blogs e páginas de clientes, além de fornecer suporte técnico ao time de contas. Formação como técnico sénior em Desenvolvimento de Aplicações Web.

[marccerrillomatas](https://www.linkedin.com/in/marccerrillomatas/)

## FAQ sobre O que é UX

- ### Qual a definição de UX?







Don Norman, cientista cognitivo e arquiteto de experiência do usuário, descreve a experiência do usuário da seguinte maneira: “A experiência do usuário engloba todos os aspectos da interação do usuário final com a empresa, seus serviços e seus produtos”. Portanto, podemos definir UX como um conglomerado de tarefas focadas em otimizar um produto para que seu uso seja eficiente e agradável.



Um exemplo fácil de entender é quando encontramos dois produtos bastante semelhantes em termos de função: como escolher um em detrimento do outro? O design da experiência do usuário (UX) é o que faz você preferir um produto a outro, recomendá-lo, apreciá-lo e escolhê-lo novamente na próxima vez.

- ### Qual a diferença entre Ul e UX?






Estes são os pontos principais das diferenças entre UX e UI:



- **Design UX**
  - Relacionado a sensação geral da experiência.
  - Envolve identificar e resolver problemas do usuário.
  - Geralmente é a primeira coisa no processo de desenvolvimento de produto.
  - O designer UX estabelece os fundamentos da jornada do usuário.
  - Aplica-se a qualquer tipo de produto serviço ou experiência
- **Design UI**


  - Relacionado com o funcionamento das interfaces dos produtos.
  - Consiste em criar interfaces intuitivas, esteticamente agradáveis e interativas.
  - O design UI se executa uma vez terminado o design UX.
  - O design UI complemeta com elementos visuais e interativos.
  - É específico para os produtos e experiências digitais.

- ### O que é um designer UX?







O papel do designer de UX é tornar o produto ou serviço útil, agradável e acessível. Enquanto muitas empresas projetam experiências do usuário, o termo é frequentemente associado ao design digital de sites e aplicativos. Como designer de UX, você é responsável pela satisfação geral dos usuários com um produto. Pense em você como o defensor do cliente, sempre procurando maneiras de melhorar sua experiência.

- ### Qual o objetivo da UX?







Melhorar a experiência do usuário ao ter contato com produtos e serviços seja por meios físicos ou digitais (sendo mais usual este último).

- ### Quanto ganha um profissional de UX?







Segundo o site vagas.com, no Brasil o cargo de UX / UI Designer ganha inicialmente R$ 3.012,00 de salário, podendo chegar até R$ 6.169,00. A média para UX / UI Designer no Brasil é de R$ 4.532,00. Normalmente a formação base desse profissional é design gráfico.

- ### Como se tornar um profissional de UX?







1. Conhecer os princípios fundamentais do design (Cor, Equilíbrio, Hierarquia e Tipografia).
2. Treine seu olhar.
3. Leia artigos e livros.
4. Pratique redesenhando projetos.
5. Faça cursos.
6. Crie seu Portfólio e Currículo.
7. Mantenha-se ativo em suas redes.

- ### Qual o papel de um profissional de UI?







Os designers UI usam sinais visuais para ajudar a guiar o usuário pela interface. Criar uma interface visualmente agradável é importante, mas a interface do usuário é mais do que apenas estética. Ao usar um aplicativo, ele deve ser intuitivo: deve saber fazer o que se propõe a fazer sem nenhuma explicação. Você precisa saber onde está em um site ou aplicativo. Você também deve ter uma boa ideia do que acontecerá se você pressionar um botão ou acionar uma chave seletora.


Ver mais

Outros posts que podem te interessar...

Atração de tráfego[O que é Display Marketing e suas vantagens \[+Exemplos\]](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/display-marketing "O que é Display Marketing e suas vantagens [+Exemplos]")


Por **Priscila de Oliveira** en
2 de Setembro, 2024

Atração de tráfego[Figma: o que é, como funciona e para que serve essa ferramenta de UX](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/figma "Figma: o que é, como funciona e para que serve essa ferramenta de UX")


Por **Laura Lázaro** en
12 de Agosto, 2024

Atração de tráfego[Otimização de sites: o que é, como fazer e ferramentas \[+ Guia\]](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/como-otimizar-seu-site-guia "Otimização de sites: o que é, como fazer e ferramentas [+ Guia]")


Por **Denisse Montes de Oca** en
22 de Julho, 2024

Atração de tráfego[O que é e como fazer distribuição de conteúdo em seus projetos](https://www.inboundcycle.com/pt/blog-de-inbound-marketing/distribuicao-de-conteudo "O que é e como fazer distribuição de conteúdo em seus projetos")


Por **Susana Meijomil** en
29 de Maio, 2024

O que você acha? Deixe um comentário!

- [Instagram](https://www.instagram.com/inboundcycle_br/)
- [TikTok](https://www.tiktok.com/@inboundcycle_br)
- [Spotify](https://open.spotify.com/show/2kO0XvrlaXe9iTtDzDXsLW)
- [Apple](https://podcasts.apple.com/br/podcast/l%C3%ADderes-de-marketing-e-vendas/id1697182350)

Os conteúdos publicados pela InboundCycle - Agência de Inbound Marketing são [elaborados e supervisionados por uma equipe de especialistas em marketing e vendas](https://www.inboundcycle.com/pt/politica-editorial) com o objetivo de proporcionar aos usuários informações verídicas e atualizadas do setor. O uso desta página está sujeito aos nossos [termos de uso](https://www.inboundcycle.com/pt/termos-de-uso), nossa [política de privacidade](https://www.inboundcycle.com/pt/politica-de-privacidade) e nossa [política de cookies](https://www.inboundcycle.com/politica-cookies). InboundCycle 2023.

- [Termos de Uso](https://www.inboundcycle.com/pt/termos-de-uso)
- [Política de Privacidade](https://www.inboundcycle.com/pt/politica-de-privacidade)
- [Política de Cookies](https://www.inboundcycle.com/pt/politica-de-cookie)

InboundCycle é cofundadora de:

#### Sobre

- [Quem somos?](https://www.inboundcycle.com/pt/sobre-inboundcycle/agencia-inbound-o-que-fazemos)
- [Parceiros HubSpot](https://www.inboundcycle.com/pt/hubspot-partners-brasil)
- [Fale conosco](https://www.inboundcycle.com/pt/contato)
- [Trabalhe conosco](https://www.inboundcycle.com/trabaja-con-nosotros)

#### Serviços

- [Inbound Marketing](https://www.inboundcycle.com/pt/servicos-inbound-marketing)
- [Marketing Automation](https://www.inboundcycle.com/pt/agencia-automacao-marketing)
- [Inbound Sales](https://www.inboundcycle.com/pt/inbound-sales)
- [Account Based Marketing](https://www.inboundcycle.com/pt/account-based-marketing)
- [HubSpot](https://www.inboundcycle.com/pt/servicos-contratar-hubspot)

#### Legal

- [Termos de Uso](https://www.inboundcycle.com/pt/termos-de-uso)
- [Política de Privacidade](https://www.inboundcycle.com/pt/politica-de-privacidade)
- [Política de Cookies](https://www.inboundcycle.com/pt/politica-de-cookie)

#### Recursos

- [Blog de inbound marketing e vendas](https://www.inboundcycle.com/pt/blog-de-inbound-marketing)
- [Conceitos-chave de Inbound Marketing](https://www.inboundcycle.com/pt/academia/dicionario-inbound-marketing)
- [Ebook: Como lançar uma campanha de Inbound Marketing](https://inboundmarketing.inboundcycle.com/pt/campanha-inbound-marketing)
- [Caso de sucesso: Affinity Vets & Clinics](https://inboundmarketing.inboundcycle.com/pt/caso-de-sucesso-affinity)

#### Headquarters

##### Brasil

+55 21 969467 7223

[info@inboundcycle.com](mailto:info@inboundcycle.com)

##### Chile

+56 2 2405 4544

[info@inboundcycle.com](mailto:info@inboundcycle.com)

##### México

+52 55 5101 4752

[info@inboundcycle.com](mailto:info@inboundcycle.com)

##### Espanha

+34 111 222 333

[info@inboundcycle.com](mailto:info@inboundcycle.com)

##### França

+34 936 116 054

[info@inboundcycle.com](mailto:info@inboundcycle.com)

[![inboundcycle-elite-partners](https://www.inboundcycle.com/hubfs/layout/v3/public/img/inboundcycle-elite-partners.svg)\
\
Elite Partner de HubSpot](https://app.hubspot.com/ecosystem/21022487/marketplace/solutions/inboundcycle)

[![hubspot-academy-1](https://www.inboundcycle.com/hs-fs/hubfs/hubspot-academy-1.png?width=500&height=500&name=hubspot-academy-1.png)\
\
HubSpot Advanced Implementation](https://www.inboundcycle.com/sala-de-prensa/inboundcycle-obtiene-la-hubspot-advanced-implementation-certification)

[![meta-certified-media-planning-professional-1](https://www.inboundcycle.com/hs-fs/hubfs/meta-certified-media-planning-professional-1.png?width=680&height=680&name=meta-certified-media-planning-professional-1.png)\
\
Meta Certified Media Buying Professional](https://www.credly.com/badges/61c04381-2948-4502-a1a0-88618ea352fe?source=linked_in_profile)