Anotações: Curso UX para Web Designers

in design •  6 years ago 

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)

  1. Sistema de organização.
  2. Sistema de Rotulação.
  3. Sistema de Navegação.
  4. 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/ )

  1. Wireframe de baixíssima fidelidade
  2. Wireframe de baixa fidelidade
  3. Wireframe de média fidelidade
  4. 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.)

ProblemaSoluçãoInteraçã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árioDescoberto 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 EmpresaNa visão do Usuário
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 dinheiro?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.
Personas. Uma pessoa fictícia mas embasada no perfil real do público alvo.

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

Movitações X Restrições: (De acordo com o projeto define-se pontos negativos e positivos, cruzando esses pontos onde vai surgir problemas e soluçõ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

  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?
  4. Brainstorm: Feito os itens anteriores começa as rodadas de brainstorm junto a todos os envolvidos no projeto

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 1Problema 2Problema 3Problema 4
Solução ASolução ASolução ASolução A
Solução BSolução BSolução BSolução B
Solução CSolução CSolução CSolução C

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)

  1. Organizar
  2. Rotular
  3. Definir Navegação
  4. 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)

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

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.

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

Congratulations @raloliver! You received a personal award!

Happy Birthday! - You are on the Steem blockchain for 1 year!

You can view your badges on your Steem Board and compare to others on the Steem Ranking

Do not miss the last post from @steemitboard:

SteemitBoard - Witness Update
SteemitBoard to support the german speaking community meetups
Vote for @Steemitboard as a witness to get one more award and increased upvotes!