SlideShare uma empresa Scribd logo
1 de 19
Baixar para ler offline
UX e UI
Design
O que é?
Quais as diferenças?
Marconi Pacheco - Designer Digital
O que é UX design?
O termo UX Design literalmente quer dizer “User
Experience Design”, ou seja:
Design da experiência do usuário.
UX é toda relação que uma pessoa tem com um
produto ou serviço. Desde o momento em que:
interessou por um produto/serviço;
Pesquisou;
Contou para alguém;
Comprou;
Abriu a embalagem;
Tocou;
Usou.
Qual a importância e para
que serve um UX design?
Com o trabalho do UX as empresas
obtêm diversas vantagens. Dentre elas:
 Fidelização de clientes;
 Mais eficiência na produção de um
serviço/produto;
 Melhora da imagem empresarial;
 Aumento da lucratividade;
 Melhora na experiência de uso dos
usuários;
...entre outros.
Onde o profissional de
UX Design atua?
São vastas, já que UX pode ser aplicado em
qualquer produto ou serviço, desde que tenha
como base interações humanas.
No meio digital podem atuar com:
 Aplicativos e jogos para celulares;
 Tablets;
 Relógios (como Apple Watch);
 Assistentes de voz (como Siri e Alexia);
 TVs digitais;
...entre outros.
...entre outros, a fim de atingir positivamente o maior número de pessoas.
Quais atividades de um UX designer?
Entrevistar usuários e clientes Pesquisar
Organizar informações
Desenhar fluxograma de
navegação
Desenvolver wireframe Desenvolver Protótipos
Fazer testes de usabilidade
UI
Design
UI design quer dizer “User Interface
Design”, em português:
Design de Interface do Usuário.
UI é um intermediário que permite a
realização de uma tarefa. O meio entre o
usuário e o produto, tanto para itens
físicos e digitais.
O UI na área digital visa o desenho dos
componentes e as formas de interação
dentro da usabilidade.
O que é UI Design?
O UI design gera facilidades de uso aos usuários,
ganhando importâncias como:
 Destacar a imagem empresarial;
 Desenvolve layouts atraentes e funcionais;
 Gera alto valor para o público;
 Ajuda a interagir com a interface intuitivamente;
 Gera padrões visuais e interativos;
 Ajuda no aumento das taxas de conversão online.
...entre outros.
Qual a importância e para
que serve um UI design?
...entre outros. Preocupa-se em construir um visual atraente e de fácil interação.
Quais atividades de um UI design?
Tipografia Cores Ícones
Formas Heuristicas de usabilidade
Projetar interfaces gráficas, trabalhando com:
Na área digital as mais usadas são:
 Programas gráficos;
 Programas de edição de imagens;
 Programas de prototipação;
 Style guide (Guia de regras e padrões).
...entre outros.
Quais ferramentas o
UI design geralmente usa?
UX Design
vs
UI Design
UX Designer
Estuda e planeja as experiências e emoções
do usuário ao interagir com a interface.
UI Design
Está conectado com os elementos e a
interface que será utilizada pelo usuário.
Qual a diferença entre
UX e UI design?
UX UI
UX e UI design - diferenças e semelhanças
foco no usuário
emoções do usuário
coleta de dados
relatórios
conteúdo
pesquisa com usuários/clientes
análise dos concorrentes
fatores humanos
personas
fluxogramas - mapa de navegação
wireframe
testes de usabilidade
foco na interface
elementos visuais
desenvolvimento de layouts
componentes gráficos
marca
interatividade e animações
ferramentas gráficos
ícones gráficos
cores, tipografia e formas
interfaces responsivas
Mockups
estilos de guia
usabilidade
arquitetura da informação
interação humano computador (HCI)
heurísticas
Protótipos
UX UI
É inconcebível pensar em um UI Design
projetando sem pensar na experiência do
usuário...
...da mesma maneira não tem como aplicar o
que foi coletado no UX sem ajuda do UI para
torna visível.
UX decide a ordem e a estrutura do conteúdo.
UI comunica a ordem e a estrutura visualmente.
Como UX e UI design
trabalham em conjunto?
Em quais empresas o
UX e UI design trabalham?
Nas áreas digitais, as mais comuns são:
 Agências e escritórios de Design;
 Startups;
 Empresas de consultorias;
 Empresas de TI;
 Empresas de tecnologia;
 Setores que cuidam apenas das suas
