ProcessoUXCIT-ComoProjetarExperienciaConsumidor
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
Processo de UI/UX CI&T:<br />
como projetar a experiência do consumidor?<br />
Cléo Cardinale<br />
ux designer CI&T
INSPIRAÇÕES<br />
Design Centrado no<br />
Usuário<br />
Design<br />
Thinking<br />
Metodologia<br />
Ágil<br />
Mindset<br />
Lean<br />
fundamento em<br />
pesquisa<br />
soluções<br />
inovadoras<br />
processo ágil<br />
e escalável<br />
ciclos de validações<br />
e aprendizados
PREMISSAS<br />
SIMPLES O SUFICIENTE PARA APLICAÇÃO NOS DIFERENTES<br />
CONTEXTOS DE PROJETO E NÍVEIS DE PROFICIÊNCIA.<br />
ABRANGENTE O SUFICIENTE PARA DAR CONTA DAS MAIS<br />
DIFERENTES NECESSIDADES DOS CLIENTES.
PARA A DEFINIÇÃO DO TIPO DE PROCESSO A SER APLICADO,<br />
DEVE-SE CONSIDERAR:<br />
EXIGÊNCIAS DO NEGÓCIO DO CLIENTE (E DA CI&T)<br />
NECESSIDADE DOS USUÁRIOS FINAIS<br />
TECNOLOGIA MAIS ADEQUADA
QUEM PARTICIPA DA DEFINIÇÃO DO PROCESSO<br />
CLIENTE<br />
GP/SM<br />
CI&T<br />
ESTRATEGISTA<br />
NEGÓCIO<br />
ARQUITETO<br />
TECNOLOGIA
CICLO<br />
DE DESIGN
CICLO DE DESIGN<br />
A unidade básica do Processo de UI/UX da CI&T<br />
é o Ciclo de Design, que se baseia nos<br />
princípios do Design Thinking.
COMO FUNCIONA<br />
Ciclo de<br />
Design<br />
Sprint 0 Sprint 1 Sprint 2<br />
Sprint 3<br />
Spri<br />
unidade básica<br />
repetições conforme a necessidade do projeto
CICLO DE DESIGN<br />
UX<br />
UI<br />
01<br />
Inspiraçao<br />
02<br />
Ideação<br />
03<br />
Prototipação<br />
04<br />
Validação<br />
05 Execução
CICLO DE DESIGN ENTREGÁVEIS<br />
UX<br />
UI<br />
01<br />
Inspiraçao<br />
02<br />
Ideação<br />
03<br />
Prototipação<br />
04<br />
Validação<br />
05 Execução<br />
JORNADA DO USUÁRIO MOCKUP E FLUXOS PROTÓTIPOS FEEDBACK SOBRE A<br />
INTERFACE<br />
LAYOUTS E<br />
STYLEGUIDE
CICLO DE DESIGN ITERAÇÕES<br />
UX<br />
Aperfeiçoamento das interfaces não<br />
validadas.<br />
UI<br />
01<br />
Inspiraçao<br />
02<br />
Ideação<br />
03<br />
Prototipação<br />
04<br />
Validação<br />
05 Execução
CICLO DE DESIGN ITERAÇÕES<br />
UX<br />
UI<br />
01<br />
Inspiraçao<br />
02<br />
Ideação<br />
03<br />
Prototipação<br />
04<br />
Validação<br />
05 Execução<br />
Aprendizados retroalimentam o<br />
Ciclo de Design.
SUGESTÕES DE FERRAMENTAS
Esta lista de ferramentas é meramente indicativa,<br />
outras podem ser utilizadas desde que atendam aos<br />
objetivos propostos em cada fase.
SUGESTÃO DE FERRAMENTAS<br />
01<br />
Inspiraçao<br />
02<br />
Ideação<br />
03<br />
Prototipação<br />
04<br />
Validação<br />
05 Execução<br />
Benchmarks<br />
Análise Heurística<br />
Análise das tarefas<br />
Mapa do<br />
ecossistema<br />
Entrevistas<br />
Shadowing<br />
Teste de<br />
usabilidade<br />
Personas<br />
Mapa de<br />
empatia<br />
Moodboards<br />
Jornada do usuário<br />
Sitemap / App map<br />
Cenários e casos de<br />
uso<br />
Storyboards<br />
Fluxogramas<br />
Roadmap<br />
User flows<br />
Sketches / Mockups<br />
Storyboards<br />
Sketches /<br />
Mockups<br />
Sitemaps<br />
Wireframes<br />
Protótipos<br />
Testes de<br />
usabilidade<br />
Pesquisas quantitativa<br />
Pesquisas quantitativa<br />
Entrevistas;<br />
Controle de qualidade<br />
Recomendações<br />
Feedback sobre a interface<br />
Style guide<br />
Layout de interface<br />
Recorte de<br />
assets<br />
Concepção de<br />
interações<br />
Casos de uso<br />
Correções<br />
Controle de qualidade
OUTRAS FONTES<br />
uxdesign.cc/ux-methods-deliverables<br />
www.designkit.org/methods<br />
servicedesigntools.org<br />
www.ideo.com/work/method-cards<br />
projectofhow.com/methods<br />
toolbox.hyperisland.com/<br />
75toolsforcreativethinking.com<br />
www.methodkit.com/research-method-card<br />
servicedesigntoolkit.org<br />
www.allaboutux.org/all-methods
PROCESSO DE UX/UI<br />
NO DESENVOLVIMENTO AGILE
O Ciclo de Design é aplicado em cada sprint da metodologia Agile, numa<br />
adaptação do Lean UX.<br />
Assim, cada sprint tem seu próprio ciclo (Inspiração - Ideação - Prototipação<br />
- Validação - Execução) mas com os entregáveis específicos de cada sprint.<br />
Apenas a Inception e o Sprint de Release possuem Ciclos de Design<br />
adaptados às suas necessidades.
RESUMO DO PROCESSO DE UX<br />
Inception<br />
(com Sprint de Design) : entendimento e<br />
protótipo<br />
jornada e protótipo validado<br />
Inception<br />
(sem Sprint de Design) :<br />
entendimento<br />
Sprint 0<br />
planejamento e setup<br />
Sprint N<br />
desenvolvimento e testes<br />
Sprint de release<br />
evolução e suporte<br />
jornada do usuário e conceito<br />
macroestrutura: seções e navegação<br />
+ layouts do Sprint 1<br />
microestrutura: layouts validados<br />
entrega homologada<br />
Insumos do Ciclo de Design<br />
Etapas do Ciclo de Design<br />
Analytics<br />
Estratégia<br />
Pesquisa Inspiração Ideação Prototipação Validação Execução
INSUMOS POSSÍVEIS DO PROCESSO DE UX<br />
PROJETO<br />
ESTRATÉGIA<br />
ANALYTICS<br />
CO-CRIAÇÃO<br />
DESIGN<br />
Briefing<br />
Objetivos do negócio<br />
Backlog do projeto<br />
Tecnologia adotada<br />
Feedbacks<br />
Business canvas<br />
Proposta de valor<br />
Blueprint<br />
Análise de mercado<br />
Métricas<br />
KPIs e Testes A/B<br />
Recomendações<br />
Brainstorming<br />
Design Thinking<br />
Sessões de co-criação<br />
Sessões de priorização<br />
Sprint de Design<br />
Prototipação rápida<br />
Jornada do usuário<br />
Benchmark<br />
Análise Heurística<br />
Análise de tarefas<br />
Acessibilidade<br />
Mapa do ecossistema<br />
Moodboards<br />
Pesquisa qualitativa<br />
Pesquisa quantitativa<br />
Entrevistas<br />
Shadowing<br />
Mapa de empatia<br />
Testes de usabilidade<br />
Personas
ENTREGÁVEIS POSSÍVEIS DO PROCESSO DE UX<br />
01<br />
Inspiraçao<br />
02<br />
Ideação<br />
03<br />
Prototipação<br />
04<br />
Validação<br />
05 Execução<br />
Benchmarks<br />
Análise Heurística<br />
Análise das tarefas<br />
Mapa do<br />
ecossistema<br />
Entrevistas<br />
Shadowing<br />
Teste de<br />
usabilidade<br />
Personas<br />
Mapa de<br />
empatia<br />
Moodboards<br />
Jornada do usuário<br />
Sitemap / App map<br />
Cenários e casos de<br />
uso<br />
Storyboards<br />
Fluxogramas<br />
Roadmap<br />
User flows<br />
Sketches / Mockups<br />
Storyboards<br />
Sketches /<br />
Mockups<br />
Sitemaps<br />
Wireframes<br />
Protótipos<br />
Testes de<br />
usabilidade<br />
Pesquisas quantitativa<br />
Pesquisas quantitativa<br />
Entrevistas;<br />
Controle de qualidade<br />
Recomendações<br />
Feedback sobre a interface<br />
Style guide<br />
Layout de interface<br />
Recorte de<br />
assets<br />
Concepção de<br />
interações<br />
Casos de uso<br />
Correções<br />
Controle de qualidade
ATUAÇÃO DO DESIGNER NOS SPRINTS DE DESENVOLVIMENTO<br />
SPRINT N-1<br />
SPRINT N<br />
SPRINT N+1 SPRINT N+2<br />
Avalia e revisa<br />
o que foi feito<br />
no Sprint<br />
passado.<br />
Dá feedback e<br />
tira dúvidas<br />
sobre o design<br />
do Sprint atual.<br />
Projeta o<br />
próximo Sprint<br />
(layout e<br />
interações)<br />
Pesquisa<br />
(insumos),<br />
prototipa e<br />
valida o Sprint<br />
posterior.
VANTAGENS DO PROCESSO DE UX
Processo de<br />
UX CI&T<br />
Metodologias<br />
tradicionais<br />
Inovação<br />
do Design Thinking<br />
Assertividade<br />
do Design Centrado no Usuário<br />
Qualidade e<br />
Integração do time<br />
do Lean UX<br />
Agilidade e<br />
Escalabilidade<br />
do Agile<br />
Participação<br />
do cliente<br />
da Co-criação<br />
Intuição e modismos<br />
da Criação<br />
Hipóteses não validadas<br />
da Publicidade<br />
Esforços<br />
fragmentados<br />
da terceirização<br />
Trabalho<br />
em "waterfall"<br />
do desenvolvimento tradicional<br />
Problemas de<br />
comunicação<br />
da segmentação
THANK<br />
YOU FOR<br />
YOUR<br />
TIME!