Review: Ux para Web Designers

1ª Camada:

01 - Necessidades do usuário. Qual a necessidade do usuário que vai ser atendida nesse sistema?

(Tarefas/necessidades do usuário, quantas?) (Em qual contexto o usuário vai utilizar sua ferramenta? Se ele precisa usar na fila do banco o site precisa ser responvivo/mobile)

02 - Objetivos do sistema. Qual o objetivo do sistema, o que o sistema vai oferecer para que o usuário consiga atingir seu objetivo?

2ª Camada:

01 - Requisitos de conteúdo. Quais são os requisitos de conteúdo?

(Tudo aquilo que o sistema vai ter, com base na necessidade do usuário e objetivos do sistema já estabelecidos)

02 - Especificações Funcionais. Quais são as especificações funcionais?

(O que da para fazer no sistema, o que vai ter de função, quais funcionalidades vai ter para que o usuário consiga atingir seu objetivo?)

3ª Camada:

01 - Arquitetura da informação. (organizar todas as informações anteriores em 4 grandes sistemas)

Sistema de organização.
Sistema de Rotulação.
Sistema de Navegação.
Sistema de Busca

02 - Design de interação. Como o usuário vai interagir com o sistema?

(Em tela touch, com o mouse, comando de voz, gestos, ele vai estar na rua com celular, na fila de um banco com celular, no ônibus com um tablet?)

4ª Camada:

01 - Design da informação. Como exibir a informação, da melhor forma possível, de acordo com as necessidades e objetivos do usuário?