interfaces: bancos, universidades,
e-commerces, etc;
...entre outros.
 Design gráfico;
 Desenvolvedor front-end e back-end;
 Profissionais de marketing e comunicação;
 Biblioteconomia;
 Moda;
...entre outras.
Ter noções de UI e UX é imprescindível para
profissionais que trabalham com
desenvolvimento de intefaces digitais.
Quem trabalha na profissão
de UX e UI design?
Considerações finais
Na realidade atual, encontramos designers
que atendem as duas áreas perfeitamente,
isso porque o profissional consegue
executar muitas das partes de ambas as
atividades.
Principais referências
Livros:
Sites:
medium.com/aela
brasil.uxdesign.cc
chiefofdesign.com.br
Introdução e boas práticas em UX Design
(Fabricio Teixeira, 2014);
Design centrado no usuário
(Travis Lowdermilk, 2013)
Obrigado!
Marconi Pacheco
Designer Digital
marconidesenhos@gmail.com
linkedin.com/in/marconipachecobehance.net/marconipacheco
github.com/marconip

Mais conteúdo relacionado

Mais procurados

Aula 6 - Design e Processo de Design de Interfaces de Usuário
Aula 6 - Design e Processo de Design de Interfaces de UsuárioAula 6 - Design e Processo de Design de Interfaces de Usuário
Aula 6 - Design e Processo de Design de Interfaces de UsuárioAndré Constantino da Silva
 
Mini Curso - Design de Interface para Dispositivos Móveis
Mini Curso - Design de Interface para Dispositivos MóveisMini Curso - Design de Interface para Dispositivos Móveis
Mini Curso - Design de Interface para Dispositivos MóveisJane Vita
 
Aula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no UsuárioAula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no UsuárioErico Fileno
 
Interação Homem Computador Aula 02
Interação Homem Computador Aula 02Interação Homem Computador Aula 02
Interação Homem Computador Aula 02igoroliveiracosta
 
UX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do UsuárioUX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do UsuárioRenato Melo
 
Ihc2016.2 aula 1 introdução a ihc
Ihc2016.2 aula 1 introdução a ihcIhc2016.2 aula 1 introdução a ihc
Ihc2016.2 aula 1 introdução a ihcTicianne Darin
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front endandreluizlc
 
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHCAula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHCAndré Constantino da Silva
 
Prototipação de software
Prototipação de softwarePrototipação de software
Prototipação de softwareleopp
 
Interação Humano Computador 1
Interação Humano Computador 1Interação Humano Computador 1
Interação Humano Computador 1Robson Santos
 
Pensando em UX / UI com o material design
Pensando em UX / UI com o material designPensando em UX / UI com o material design
Pensando em UX / UI com o material designThiago Marques
 
Experiência do usuário
Experiência do usuárioExperiência do usuário
Experiência do usuárioVictor Rubens
 
Workshop • UX design •
Workshop • UX design •  Workshop • UX design •
Workshop • UX design • Suzi Sarmento
 
Mapeamento de jornadas no design de experiências
Mapeamento de jornadas no design de experiênciasMapeamento de jornadas no design de experiências
Mapeamento de jornadas no design de experiênciasUTFPR
 
Introdução a engenharia de software aula 01
Introdução a engenharia de software   aula 01Introdução a engenharia de software   aula 01
Introdução a engenharia de software aula 01Franklin Matos Correia
 

Mais procurados (20)

