Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Design Evolutivo focado na Experiência do Usuário

Glauber
June 26, 2013

Design Evolutivo focado na Experiência do Usuário

Glauber

June 26, 2013
Tweet

More Decks by Glauber

Other Decks in Design

Transcript

  1. Design Evolutivo 

    em

    Ambientes Ágeis


    com foco na Experiência do Usuário"

    View Slide

  2. View Slide

  3. HAITI!
    Contexto
    País mais pobre das Américas.

    View Slide

  4. CLIENTE PIH!
    Contexto
    Saúde de qualidade pra quem mais precisa.

    View Slide

  5. MIREBALAIS!
    Contexto
    Tecnologia e infraestrutura de alto padrão.

    View Slide

  6. NOSSO TIME!
    Contexto
    2 BAs 1IM 3TW DEVs 4PIH DEVs 2UX

    View Slide

  7. OPEN MRS!
    Contexto
    Electronic Medical Record (EMR)

    View Slide

  8. NO INÍCIO TUDO ERA TREVAS!

    View Slide

  9. UX & AGILE!
    Necessidades de UX
    Como encaixar num projeto em andamento?
    = ?

    View Slide

  10. PRIMEIRA FASE"

    View Slide

  11. DEFININDO

    PERSONAS!
    Conhecer as
    pessoas e entender
    suas rotinas.

    View Slide

  12. JORNADA

    DO USUÁRIO!
    Os passos de cada
    tipo de usuário a fim
    de finalizar uma
    tarefa, dentro e fora
    do sistema.

    View Slide

  13. FLUXO DE

    TELAS E 

    NAVEGAÇÃO!
    Parte de software da
    jornada do usuário
    mais detalhada.

    View Slide

  14. TRABALHANDO

    COM SUPOSIÇÕES!

    View Slide

  15. " "PRIMEIRA FASE"
    "
    " "1 mês de duração
    Personas
    Jornada do Usuário
    Fluxo de tela e navegação

    View Slide

  16. SEGUNDA FASE"

    View Slide

  17. SKETCHES!
    Testando conceitos
    em tempo record.

    View Slide

  18. MOCKUPS!
    Salvando vidas, uma
    estória por vez.

    View Slide

  19. PROTÓTIPOS!
    Prototipagem &
    validação rápida

    View Slide

  20. PROTÓTIPOS • MELHOR AMIGO !

    View Slide

  21. TESTES COM

    USUÁRIOS!
    Gravação de voz,
    video e mouse
    Arquivistas do hospital Lacolline
    Clínicos do Haiti/US
    Técnico de radiologia
    Gerente do hospital

    View Slide

  22. Exemplo video
    TESTES COM

    USUÁRIOS!

    View Slide

  23. Navegação - mensagens de sucesso, breadcrumbs
    e atalhos
    Conteúdo - melhor tradução e mais instruções
    Formato password e navegação por teclado
    TESTES COM USUÁRIOS!
    Conclusões

    View Slide

  24. GUIA DE

    ESTILO!
    Cores, tipografia, botões
    e elementos gráficos
    pré-definidos.

    View Slide

  25. GUIA DE

    ESTILO!

    View Slide

  26. FRAMEWORK SASS !
    Estilo modular
    Funções
    Variáveis
    Mixins

    View Slide

  27. FRAMEWORK SASS !
    Arquivo único
    Compila todos
    estilos

    View Slide

  28. " "SEGUNDA FASE"
    "
    Iterações de 2 semanas
    Mockups / Sketches
    Protótipos Rapidos
    Teste com usuários
    Guia de estilo
    Framework SASS

    View Slide

  29. RESULTADO"

    View Slide

  30. FUTURO DO OPENMRS?!

    View Slide

  31. GUIA DE ESTILO APLICADO!

    View Slide

  32. !FEEDBACK USUÁRIOS!
    Navegação por teclado foi de fácil aprendizado.
    Icones intuitivos.
    Médicos acharam fácil de acessar informações
    pelo dashboard do paciente.
    Alertas e feedback das ações são bastante im-
    portantes.

    View Slide

  33. !FEEDBACK CLIENTE!
    Não houve reclamações dos usuários quanto ao
    sistema. Isso significa que foi um sucesso.
    A interface é tão simples e de fácil utilização
    que não foi preciso
    mostrar aos usuários como fazer as tarefas
    apenas mostrar o que estava disponivel para se
    fazer.

    View Slide

  34. @glauberamos!
    @nataliarsand!

    View Slide