UX e UI: Diferenças e atribuições de cada área.

UX e UI: você sabe as principais diferenças, ou atribuições de cada uma dessas áreas?

Ao longo da minha carreira (mais de 10 anos trabalhando com design e tecnologia) tive a oportunidade de atuar em vários projetos exercendo atividades em uma, ou em ambas áreas simultaneamente. Quando isso acontece, o profissional é conhecido como Designer UI/UX, ou híbrido.

Porém, ainda hoje, existe muita confusão sobre as principais diferenças nessas duas áreas. Quais os focos e limites de cada uma? E quais as competências que diferenciam os profissionais delas?

As questões são muitas e existem até mesmo dentro das empresas de tecnologia. Por isso hoje vou dar a minha visão pessoal sobre as duas áreas. Vou tentar detalhar aqui, então, as principais diferenças entre UX e UI e os limites de atuação de cada uma. Vamos lá?

UX Design

User Experience Design (UX): Como o nome já diz, trata da área no design que foca em construir a melhor experiência do usuário no produto, sistema ou serviço alvo do projeto.

O trabalho de um UX Designer, na minha opinião, geralmente acontece em duas partes: o Pré-projeto e o Projeto.

UX no pré-projeto 

No pré-projeto, sempre se irá procurar entender a fundo o usuário final. Muitas vezes, uma grande parcela do trabalho é voltada para pesquisa e levantamento de dados (O profissional especializado nesse tipo de pesquisa é o UX Researcher). 

Durante a fase de pesquisa, atua-se então, junto ao cliente para descobrir todas as suas necessidades, definir objetivos e conhecer os usuários finais. Para tanto, o processo pode se apoiar em ferramentas e metodologias como: pesquisas de campo, definição de personas, entrevistas, benchmarks e até design sprints. 

Por fim, se define o escopo do projeto, sempre em conjunto com o cliente e o Product Owner.

design sprint ux
Design Sprint.

UX no projeto 

Depois do pré-projeto (pesquisa e análise), a área de UX se preocupa em definir as regras de negócio que irão nortear o trabalho do arquiteto de software e de todo o back-end da aplicação. Além disso, é quando a área irá definir e desenhar as jornadas dos usuários, os fluxos de telas, os tipos de interações entre usuário e aplicação, e por fim, desenhar wireflows e wireframes de baixa ou alta fidelidade.

Fluxos UX
Fluxos do sistema e wireframes.

Nessa parte, a área vai concretizar todas as funcionalidades de uma aplicação e hierarquizar informações de toda a comunicação, juntamente com o tipo de linguagem a ser usada. Para essa tarefa, o profissional pode ser um especialista em comunicação de sistemas (um UX Writer)Para dar sequência, definem-se então, todos os textos do sistema, feedbacks e toda a régua de comunicação extra-aplicação, como SMSs e e-mails que também serão disparados pelo sistema.

A área de UX é ainda responsável por fazer testes de usabilidade com os usuários, utilizando os wireframes e protótipos de baixa fidelidade, afim de testar e validar os fluxos previamente definidos.

E é nesta etapa que a área de UX finaliza a sua participação. A partir daqui, é a área de UI que deverá retomar o projeto para testes com as telas finais e protótipos de alta fidelidade.

UI Design

Já o User Interface Design (UI), tem atribuições diferentes. Esta é a área responsável por toda a parte visual do sistema, como os elementos visuais, as interações, as animações e/ou as micro-animações da tela.

É na área de UI que se montam os layouts das telas e os protótipos de alta fidelidade. É muito importante lembrar que esses layouts e protótipos sempre levarão em consideração os fluxos e o tipos de experiências previamente definidas pela área de UX.

Será também na etapa de UI que se desenharão todos os elementos, bem como se definirá como cada um deles será apresentado na tela, de maneira que o usuário consiga reconhecê-los e interagir com eles da maneira mais natural possível.

A área também é responsável por criar ícones e ilustrações, definir paleta de cores e toda a identidade visual do sistema/produto planejado.

UI
Ícones, ilustrações e telas finais.

Dessa forma, entende-se que na área de UI existem diversas tarefas específicas para a criação de diferentes interfaces. Por exemplo ilustrações e ícones (responsabilidades do Ilustrador) ou animações como splash screenwalkthroughfeedbacks ou até mesmo micro-animações de interação (responsabilidades do Motion Designer). De mesmo forma, o UI também tem a responsabilidade de fazer pesquisas de elementos visuais, tendências de mercado e benchmarks.

Assim, a área como um todo exige capacidades e conhecimentos sobre: tipografia, contrastes, níveis de visibilidade, diferentes tamanhos e densidades de tela, diferentes style guide das grandes plataformas de softwares, ser perito em Gestalt, além de dominar as heurísticas básicas de HMI (Human Machine Interaction).

Por último, também recai sobre a equipe de UI a responsabilidade de testar as interfaces – a fim de validar responsividade entre devices – e também executar testes de contrate e acessibilidade da aplicação – a fim de verificar a eficácia do sistema por pessoas com dificuldades (usuários de baixa visão ou daltônicos).

Ao final de todo esse processo o UI também é responsável por passar todos os elementos de interface, padrões visuais e de interação, de maneira adequada para os front-endsSó assim os front-ends poderão então, montar a aplicação final de maneira satisfatória.

Enfim, o UI é quem dá vida ao sistema, deixando a aplicação fácil para ser usada, empática e encantadora para o usuário.

Como vimos, cada uma das áreas tem sua particularidade, mas é a união entre UX e UI que faz com que o conjunto de necessidades seja atendido, tornando a experiência do usuário no sistema completa e eficaz.

Obrigado por me acompanhar até aqui!

Autor: Thiago Honorato.

 

Deixe seu comentário

CANAL DE ÉTICA E CONDUTA

O Código de Ética e Conduta da AMcom expressa a forma de atuação da empresa em todos os seus negócios, orientando o modo pelo qual seus colaboradores e terceiros devem se comportar e agir em relação aos temas nele abordados.

Ele reúne as principais diretrizes éticas, normas internas e o dever de conformidade com leis e normas externas, especialmente aquelas voltadas ao combate à corrupção, suborno e lavagem de dinheiro, ao assédio e a toda e qualquer prática irregular.

Ele dispõe, ainda, de regras relacionadas aos comportamentos desejados na empresa e que devem ser adotadas por todos, e estimula que seja utilizado o Canal de Denúncia imediatamente caso haja qualquer violação ao código.