81

Design agil: Encaixando o Design no processo

Embed Size (px)

DESCRIPTION

Como encaixar o processo criativo dentro das metodologias ágeis sem perder a qualidade de entrega e ainda manter a inovatividade.

Citation preview

Page 1: Design agil: Encaixando o Design no processo
Page 2: Design agil: Encaixando o Design no processo

DESIGN X ARTE

Page 3: Design agil: Encaixando o Design no processo
Page 4: Design agil: Encaixando o Design no processo

wikipedia

O Próprio Gropius afirma que antes de um

exercício puro do racionalismo funcional, a

Bauhaus deveria procurar definir os limites deste

enfoque, e através da separação daquilo que é

meramente arbitrário do que é essencial e típico,

permitir ao espírito criativo construir o novo sobre a

base tecnológica já adquirida pela humanidade

Page 5: Design agil: Encaixando o Design no processo

O Próprio Gropius afirma que antes de um

exercício puro do racionalismo funcional, a

Bauhaus deveria procurar definir os limites deste

enfoque, e através da separação daquilo que é

meramente arbitrário do que é essencial e típico,

permitir ao espírito criativo construir o novo sobre a

base tecnológica já adquirida pela humanidade

wikipedia

Page 6: Design agil: Encaixando o Design no processo

MANIFESTO DE BAUHAUS (1919)

A ação de vanguarda deles iria provoca uma alteração duradoura na história da arquitetura e das artes plásticas em geral. Não era para menos visto que a ambição do movimento era “a nova construção do futuro.” Começava então uma das mais importantes transformações do século 20: a aliança entre a estética e a tecnologia, entre o artista e a indústria.

Educaterra - História por Voltaire Schilling

Page 7: Design agil: Encaixando o Design no processo

MANIFESTO DE BAUHAUS (1919)

Educaterra - História por Voltaire Schilling

A ação de vanguarda deles iria provoca uma alteração duradoura na história da arquitetura e das artes plásticas em geral. Não era para menos visto que a ambição do movimento era “a nova construção do futuro.” Começava então uma das mais importantes transformações do século 20: a aliança entre a estética e a tecnologia, entre o artista e a indústria.

Page 8: Design agil: Encaixando o Design no processo
Page 9: Design agil: Encaixando o Design no processo

IDEAL DE ENGENHARIA

O Principal objetivo da maioria dos projetos

da web é facilitar ao cliente o desempenho de

tarefas úteis

Page 10: Design agil: Encaixando o Design no processo

IDEAL DE ENGENHARIA

O Principal objetivo da maioria dos projetos

da web é facilitar ao cliente o desempenho de

tarefas úteis

Page 11: Design agil: Encaixando o Design no processo

ETAPAS DE PROJETO

•Contextualização do projeto

•Levantamento de requisitos

•Priorização de requisitos

•Criação de Personas e Cenários

•Mapeamento de Fluxo de navegação

•Sitemap

•Escrever roteiros de testes com usuário

•Wireframes

•Executar testes com usuário

•Documentar

•Apresentar

Page 12: Design agil: Encaixando o Design no processo

•Contextualização do projeto

•Levantamento de requisitos

•Priorização de requisitos

•Criação de Personas e Cenários

•Mapeamento de Fluxo de navegação

•Sitemap

•Escrever roteiros de testes com usuário

•Wireframes

•Executar testes com usuário

•Documentar

•Apresentar

•1d

•3d

•1d

•3d

•3d

•3d

•3d

•8d

•4d

•2d

•3d

ETAPAS DE PROJETO

Page 13: Design agil: Encaixando o Design no processo

DIAS ÚTEIS Aproximadamente 2 meses

34

Page 14: Design agil: Encaixando o Design no processo

1 DESIGNER Valor hora 80,00

R$ 21.760

Page 15: Design agil: Encaixando o Design no processo
Page 16: Design agil: Encaixando o Design no processo

DESIGNERS, NA VERDADE, NÃO

RESOLVEM PROBLEMAS. DESIGNERS

TRABALHAM COM ELES.

MARTY NEUMEIER

Page 17: Design agil: Encaixando o Design no processo

MUITOS DESIGNERS NÃO SABEM

A DIFERENÇA DE UX E UI

Page 18: Design agil: Encaixando o Design no processo

http://www.youtube.com/watch?v=2wZUTe70w1Y&feature=related

Page 19: Design agil: Encaixando o Design no processo

Jesse James Garrett

Page 20: Design agil: Encaixando o Design no processo
Page 21: Design agil: Encaixando o Design no processo
Page 22: Design agil: Encaixando o Design no processo
Page 23: Design agil: Encaixando o Design no processo
Page 24: Design agil: Encaixando o Design no processo
Page 25: Design agil: Encaixando o Design no processo
Page 26: Design agil: Encaixando o Design no processo

WIREFRAME TO CODE

Page 27: Design agil: Encaixando o Design no processo

PESSOAS METÓDICAS

Page 28: Design agil: Encaixando o Design no processo

CONFUSAS

Page 29: Design agil: Encaixando o Design no processo

PREGUIÇOSAS

Page 30: Design agil: Encaixando o Design no processo

MUITO PREGUIÇOSAS

Page 31: Design agil: Encaixando o Design no processo

MEDO

Page 32: Design agil: Encaixando o Design no processo

WIREFRAME

DESIGN

FRONT-END

BACK-END

Page 33: Design agil: Encaixando o Design no processo

MODELO TRADICIONAL

Cada etapa finalizada dá origem ao começo

da etapa seguinte. Processo demorado e

gera dependência.

Page 34: Design agil: Encaixando o Design no processo

ANÁLISE

DESIGN