Aula 6 - Design e Processo de Design de Interfaces de Usuário
Aula 6 - Design e Processo de Design de Interfaces de UsuárioAula 6 - Design e Processo de Design de Interfaces de Usuário
Aula 6 - Design e Processo de Design de Interfaces de Usuário
 
Mini Curso - Design de Interface para Dispositivos Móveis
Mini Curso - Design de Interface para Dispositivos MóveisMini Curso - Design de Interface para Dispositivos Móveis
Mini Curso - Design de Interface para Dispositivos Móveis
 
Aula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no UsuárioAula 1 - Minicurso sobre Design Centrado no Usuário
Aula 1 - Minicurso sobre Design Centrado no Usuário
 
Interação Homem Computador Aula 02
Interação Homem Computador Aula 02Interação Homem Computador Aula 02
Interação Homem Computador Aula 02
 
UX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do UsuárioUX e UI - Experiência e Interface do Usuário
UX e UI - Experiência e Interface do Usuário
 
Ihc2016.2 aula 1 introdução a ihc
Ihc2016.2 aula 1 introdução a ihcIhc2016.2 aula 1 introdução a ihc
Ihc2016.2 aula 1 introdução a ihc
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front end
 
Testes de Usabilidade
Testes de UsabilidadeTestes de Usabilidade
Testes de Usabilidade
 
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHCAula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
Aula 5 - Fatores Humanos - Parte 2 - Disciplina de IHC
 
Prototipação de software
Prototipação de softwarePrototipação de software
Prototipação de software
 
Interação Humano Computador 1
Interação Humano Computador 1Interação Humano Computador 1
Interação Humano Computador 1
 
Interação Humano-Computador (IHC)
Interação Humano-Computador (IHC)Interação Humano-Computador (IHC)
Interação Humano-Computador (IHC)
 
UX Research
UX ResearchUX Research
UX Research
 
Pensando em UX / UI com o material design
Pensando em UX / UI com o material designPensando em UX / UI com o material design
Pensando em UX / UI com o material design
 
Experiência do usuário
Experiência do usuárioExperiência do usuário
Experiência do usuário
 
Personas e Cenários
Personas e CenáriosPersonas e Cenários
Personas e Cenários
 
Workshop • UX design •
Workshop • UX design •  Workshop • UX design •
Workshop • UX design •
 
Mapeamento de jornadas no design de experiências
Mapeamento de jornadas no design de experiênciasMapeamento de jornadas no design de experiências
Mapeamento de jornadas no design de experiências
 
Introdução a engenharia de software aula 01
Introdução a engenharia de software   aula 01Introdução a engenharia de software   aula 01
Introdução a engenharia de software aula 01
 
Ui vs UX design
Ui vs UX designUi vs UX design
Ui vs UX design
 

Semelhante a UX e UI Design - O que é? Quais as diferenças?

Design Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface DigitalDesign Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface DigitalMarconi Pacheco
 
Palestra UX e AI
Palestra UX e AIPalestra UX e AI
Palestra UX e AIklaibert
 
Manuela Quaresma | UX Design(er): mercado e formação
Manuela Quaresma | UX Design(er): mercado e formaçãoManuela Quaresma | UX Design(er): mercado e formação
Manuela Quaresma | UX Design(er): mercado e formaçãoUXPA-Rio
 
Por que você vai se apaixonar por design e UX?!
Por que você vai se apaixonar por design e UX?!Por que você vai se apaixonar por design e UX?!
Por que você vai se apaixonar por design e UX?!Priscilla Albuquerque
 
On UX and UX carrer - Intel Software Day 2013 - portuguese
On UX and UX carrer - Intel Software Day 2013 - portugueseOn UX and UX carrer - Intel Software Day 2013 - portuguese
On UX and UX carrer - Intel Software Day 2013 - portugueseAna Luísa Ponsirenas
 
Experiência do Usuário: uma introdução
Experiência do Usuário: uma introduçãoExperiência do Usuário: uma introdução
Experiência do Usuário: uma introduçãoJuliana Dorneles
 
