Processo de UI/UX CI&T: como projetar a experiência do consumidor? Cléo Cardinale ux designer CI&T

Transcrição

1 Processo de UI/UX CI&T: como projetar a experiência do consumidor? Cléo Cardinale ux designer CI&T

2 INSPIRAÇÕES Design Centrado no Usuário Design Thinking Metodologia Ágil Mindset Lean fundamento em pesquisa soluções inovadoras processo ágil e escalável ciclos de validações e aprendizados

3 PREMISSAS SIMPLES O SUFICIENTE PARA APLICAÇÃO NOS DIFERENTES CONTEXTOS DE PROJETO E NÍVEIS DE PROFICIÊNCIA. ABRANGENTE O SUFICIENTE PARA DAR CONTA DAS MAIS DIFERENTES NECESSIDADES DOS CLIENTES.

4 PARA A DEFINIÇÃO DO TIPO DE PROCESSO A SER APLICADO, DEVE-SE CONSIDERAR: EXIGÊNCIAS DO NEGÓCIO DO CLIENTE (E DA CI&T) NECESSIDADE DOS USUÁRIOS FINAIS TECNOLOGIA MAIS ADEQUADA

5 QUEM PARTICIPA DA DEFINIÇÃO DO PROCESSO CLIENTE GP/SM CI&T ESTRATEGISTA NEGÓCIO ARQUITETO TECNOLOGIA

6 CICLO DE DESIGN

7 CICLO DE DESIGN A unidade básica do Processo de UI/UX da CI&T é o Ciclo de Design, que se baseia nos princípios do Design Thinking.

8 COMO FUNCIONA Ciclo de Design Sprint 0 Sprint 1 Sprint 2 Sprint 3 Spri unidade básica repetições conforme a necessidade do projeto

9 CICLO DE DESIGN UX UI 01 Inspiraçao 02 Ideação 03 Prototipação 04 Validação 05 Execução

10 CICLO DE DESIGN ENTREGÁVEIS UX UI 01 Inspiraçao 02 Ideação 03 Prototipação 04 Validação 05 Execução JORNADA DO USUÁRIO MOCKUP E FLUXOS PROTÓTIPOS FEEDBACK SOBRE A INTERFACE LAYOUTS E STYLEGUIDE

11 CICLO DE DESIGN ITERAÇÕES UX Aperfeiçoamento das interfaces não validadas. UI 01 Inspiraçao 02 Ideação 03 Prototipação 04 Validação 05 Execução

12 CICLO DE DESIGN ITERAÇÕES UX UI 01 Inspiraçao 02 Ideação 03 Prototipação 04 Validação 05 Execução Aprendizados retroalimentam o Ciclo de Design.

13 SUGESTÕES DE FERRAMENTAS

14 Esta lista de ferramentas é meramente indicativa, outras podem ser utilizadas desde que atendam aos objetivos propostos em cada fase.

15 SUGESTÃO DE FERRAMENTAS 01 Inspiraçao 02 Ideação 03 Prototipação 04 Validação 05 Execução Benchmarks Análise Heurística Análise das tarefas Mapa do ecossistema Entrevistas Shadowing Teste de usabilidade Personas Mapa de empatia Moodboards Jornada do usuário Sitemap / App map Cenários e casos de uso Storyboards Fluxogramas Roadmap User flows Sketches / Mockups Storyboards Sketches / Mockups Sitemaps Wireframes Protótipos Testes de usabilidade Pesquisas quantitativa Pesquisas quantitativa Entrevistas; Controle de qualidade Recomendações Feedback sobre a interface Style guide Layout de interface Recorte de assets Concepção de interações Casos de uso Correções Controle de qualidade

16 OUTRAS FONTES uxdesign.cc/ux-methods-deliverables servicedesigntools.org projectofhow.com/methods toolbox.hyperisland.com/ 75toolsforcreativethinking.com servicedesigntoolkit.org

17 PROCESSO DE UX/UI NO DESENVOLVIMENTO AGILE

18 O Ciclo de Design é aplicado em cada sprint da metodologia Agile, numa adaptação do Lean UX. Assim, cada sprint tem seu próprio ciclo (Inspiração - Ideação - Prototipação - Validação - Execução) mas com os entregáveis específicos de cada sprint. Apenas a Inception e o Sprint de Release possuem Ciclos de Design adaptados às suas necessidades.

19 RESUMO DO PROCESSO DE UX Inception (com Sprint de Design) : entendimento e protótipo jornada e protótipo validado Inception (sem Sprint de Design) : entendimento Sprint 0 planejamento e setup Sprint N desenvolvimento e testes Sprint de release evolução e suporte jornada do usuário e conceito macroestrutura: seções e navegação + layouts do Sprint 1 microestrutura: layouts validados entrega homologada Insumos do Ciclo de Design Etapas do Ciclo de Design Analytics Estratégia Pesquisa Inspiração Ideação Prototipação Validação Execução

20 INSUMOS POSSÍVEIS DO PROCESSO DE UX PROJETO ESTRATÉGIA ANALYTICS CO-CRIAÇÃO DESIGN Briefing Objetivos do negócio Backlog do projeto Tecnologia adotada Feedbacks Business canvas Proposta de valor Blueprint Análise de mercado Métricas KPIs e Testes A/B Recomendações Brainstorming Design Thinking Sessões de co-criação Sessões de priorização Sprint de Design Prototipação rápida Jornada do usuário Benchmark Análise Heurística Análise de tarefas Acessibilidade Mapa do ecossistema Moodboards Pesquisa qualitativa Pesquisa quantitativa Entrevistas Shadowing Mapa de empatia Testes de usabilidade Personas

21 ENTREGÁVEIS POSSÍVEIS DO PROCESSO DE UX 01 Inspiraçao 02 Ideação 03 Prototipação 04 Validação 05 Execução Benchmarks Análise Heurística Análise das tarefas Mapa do ecossistema Entrevistas Shadowing Teste de usabilidade Personas Mapa de empatia Moodboards Jornada do usuário Sitemap / App map Cenários e casos de uso Storyboards Fluxogramas Roadmap User flows Sketches / Mockups Storyboards Sketches / Mockups Sitemaps Wireframes Protótipos Testes de usabilidade Pesquisas quantitativa Pesquisas quantitativa Entrevistas; Controle de qualidade Recomendações Feedback sobre a interface Style guide Layout de interface Recorte de assets Concepção de interações Casos de uso Correções Controle de qualidade

22 ATUAÇÃO DO DESIGNER NOS SPRINTS DE DESENVOLVIMENTO SPRINT N-1 SPRINT N SPRINT N+1 SPRINT N+2 Avalia e revisa o que foi feito no Sprint passado. Dá feedback e tira dúvidas sobre o design do Sprint atual. Projeta o próximo Sprint (layout e interações) Pesquisa (insumos), prototipa e valida o Sprint posterior.

23 VANTAGENS DO PROCESSO DE UX

24 Processo de UX CI&T Metodologias tradicionais Inovação do Design Thinking Assertividade do Design Centrado no Usuário Qualidade e Integração do time do Lean UX Agilidade e Escalabilidade do Agile Participação do cliente da Co-criação Intuição e modismos da Criação Hipóteses não validadas da Publicidade Esforços fragmentados da terceirização Trabalho em "waterfall" do desenvolvimento tradicional Problemas de comunicação da segmentação

25 THANK YOU FOR YOUR TIME!