DESENVOLVIMENTO

QA

Page 35: Design agil: Encaixando o Design no processo
Page 36: Design agil: Encaixando o Design no processo

WIREFRAME

DESIGN FRONT-END

BACK-END

Page 37: Design agil: Encaixando o Design no processo

MODELO AVANÇADO

Necessita de uma documentação bastante

definida no protótipo para que a etapa de

codificação possa ser iniciada. Com a

interação e arquitetura definida, ainda pode

ser iniciada uma terceira etapa simultânea

que é a do desenvolvimento do sistema.

Page 38: Design agil: Encaixando o Design no processo
Page 39: Design agil: Encaixando o Design no processo

WIREFRAME

DESIGN

DESENVOLVIMENTO

QA

Page 40: Design agil: Encaixando o Design no processo

MODELO ÁGIL

Sprint 1: prever, mapear e arquitetar o que

será feito na sprint 2. Paralelo a isso, temos

que codificar o que será trabalhado na sprint

atual e corrigir erros e melhorias da sprint

atual e sprint anterior.

Page 41: Design agil: Encaixando o Design no processo
Page 42: Design agil: Encaixando o Design no processo
Page 43: Design agil: Encaixando o Design no processo

5 DESIGNERS

40 DESENVOLVEDORES

12 PROJETOS

SIMULTÂNEOS

Page 44: Design agil: Encaixando o Design no processo
Page 45: Design agil: Encaixando o Design no processo
Page 46: Design agil: Encaixando o Design no processo

15MIN X 12 = 3 HORAS!

Page 47: Design agil: Encaixando o Design no processo
Page 48: Design agil: Encaixando o Design no processo
Page 49: Design agil: Encaixando o Design no processo
Page 50: Design agil: Encaixando o Design no processo
Page 51: Design agil: Encaixando o Design no processo
Page 52: Design agil: Encaixando o Design no processo

PLANNING

3HORAS

REVIEW

1HORA

X12

48 HORAS!

Page 53: Design agil: Encaixando o Design no processo
Page 54: Design agil: Encaixando o Design no processo

NOS TORNAMOS

PROFISSIONAIS REATIVOS

Page 55: Design agil: Encaixando o Design no processo

POSTURA REATIVA

Investigar o que está errado e corrigir

Page 56: Design agil: Encaixando o Design no processo

POSTURA PROATIVA

Além da correção, age-se de modo

aperfeiçoativo e preventivo.

Page 57: Design agil: Encaixando o Design no processo

HORÁCIO SOARES NETO (O TIRO E O ALVO)

A postura reativa é filha do passado enquanto

a proativa é mãe do futuro.

Page 58: Design agil: Encaixando o Design no processo
Page 59: Design agil: Encaixando o Design no processo
Page 60: Design agil: Encaixando o Design no processo
Page 61: Design agil: Encaixando o Design no processo

LEAN UX

Page 62: Design agil: Encaixando o Design no processo

Conceito Aprovação Iteração feedback

Page 63: Design agil: Encaixando o Design no processo

Diagram of the iterative design and critique process. Warfel, Todd Zaki

Page 64: Design agil: Encaixando o Design no processo

Jakob Nielsen - http://www.useit.com/alertbox/20000319.html

Page 65: Design agil: Encaixando o Design no processo

ATENDER REQUISITOS NÃO

GERA UMA BOA APLICAÇÃO

Page 66: Design agil: Encaixando o Design no processo

UM LAYOUT BONITO NÃO

GERA UMA BOA APLICAÇÃO

Page 67: Design agil: Encaixando o Design no processo

USAR HTML5 NÃO GERA UMA

BOA APLICAÇÃO

Page 68: Design agil: Encaixando o Design no processo

AGRADAR O CLIENTE NÃO

GERA UMA BOA APLICAÇÃO

Page 69: Design agil: Encaixando o Design no processo

SATISFAZER O USUÁRIO GERA

UMA BOA APLICAÇÃO

Page 70: Design agil: Encaixando o Design no processo

IDEAL DE ENGENHARIA

O Principal objetivo da maioria dos projetos

da web é facilitar ao cliente o desempenho de

tarefas úteis

Page 71: Design agil: Encaixando o Design no processo

ADAPTE O PROCESSO AO

SEU NEGÓCIO

Page 72: Design agil: Encaixando o Design no processo

ADAPTE O SEU NEGÓCIO

AO USUÁRIO

Page 73: Design agil: Encaixando o Design no processo
Page 74: Design agil: Encaixando o Design no processo

Lance feedback

STARTUP

Page 75: Design agil: Encaixando o Design no processo

USER EXPERIENCE DESIGN PROCESS HTTP://IAINSTITUTE.ORG/DOCUMENTS/TOOLS/EXPERIENCEDESIGNFLOW_BW.PDF

Page 76: Design agil: Encaixando o Design no processo

THINKS IN FLOWS, NOT SCREENS

Jason Putorti

Page 77: Design agil: Encaixando o Design no processo

SEMPRE TRABALHE COM MELHORIAS CONTÍNUAS

Page 78: Design agil: Encaixando o Design no processo

SIMPLICIDADE É A MAIS NOVA SOFISTICAÇÃO

Saint Exupery

Page 79: Design agil: Encaixando o Design no processo

GREATE DESIGN IS INVISIBLE

Joshua Porter

Page 80: Design agil: Encaixando o Design no processo

Não é possível obter uma criação coletiva

a partir da soma de criações individuais.

Uma criação é sempre resultado de um

processo conjunto de criação.

Horácio Soares Neto

Page 81: Design agil: Encaixando o Design no processo

Joshua Porter

www.bernarddeluna.com | @bernarddeluna