UX Design para Desenvolvedores
UX Design para DesenvolvedoresUX Design para Desenvolvedores
UX Design para DesenvolvedoresAnderson Façanha
 
TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...
TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...
TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...tdc-globalcode
 
Web design com software livre
Web design com software livreWeb design com software livre
Web design com software livretony peixe
 
Palestra - UI/UX na Prática - Seintegra 2019
Palestra - UI/UX na Prática - Seintegra 2019 Palestra - UI/UX na Prática - Seintegra 2019
Palestra - UI/UX na Prática - Seintegra 2019 Melissa de Britto
 
Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)DesignCarminatti
 
UX – User Experience
UX – User ExperienceUX – User Experience
UX – User ExperienceAndré Luís
 
User Experience: O que sua empresa pode ganhar com isso.
User Experience: O que sua empresa pode ganhar com isso.User Experience: O que sua empresa pode ganhar com isso.
User Experience: O que sua empresa pode ganhar com isso.Catarinas Design de Interação
 
Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...
Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...
Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...Renata Tonezi
 
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.Impacta Eventos
 

Semelhante a UX e UI Design - O que é? Quais as diferenças? (20)

User experience
User experienceUser experience
User experience
 
Design Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface DigitalDesign Centrado no Usuário para Interface Digital
Design Centrado no Usuário para Interface Digital
 
Palestra UX e AI
Palestra UX e AIPalestra UX e AI
Palestra UX e AI
 
Manuela Quaresma | UX Design(er): mercado e formação
Manuela Quaresma | UX Design(er): mercado e formaçãoManuela Quaresma | UX Design(er): mercado e formação
Manuela Quaresma | UX Design(er): mercado e formação
 
Palestra UX Etec - 22_04
Palestra UX Etec - 22_04Palestra UX Etec - 22_04
Palestra UX Etec - 22_04
 
Por que você vai se apaixonar por design e UX?!
Por que você vai se apaixonar por design e UX?!Por que você vai se apaixonar por design e UX?!
Por que você vai se apaixonar por design e UX?!
 
On UX and UX carrer - Intel Software Day 2013 - portuguese
On UX and UX carrer - Intel Software Day 2013 - portugueseOn UX and UX carrer - Intel Software Day 2013 - portuguese
On UX and UX carrer - Intel Software Day 2013 - portuguese
 
Experiência do Usuário: uma introdução
Experiência do Usuário: uma introduçãoExperiência do Usuário: uma introdução
Experiência do Usuário: uma introdução
 
UX Design para Desenvolvedores
UX Design para DesenvolvedoresUX Design para Desenvolvedores
UX Design para Desenvolvedores
 
TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...
TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...
TDC2017 | São Paulo - Trilha UX Design Coaching I How we figured out we had a...
 
Um quase papo sobre UX Writing
Um quase papo sobre UX WritingUm quase papo sobre UX Writing
Um quase papo sobre UX Writing
 
Web design com software livre
Web design com software livreWeb design com software livre
Web design com software livre
 
Palestra - UI/UX na Prática - Seintegra 2019
Palestra - UI/UX na Prática - Seintegra 2019 Palestra - UI/UX na Prática - Seintegra 2019
Palestra - UI/UX na Prática - Seintegra 2019
 
Design de interface
Design de interfaceDesign de interface
Design de interface
 
Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)Design de interface (trabalho acadêmico)
Design de interface (trabalho acadêmico)
 
UX – User Experience
UX – User ExperienceUX – User Experience
UX – User Experience
 
User Experience: O que sua empresa pode ganhar com isso.
User Experience: O que sua empresa pode ganhar com isso.User Experience: O que sua empresa pode ganhar com isso.
User Experience: O que sua empresa pode ganhar com isso.
 
Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...
Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...
Chatbots e UX: Como os chatbots podem ajudar a entender o que as pessoas real...
 
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
Os desafios do Arquiteto de Informação como UX Expert: Criatividade e Inovação.
 