(Aqui começa a surgir o wireframe - http://www.axure.com/ )

Wireframe de baixíssima fidelidade
Wireframe de baixa fidelidade
Wireframe de média fidelidade
Wireframe de alta fidelidade

02 - Design da navegação.

( 50% definido com base nas definições do ‘Sistema de Navegação” na 3ª Camada tópico ‘C’ e 50% já visual.)

03 - Design da interface.

( 50% já é o próprio wireframe e 50% início do visual final do sistema.)

5ª Camada:

01 - Design visual.

(A cara que o sistema vai ter o design final.)

O passo a passo de um projeto de UX

Os 3 pilares de UX

(Os 3 pilares são um resumo das 5 camadas anteriores.)

Problema	Solução	Interação
A etapa em que vai descobrir qual é o real problema do usuário. Lá no fundo, qual é o problema que precisa ser resolvido? Isso com base em: Pesquisas e entrevistas com o usuário	Descoberto qual o problema que precisa ser resolvido é preciso estabelecer e criar a melhor solução para o problema identificado.	É a maneira com que o usuário vai interagir com isso. Aqui entra a usabilidade, por exemplo.

Problema

Solução

Interação

A etapa em que vai descobrir qual é o real problema do usuário. Lá no fundo, qual é o problema que precisa ser resolvido? Isso com base em: Pesquisas e entrevistas com o usuário

Descoberto qual o problema que precisa ser resolvido é preciso estabelecer e criar a melhor solução para o problema identificado.

É a maneira com que o usuário vai interagir com isso. Aqui entra a usabilidade, por exemplo.

Passo 1 - Descobrir o Problema

Passo difícil, pois é preciso descobrir e balancear o problema tanto na visão do usuário quanto na visão da empresa. O problema precisa estar coerente na visão de todos envolvidos no projeto.

Na visão da Empresa	Na visão do Usuário
	Personas. Uma pessoa fictícia mas embasada no perfil real do público alvo.
Quem são os clientes dessa empresa?	Entrevistas com usuários
O que a empresa vende?	Testes de usabilidade exploratórios, com produtos concorrentes já existentes. Para entender o problema do usuário.
Como essa empresa ganha dinehiro?	Observação. Observar o usuário no cotidiano dele, shadow, simplesmente observar como ele reage em determinada situação
Quais os objetivos de longo prazo?	Análise de pesquisas anteriores.
Quais os objetivos do projeto?	Análise de dados sobre o perfil do público.
Como a empresa pretende rentabilizar esse projeto?	Aplicações de questionários.

Na visão da Empresa

Na visão do Usuário

Personas. Uma pessoa fictícia mas embasada no perfil real do público alvo.

Quem são os clientes dessa empresa?

Entrevistas com usuários

O que a empresa vende?

Testes de usabilidade exploratórios, com produtos concorrentes já existentes. Para entender o problema do usuário.

Como essa empresa ganha dinehiro?

Observação. Observar o usuário no cotidiano dele, shadow, simplesmente observar como ele reage em determinada situação

Quais os objetivos de longo prazo?

Análise de pesquisas anteriores.

Quais os objetivos do projeto?

Análise de dados sobre o perfil do público.

Como a empresa pretende rentabilizar esse projeto?

Aplicações de questionários.

Exemplo do vídeo na prática: Uma entrevista onde começa a falar sobre um todo da empresa/projeto até ir afunilando até encontrar problemas e possíveis soluções que possa ter no projeto.

Com todas as informações obtidas nessa conversa é preciso:

Fazer um compilado de todas essas anotações listando apenas os itens importantes.
Entrevistar personagens/pessoas que possam aparecer como problemas ou dúvidas no decorrer da entrevista. (Pode ser feito 4 ou 5 conversas/entrevistas assim.)

Inventário de Conteúdo
(De acordo com o projeto define-se pontos negativos e positivos, cruzando esses pontos onde vai surgir problemas e soluções.)
Movitações X Restrições

Inventário de Conteúdo

(De acordo com o projeto define-se pontos negativos e positivos, cruzando esses pontos onde vai surgir problemas e soluções.)

Movitações X Restrições

Passo 2 - Encontrar Soluções

Passo feito para ter ideias, não necessaŕiamente válidas. A decisão final das ideias/soluções que realmente vão ser utilizadas vem no passo 3.

Encontrar Soluções
4 - Brainstorm: Feito os itens anteriores começa as rodadas de brainstorm junto a todos os envolvidos no projeto
1 - Benchmarking: Como empresas de outros mercados resolvem esses problemas?
2 - Análise de concorrência: Como outros players do mesmo mercado que estou, solucionam esses problemas?
3 - Análise de tendência: Para onde o mercado está indo e do que posso me adiantar e tirar proveito disso agora?

Encontrar Soluções

4 - Brainstorm: Feito os itens anteriores começa as rodadas de brainstorm junto a todos os envolvidos no projeto

1 - Benchmarking: Como empresas de outros mercados resolvem esses problemas?

2 - Análise de concorrência: Como outros players do mesmo mercado que estou, solucionam esses problemas?

3 - Análise de tendência: Para onde o mercado está indo e do que posso me adiantar e tirar proveito disso agora?

Dica: Envolver toda a equipe e cliente (se possível) na criação de soluções.

Garantir que todos tiveram entendimentos iguais do problema.

Apresentar as descobertas do passo 1
Fazer rodadas de brainstorm (com hora marcada)

Neste brainstorm lista todos os grandes/principais problemas encontrados onde todos que estão reunidos começam a apontar possíveis soluções para melhorar ou solucionar aquele problema.

Os 4 principais problemas encontrados

Problema 1	Problema 2	Problema 3	Problema 4
Solução C	Solução C	Solução C	Solução C
Solução A	Solução A	Solução A	Solução A
Solução B	Solução B	Solução B	Solução B

Problema 1

Problema 2

Problema 3

Problema 4

Solução C

Solução A

Solução B

Passo 3 - Decidir e Priorizar

Aqui vai priorizar todas as ideias que foram propostas. Como não é viável produzir e executar tudo é selecionado as melhores ideias para resolver cada problema. (Essas ideias sempre devem ser discutidas com todos os que estão inseridos no projeto.)

Imprescindível:

Envolver toda a equipe e cliente nas decisões
Balancear necessidade do usuário X necessidade do cliente
Viabilidade técnica
Viabilidade financeira

Passo 4 - Arquitetura da Informação

Nesse passo lista o que esse projeto vai, de fato, ter de conteúdo: Quais são todas as páginas, recursos e funcionalidades. Para organizar isso, como é, na camada de Arquitetura da informação.

Arquitetura da Informação (Este item está na 3ª Camada)

Organizar
Rotular
Definir Navegação
Definir Busca

Passo 5 - Interface

Passo em que é feito toda parte de prototipação, testes e ajustes.

Interface (Está na 3ª camada no item 2)

Prototipação
Layout (Design final, o layout final da interface)
Teste (Pode ser feito via skype, hangout usando um roteiro simples. O testar com 4 pessoas torna o teste bastante eficiente )
Ajustes (Ajusta aquilo que não funcionou no teste)

Prototipação

Layout (Design final, o layout final da interface)

Teste (Pode ser feito via skype, hangout usando um roteiro simples. O testar com 4 pessoas torna o teste bastante eficiente )

Ajustes (Ajusta aquilo que não funcionou no teste)

Passo 6 - Acompanhamento do projeto

O trabalho de experiência do usuário não é um trabalho só do profissional de UX. O profissional de UX é quem conhece os métodos que precisam ser aplicados e o que precisa ser feito antes do que para garantir uma boa experiência do usuário. Mas a experiência do usuário em si é fruto do trabalho em conjunto de todos os que estão envolvidos com o projeto. Não há como propor a melhor solução sem o envolvimentos de todos os envolvidos.

Esse envolvimento faz com que a equipe esteja imersa no projeto e assim entenda melhor tudo o que precisa ser feito.

Por experiência, como em um iceberg o problema está sempre mais embaixo, mais profundo. E sempre tem que estar balanceado Experiência do Usuário X Interesses da Empresa.