Behavioral Design & 9 States of Design

Um método ainda sem nomemas que vai te ajudar a pensar.

Inconsistências,você já sofreu

desse mal?

O que foi projetado O que foi programado O projeto final

inconsistências:

Hipótese #1 - Problemas com o Front EndPor que isso acontece?

possível solução:

Styleguide

Banners

Fonts

BUTTONS

COLORS

Problema resolvido!

NO

Hipótese #2 - Pixel PerfectPor que isso acontece?ainda

possível solução:

Diversos aplicativos Styleguide

Banners

Fonts

BUTTONS

COLORS

NO

¯\_(ツ)_/¯

NO

O que foi projetado O que foi programado O projeto final

inconsistências:

Hipótese #3 - ConteúdoPor que isso acontece?ainda

Diversos aplicativos Styleguide

Banners

Fonts

BUTTONS

COLORS

Placeholders reais

solução:

NOT BAD

O que foi projetado O projeto final

inconsistências:

GAP

9 States of Design & Behavioral Designa solução para os nossos problemas

Correct,Incorrect,

Done.

Correct Done

3 estados utilizados:

Incorrect

Before

existem 9 estados:

Loading None

One Some Too many

1 2 3 … 5

Incorrect Correct Done

Isso é o suficiente?Ainda não, estamos quase lá

"Understanding the psychology and science behind how people interpret information, make decisions, and take action enables

us to deliver more effective designs” (Aaron Otani)

Grab attention,Influence decisions,

Facilitate actions,

Sustain behavior.

Os estágios do behavioral design:

Atrairatenção

Influenciardecisões

Facilitar a ação

Sustentar ocomportamento

Grab attention,Influence decisions,

Facilitate actions,

Sustain behavior.

Técnicas:Seja convidativo

Você pode contar uma boa história, apelar para uma forte estética ou até mesmo utilizar recursos de motion design para ser convidativo.

Provoque reações emocionaisDesenhe interfaces que se sobressaem e permanecem memoráveis, apelando

para as reações emocionais. Sejam elas Surpresa, curiosidade ou urgência.

Trabalhe com conteúdo personalizadoAs pessoas costumam responder mais a conteúdos personalizados, baseados

no seu comportamento, interesses e valores.

airbnb

Grab attention,Influence decisions,

Facilitate actions,

Sustain behavior.

Técnicas:Trabalhe com conteúdo claro e direto

Esqueça os “jargões”, transmita a sua mensagem de uma forma clara e simples de ser entendida. Ofereça conteúdo que responda perguntas e ajude nas decisões.

Ofereça recomendaçõesA prova social é muito forte para nós na hora da tomada de decisão. Além de

passos claros, as pessoas ficam confortáveis com depoimentos e fontes seguras.

Descreva os benefíciosInclua benefício extrínsecos, como conforto, descontos e benefícios de um estilo de

vida. Apele também para a motivação intrínseca.

kickstarter

Grab attention,Influence decisions,

Facilitate actions,

Sustain behavior.

Técnicas:Simplifique a ação

Quebre as grandes ações em um passo a passo, faça que as pessoas pensem menos, crie experiências progressivas e guie a experiência.

Ajude as pessoas a criarem planosEncoraje cada pessoa a tomar uma ação, criar um objetivo e acompanhe-a ao

longo tempo. lembrando-a do seu objetivo final e do seu progresso.

Incentive no momento certoTimming é tudo, tenha certeza de encorajar as pessoas na hora em que elas

estarão mais propensas a tomar a decisão que você precisa que elas tomem.

brigade

Grab attention,Influence decisions,

Facilitate actions,

Sustain behavior.

Técnicas:Celebre o progresso

Pequenos ganhos não deixam de ser ganho, celebre cada pequena conquista junto com as pessoas. Como aplicativos de controle financeiro fazem.

Construa longos relacionamentosProjete as suas interfaces não para uma comunicação única, mas para um

relacionamento que evoluí conforme você conhece mais quem usa o produto.

Enfatize a motivação intrínsecaA a motivação intrínseca é o maior motivador na hora da tomada de decisões e

existem algumas pesquisas que provam isso. Pessoas são atraídas por propósitos.

nest

9 States of Design Behavioral Design

Eles funcionam muito bem em pares:

Done

Sustentar

None

Influenciar

Before

Atrair

As inconsistências,elas ainda acontecem?

Poucas inconsistências Validado com devs

DEV-PROOF

Em uso na SocialBase

Banners

Fonts

BUTTONS

COLORS

cenário atual:

Muito obrigado :)Dúvidas? Comentários? Feedbacks?