Seminario
SeminarioSeminario
Seminario
 

Mais de Marconi Pacheco

Teste de Usabilidade Como planejar e executar
Teste de Usabilidade Como planejar e executarTeste de Usabilidade Como planejar e executar
Teste de Usabilidade Como planejar e executarMarconi Pacheco
 
7 Dicas para Criação de layouts para sites em WordPress
7 Dicas para Criação de layouts para sites em WordPress7 Dicas para Criação de layouts para sites em WordPress
7 Dicas para Criação de layouts para sites em WordPressMarconi Pacheco
 
Apresentação TCC - Marconi Pacheco 2010
Apresentação TCC - Marconi Pacheco 2010Apresentação TCC - Marconi Pacheco 2010
Apresentação TCC - Marconi Pacheco 2010Marconi Pacheco
 
Maturidade UX nas Empresas
Maturidade UX nas EmpresasMaturidade UX nas Empresas
Maturidade UX nas EmpresasMarconi Pacheco
 
Bootstrap praticas mais usadas
Bootstrap praticas mais usadas Bootstrap praticas mais usadas
Bootstrap praticas mais usadas Marconi Pacheco
 
A obra do espirito santo na igreja
A obra do espirito santo na igrejaA obra do espirito santo na igreja
A obra do espirito santo na igrejaMarconi Pacheco
 
Simplificando o design digital
Simplificando o design digitalSimplificando o design digital
Simplificando o design digitalMarconi Pacheco
 
Qual a importância de ir à igreja
Qual a importância de ir à igrejaQual a importância de ir à igreja
Qual a importância de ir à igrejaMarconi Pacheco
 
Evolução do design digital
Evolução do design digitalEvolução do design digital
Evolução do design digitalMarconi Pacheco
 
Profissão Desenhista / Ilustrador
Profissão Desenhista / IlustradorProfissão Desenhista / Ilustrador
Profissão Desenhista / IlustradorMarconi Pacheco
 
Apresentando SEO Otimização de Sites
Apresentando SEO Otimização de SitesApresentando SEO Otimização de Sites
Apresentando SEO Otimização de SitesMarconi Pacheco
 
Usabilidade para Websites
Usabilidade para WebsitesUsabilidade para Websites
Usabilidade para WebsitesMarconi Pacheco
 
Arquitetura de informação para Interface Digital
Arquitetura de informação para Interface DigitalArquitetura de informação para Interface Digital
Arquitetura de informação para Interface DigitalMarconi Pacheco
 
Site responsivo vantagens e desvantagens
Site responsivo vantagens e desvantagensSite responsivo vantagens e desvantagens
Site responsivo vantagens e desvantagensMarconi Pacheco
 
Restaurando a Qualidade de Vida - Filipenses 4:4-8
Restaurando a Qualidade de Vida - Filipenses 4:4-8Restaurando a Qualidade de Vida - Filipenses 4:4-8
Restaurando a Qualidade de Vida - Filipenses 4:4-8Marconi Pacheco
 
O Poder da Língua - Tiago 3.1-12
O Poder da Língua - Tiago 3.1-12O Poder da Língua - Tiago 3.1-12
O Poder da Língua - Tiago 3.1-12Marconi Pacheco
 
Web Designer - Principais Conhecimentos Principais Funções
Web Designer - Principais Conhecimentos Principais FunçõesWeb Designer - Principais Conhecimentos Principais Funções
Web Designer - Principais Conhecimentos Principais FunçõesMarconi Pacheco
 

Mais de Marconi Pacheco (19)

Teste de Usabilidade Como planejar e executar
Teste de Usabilidade Como planejar e executarTeste de Usabilidade Como planejar e executar
Teste de Usabilidade Como planejar e executar
 
7 Dicas para Criação de layouts para sites em WordPress
7 Dicas para Criação de layouts para sites em WordPress7 Dicas para Criação de layouts para sites em WordPress
7 Dicas para Criação de layouts para sites em WordPress
 
Apresentação TCC - Marconi Pacheco 2010
Apresentação TCC - Marconi Pacheco 2010Apresentação TCC - Marconi Pacheco 2010
Apresentação TCC - Marconi Pacheco 2010
 
Maturidade UX nas Empresas
Maturidade UX nas EmpresasMaturidade UX nas Empresas
Maturidade UX nas Empresas
 
style guide ui
style guide uistyle guide ui
style guide ui
 
Bootstrap praticas mais usadas
Bootstrap praticas mais usadas Bootstrap praticas mais usadas
Bootstrap praticas mais usadas
 
A obra do espirito santo na igreja
A obra do espirito santo na igrejaA obra do espirito santo na igreja
A obra do espirito santo na igreja
 
Simplificando o design digital
Simplificando o design digitalSimplificando o design digital
Simplificando o design digital
 
Qual a importância de ir à igreja
Qual a importância de ir à igrejaQual a importância de ir à igreja
Qual a importância de ir à igreja
 
Evolução do design digital
Evolução do design digitalEvolução do design digital
Evolução do design digital
 
Profissão Desenhista / Ilustrador
Profissão Desenhista / IlustradorProfissão Desenhista / Ilustrador
Profissão Desenhista / Ilustrador
 
Apresentando SEO Otimização de Sites
Apresentando SEO Otimização de SitesApresentando SEO Otimização de Sites
Apresentando SEO Otimização de Sites
 
Usabilidade para Websites
Usabilidade para WebsitesUsabilidade para Websites
Usabilidade para Websites
 
Arquitetura de informação para Interface Digital
Arquitetura de informação para Interface DigitalArquitetura de informação para Interface Digital
Arquitetura de informação para Interface Digital
 
Site responsivo vantagens e desvantagens
Site responsivo vantagens e desvantagensSite responsivo vantagens e desvantagens
Site responsivo vantagens e desvantagens
 
Restaurando a Qualidade de Vida - Filipenses 4:4-8
Restaurando a Qualidade de Vida - Filipenses 4:4-8Restaurando a Qualidade de Vida - Filipenses 4:4-8
Restaurando a Qualidade de Vida - Filipenses 4:4-8
 
O Poder da Língua - Tiago 3.1-12
O Poder da Língua - Tiago 3.1-12O Poder da Língua - Tiago 3.1-12
O Poder da Língua - Tiago 3.1-12
 
Profissão Front-end
Profissão Front-endProfissão Front-end
Profissão Front-end
 
Web Designer - Principais Conhecimentos Principais Funções
Web Designer - Principais Conhecimentos Principais FunçõesWeb Designer - Principais Conhecimentos Principais Funções
Web Designer - Principais Conhecimentos Principais Funções
 

UX e UI Design - O que é? Quais as diferenças?

  • 1. UX e UI Design O que é? Quais as diferenças? Marconi Pacheco - Designer Digital
  • 2. O que é UX design? O termo UX Design literalmente quer dizer “User Experience Design”, ou seja: Design da experiência do usuário. UX é toda relação que uma pessoa tem com um produto ou serviço. Desde o momento em que: interessou por um produto/serviço; Pesquisou; Contou para alguém; Comprou; Abriu a embalagem; Tocou; Usou.
  • 3. Qual a importância e para que serve um UX design? Com o trabalho do UX as empresas obtêm diversas vantagens. Dentre elas:  Fidelização de clientes;  Mais eficiência na produção de um serviço/produto;  Melhora da imagem empresarial;  Aumento da lucratividade;  Melhora na experiência de uso dos usuários; ...entre outros.
  • 4. Onde o profissional de UX Design atua? São vastas, já que UX pode ser aplicado em qualquer produto ou serviço, desde que tenha como base interações humanas. No meio digital podem atuar com:  Aplicativos e jogos para celulares;  Tablets;  Relógios (como Apple Watch);  Assistentes de voz (como Siri e Alexia);  TVs digitais; ...entre outros.
  • 5. ...entre outros, a fim de atingir positivamente o maior número de pessoas. Quais atividades de um UX designer? Entrevistar usuários e clientes Pesquisar Organizar informações Desenhar fluxograma de navegação Desenvolver wireframe Desenvolver Protótipos Fazer testes de usabilidade
  • 7. UI design quer dizer “User Interface Design”, em português: Design de Interface do Usuário. UI é um intermediário que permite a realização de uma tarefa. O meio entre o usuário e o produto, tanto para itens físicos e digitais. O UI na área digital visa o desenho dos componentes e as formas de interação dentro da usabilidade. O que é UI Design?
  • 8. O UI design gera facilidades de uso aos usuários, ganhando importâncias como:  Destacar a imagem empresarial;  Desenvolve layouts atraentes e funcionais;  Gera alto valor para o público;  Ajuda a interagir com a interface intuitivamente;  Gera padrões visuais e interativos;  Ajuda no aumento das taxas de conversão online. ...entre outros. Qual a importância e para que serve um UI design?
  • 9. ...entre outros. Preocupa-se em construir um visual atraente e de fácil interação. Quais atividades de um UI design? Tipografia Cores Ícones Formas Heuristicas de usabilidade Projetar interfaces gráficas, trabalhando com:
  • 10. Na área digital as mais usadas são:  Programas gráficos;  Programas de edição de imagens;  Programas de prototipação;  Style guide (Guia de regras e padrões). ...entre outros. Quais ferramentas o UI design geralmente usa?
  • 12. UX Designer Estuda e planeja as experiências e emoções do usuário ao interagir com a interface. UI Design Está conectado com os elementos e a interface que será utilizada pelo usuário. Qual a diferença entre UX e UI design? UX UI
  • 13. UX e UI design - diferenças e semelhanças foco no usuário emoções do usuário coleta de dados relatórios conteúdo pesquisa com usuários/clientes análise dos concorrentes fatores humanos personas fluxogramas - mapa de navegação wireframe testes de usabilidade foco na interface elementos visuais desenvolvimento de layouts componentes gráficos marca interatividade e animações ferramentas gráficos ícones gráficos cores, tipografia e formas interfaces responsivas Mockups estilos de guia usabilidade arquitetura da informação interação humano computador (HCI) heurísticas Protótipos UX UI
  • 14. É inconcebível pensar em um UI Design projetando sem pensar na experiência do usuário... ...da mesma maneira não tem como aplicar o que foi coletado no UX sem ajuda do UI para torna visível. UX decide a ordem e a estrutura do conteúdo. UI comunica a ordem e a estrutura visualmente. Como UX e UI design trabalham em conjunto?
  • 15. Em quais empresas o UX e UI design trabalham? Nas áreas digitais, as mais comuns são:  Agências e escritórios de Design;  Startups;  Empresas de consultorias;  Empresas de TI;  Empresas de tecnologia;  Setores que cuidam apenas das suas interfaces: bancos, universidades, e-commerces, etc; ...entre outros.
  • 16.  Design gráfico;  Desenvolvedor front-end e back-end;  Profissionais de marketing e comunicação;  Biblioteconomia;  Moda; ...entre outras. Ter noções de UI e UX é imprescindível para profissionais que trabalham com desenvolvimento de intefaces digitais. Quem trabalha na profissão de UX e UI design?
  • 17. Considerações finais Na realidade atual, encontramos designers que atendem as duas áreas perfeitamente, isso porque o profissional consegue executar muitas das partes de ambas as atividades.
  • 18. Principais referências Livros: Sites: medium.com/aela brasil.uxdesign.cc chiefofdesign.com.br Introdução e boas práticas em UX Design (Fabricio Teixeira, 2014); Design centrado no usuário (Travis Lowdermilk, 2013)