Baby.com.br: Analisando, adaptando e melhorando a arquitetura da informação em um e-commerce

Post on 09-May-2015

2.234 views 1 download

description

Nesta apresentação, apresentei como a Arquitetura de Informação é integrada ao processo de análise, desenvolvimento, adaptação e constante melhorias da Baby.com.br. A Baby ama as mamães, e a melhor forma de mostrar isso é oferecendo uma experiência completa e rica nos nossos sites.

Transcript of Baby.com.br: Analisando, adaptando e melhorando a arquitetura da informação em um e-commerce

Analisando, adaptando e melhorando a Arquitetura de Informaçãoem um e-commerce

@shiota 2013

olá!Eduardo Shiota

slideshare.net/eshiotashiota@baby.com.br

@shiota

front-end engineer@

= UX

O que é UX?

Arquitetura de InformaçãoDesign

SEOAnálise de Produto

Engenharia de Software

Quality Assurance

Agile Coach

SysOps

Marketing

Comercial

Financeiro

SAC

Logística

UX

Arquitetura de Informação

Design

SEO

Análise de Produto

User Experience não é uma disciplina, é um mindset.

O que é a Arquitetura de Informação?

estruturação, modelagem e fluxo de informações emsistemas complexos

O que faz a Arquitetura de Informação?

Estudos com usuários

Classificação dasinformações

Fluxos de navegação

Padrões e metáforasde interface

SWAT HQStrategic Worldwide Applications and Technologies

Home | About SWAT | Blog | Labs | Jobs | ContactSearch inside SWAT search

Follow us on Twitter »

Twittermihswat The SWAT teamMetaprogramming: Ruby vs. Javascript: http://!ngernailsinoatmeal.com/post/29230185

9/metaprogramming-ruby-vs-javascript #mkx - 17 minutes ago

mihswat The SWAT teamAnd from the Nimbuzz blog: What the Skype/Nimbuzz Breakup Means To You http://ht.ly/2YLEw #mkx - 3 hours agootavio!f Otavio FerreiraPragmatic approach to scaling out #scrum

teams: http://goo.gl/71Pp #mkx #agile - 20 Oct

mihswat The SWAT teamPrototype of an Open Web App Ecosystem: http://blog.mozilla.com/blog/2010/10/19/prototype-of-an-open-web-app-ecosystem/ #mkx - 19 Oct

mihswat The SWAT teamPokens being sold at #teched. Has anyone asked you to share Poken info yet or is the tech still too new? - 19 Oct

Visiit our Flickr page »

Flickr

SitemapTags· Home

· About SWAT· Blog· Labs· Work @ SWAT· Contact

Follow us

#mihswat Africa AJAX android apple architecture book community confer-

ence developers development facebook feedalizr html inter-

net iphone Jacques van Niekerk Java Javascript John Kotsaftis Linux media

Microsoft mobile mobile banking mobile payment Naspers oo open source php Ra!q Phillips review scrum Search security Social Graph software spl SWAT Twitter uml USSD web Web 2.0 zendcon

Copyright Lorem Ipsum dolor sit amet. Powered by Wordpress.

About SWAT

The team

Welcome to the blog of the Strategic Worldwide Applications and Technologies (SWAT) team of

Naspers/MIH – a Global Media Company.Naspers/MIH has one of the largest developing market investment portfolios in the

Internet/Mobile space. You can see our investment portfolio here.The SWAT team is a global product development and Internet Strategy team, comprised of Inter-

net Analysts, Product Specialists and Software Engineers. Together we form a think tank and

execution arm of the Internet division within Naspers, and this blog serves as our outlet for stra-

tegic thoughts, technological idea sharing and general discussion both with the users of the

products within Naspers/MIH Internet as well as other new WWW destinations.We encourage our team members as well as other Internet thinkers within our Group to write

blog posts and welcome feedback and debate from the wider community.Interested in working at SWAT? Give us a shout!You may !nd more about SWAT on our social pro!les:

Jacques van NiekerkCEO

Beware of the young doctor and the old barber. Most folks are about as happy as they make up their minds to be.

Good taste is the worst vice ever invented.Well, obviously we have a rapist in Liconln Park.

When everyone is somebody, then no one's anybody. An unde!ned problem has an in!nite number of solutions.

When everyone is somebody, then no one's anybody.

A sailor without a destination cannot hope for a favorable wind.

An unde!ned problem has an in!nite number of solutions.

We don't know who we are until we see what we can do. Scrum is what separates the men from the boys.

Sometimes it is the quiet observer who see the most. Walking is the best possible exercise. Habituate yourself to walk very far.

Leon CoetzeeCOO

Dani ValentinBack-end developer Eduardo Shiota YasudaFront-end developer

Heidi OckerSEM and GA evangelist Jeanne-Marié RouxSoftware engineer

Otavio FerreiraSenior Developer and OO Expert

Ra!q PhillipsSEO Expert

Rafael DohmsPHP Warlock

Leon MyburghPHP developer

Steve FarrandViking of Kiting

Zunaid ParkerIndustry Analyst

Tyrone VisagieArchitect

Projects and experiments

Visit SWAT Labs »

"Well, your honour," replied he, "I could not risk myself, my men, or my little boat of scarcely twenty tons on so long a voyage at this time of

year. Besides, we could not reach Yokohama in time, for it is sixteen hundred and sixty miles from Hong Kong." "Only sixteen hundred," said Mr. Fogg.

SWAT BlogMaybe a catchy tagline lorem ipsum?

Search inside SWAT search

The Web is Not Dead. Long Live the Web!11OCT2010

by Eduardo Shiota Yasuda · Permalink

No comments

As mentioned in my previous post on An Event Apart, I especially enjoyed Je! Veen’s talk on

How the Web Works. One of Veen’s last slides was controversial Wired’s September issue cover

that, with a deep red background and giant letters, proclaimed “The Web is dead”. Its main

article has since been a subject of long discussions around the Internet, some partially agree-

ing, others entirely disagreeing. And Je!, apologizing to his former employees, declared that

couldn’t disagree more about Wired’s opinion.

read more »

tweet like2.548

An Event Apart 201004OCT2010

by Eduardo Shiota Yasuda · Permalink

No comments

Consider the past 10 years and answer the question: What has changed?

In technology, Windows 98 SE became Windows 7, Ubuntu helped spread Linux, and Mac OS

X extended its users base. The mobile world exploded after the introduction of the iPhone.

Web Design gained importance, social networks arose, and rich media found its way to the

masses via YouTube. Google became the god of Internet, Apple gained a church of fanatic

followers and a legion of enemies. Flash was born, became a symbol of the future, and today

is being stoned by HTML5 standards. Web became 2.0, and then people realized how wrong

it is to give it a version number. The Web is dead. Long live the Internet. But it will reborn, as

soon as people realize how wrong it is to claim its death.

read more »

tweet like2.548

No commentstweet like2.548

SES San Francisco 201027SEP2010

by Ra"q Phillips · Permalink

Di#cult choices had to be made at the Search Engine Strategies conference this year. As with

SMX East last year, choosing which sessions to attend was extremely challenging for this

inhouse SEO as there were always simultaneous sessions that could have bene"ted more

than one company within the group.read more »

About SWAT

News

The SWAT team is a multi-disciplinary global

product development and Internet Strategy

team. We form a think tank and execution arm

of the Internet division within Naspers, and this

blog is our outlet for sharing strategic thoughts

and technological concepts with you.

· MIH Internet Talent Evenings

· Lorem ipsum dolor sit amet

· Another page created in Wordpress

Categories

· Event (16)

· Front-end development (4)

· JavaScript (3)

· PHP (10)

· Scrum (10)

· SEO (8)

· SEM (10)

· Software architecture (10)

view more »

No commentstweet like2.548

The proliferation of mobile VoIP and the

potential e!ect on cell network operators17SEP2010

by Zunaid Parker · Permalink

Advancements in technology nearly always results in the development of new industries, but

equally so, it also results in existing industries becoming preys of innovation.

It is estimated that worldwide smartphone sales are to total 4.5bn units throughout 2010 to

2015, so it is a common thought that most cell phone users will eventually own a smart-

phone (soon to be 4G compatible).

read more »

No commentstweet like2.548

How does an organization ensure the

people in it are competent and empow-

ered to do their job?

15SEP2010

by Steve Farrand · Permalink

This is a wicked problem. I believe part of the answer is to train them, and keep training

(growing) them. read more »

Next1 2 3 ... 267

Get to know our cutting-edge experiments

Follow us on Twitter »On Twitter...

mihswat The SWAT team

Metaprogramming: Ruby vs. Javascript:

http://"ngernailsinoatmeal.com/post/29230185

9/metaprogramming-ruby-vs-javascript #mkx -

17 minutes ago

mihswat The SWAT team

And from the Nimbuzz blog: What the

Skype/Nimbuzz Breakup Means To You

http://ht.ly/2YLEw #mkx - 3 hours ago

otavio!f Otavio Ferreira

Pragmatic approach to scaling out #scrum

teams: http://goo.gl/71Pp #mkx #agile - 20

Oct

mihswat The SWAT team

Prototype of an Open Web App Ecosystem:

http://blog.mozilla.com/blog/2010/10/19/prot

otype-of-an-open-web-app-ecosystem/ #mkx -

19 Oct

mihswat The SWAT team

Pokens being sold at #teched. Has anyone

asked you to share Poken info yet or is the tech

still too new? - 19 Oct

Visiit our Flickr page »On Flickr...

Home | About SWAT | Blog | Labs | Jobs | Contact

Sitemap Tags

· Home

· About SWAT

· Blog

· Labs

· Work @ SWAT

· Contact

Follow us#mihswat Africa AJAX android apple architecture book community confer-

ence developers development facebook feedalizr html inter-

net iphone Jacques van Niekerk Java Javascript John Kotsaftis Linux media

Microsoft mobile mobile banking mobile payment Naspers oo open source php

Ra"q Phillips review scrum Search security Social Graph software spl SWAT

Twitter uml USSD web Web 2.0 zendcon

Copyright Lorem Ipsum dolor sit amet. Powered by Wordpress.

Archives

· 2010 (34)

· October (3)

· September (5)

· August (4)

· July (4)

· June (4)

· May (3)

· April (3)

· March (3)

· February (2)

· January(3)

· 2009 (34)

SWAT LabsResearching the latest web technologiesHome | About SWAT | Blog | Labs | Jobs | ContactSearch inside SWAT

search

Follow us on Twitter »

Visit our Flickr page »

mihswat The SWAT teamMetaprogramming: Ruby vs. Javascript:

http://!ngernailsinoatmeal.com/post/292301859/metaprogra

mming-ruby-vs-javascript #mkx - 17 minutes agomihswat The SWAT teamAnd from the Nimbuzz blog: What the Skype/Nimbuzz Breakup

Means To You http://ht.ly/2YLEw #mkx - 3 hours ago

otavio!f Otavio FerreiraPragmatic approach to scaling out #scrum teams:

http://goo.gl/71Pp #mkx #agile - 20 Octmihswat The SWAT teamPrototype of an Open Web App Ecosystem:

http://blog.mozilla.com/blog/2010/10/19/prototype-of-an-

open-web-app-ecosystem/ #mkx - 19 Octmihswat The SWAT teamPokens being sold at #teched. Has anyone asked you to share

Poken info yet or is the tech still too new? - 19 Oct

SitemapTags

· Home· About SWAT· Blog

· Labs· Work @ SWAT· Contact

Follow us

#mihswat Africa AJAX android apple architecture book community confer-

ence developers development facebook feedalizr html inter-

net iphone Jacques van Niekerk Java Javascript John Kotsaftis Linux media

Microsoft mobile mobile banking mobile payment Naspers oo open source php

Ra!q Phillips review scrum Search security Social Graph software spl SWAT

Twitter uml USSD web Web 2.0 zendconCopyright Lorem Ipsum dolor sit amet. Powered by Wordpress.

"Well, your honour," replied he, "I could not risk myself,

my men, or my little boat of scarcely twenty tons on so

long a voyage at this time of year. Besides, we could not

reach Yokohama in time, for it is sixteen hundred and

sixty miles from Hong Kong." "Only sixteen hundred,"

said Mr. Fogg.

Innovative projects and experimentsShare My MapA social network with focus on creating

maps and contributing to them.

feedalizrCross-platform, desktop social media aggregator that consolidates the updates

from social networks.

- Add places to any map- Comment and rate places

View more »

View more info »

Go to website

social graphExplore your social graph to discover social

clusters and photo friends on Facebook.View more info »

Go to website

!nd2followA minimalistic approach to !nding people

you may like to follow on Twitter.

View more info »

Go to website

Go to website

SWAT on Twitter

SWAT on Flickr

SWAT HQStrategic Worldwide Applications and Technologies

Latest blogpost View all posts »

Home | About SWAT | Blog | Labs | Jobs | Contact

Search inside SWAT search

The Web is Not Dead. Long Live the Web!

by Eduardo Shiota Yasuda · 11/10/2010

As mentioned in my previous post on An Event Apart, I especially enjoyed Je! Veen’s talk on How

the Web Works. One of Veen’s last slides was controversial Wired’s September issue cover that,

with a deep red background and giant letters, proclaimed “The Web is dead”. Its main article has

since been a subject of long discussions around the Internet, some partially agreeing, others

entirely disagreeing. And Je!, apologizing to his former employees, declared that couldn’t disa-

gree more about Wired’s opinion.

"Well, your honour," replied he, "I could not risk

myself, my men, or my little boat of scarcely

twenty tons on so long a voyage at this time of

year. Besides, we could not reach Yokohama in

time, for it is sixteen hundred and sixty miles

from Hong Kong." "Only sixteen hundred," said

Mr. Fogg.

Read full post »

Follow us on Twitter »Visit our Flickr page »

Visit SWAT Labs »

About SWAT

About SWAT

Experiments

Featured Project

Featured Blogpost

The SWAT team is a multi-disciplinary global product

development and Internet Strategy team. View more »

SWAT on Twitter

mihswat The SWAT team

Metaprogramming: Ruby vs. Javascript:

http://"ngernailsinoatmeal.com/post/292301859/metaprogra

mming-ruby-vs-javascript #mkx - 17 minutes ago

mihswat The SWAT team

And from the Nimbuzz blog: What the Skype/Nimbuzz Breakup

Means To You http://ht.ly/2YLEw #mkx - 3 hours ago

otavio!f Otavio Ferreira

Pragmatic approach to scaling out #scrum teams:

http://goo.gl/71Pp #mkx #agile - 20 Oct

mihswat The SWAT team

Prototype of an Open Web App Ecosystem:

http://blog.mozilla.com/blog/2010/10/19/prototype-of-an-

open-web-app-ecosystem/ #mkx - 19 Oct

mihswat The SWAT team

Pokens being sold at #teched. Has anyone asked you to share

Poken info yet or is the tech still too new? - 19 Oct

SWAT on Flickr

Experiments

Sitemap Tags

· Home

· About SWAT

· Blog

· Labs

· Work @ SWAT

· Contact

Follow us#mihswat Africa AJAX android apple architecture book community confer-

ence developers development facebook feedalizr html inter-

net iphone Jacques van Niekerk Java Javascript John Kotsaftis Linux media

Microsoft mobile mobile banking mobile payment Naspers oo open source php

Ra"q Phillips review scrum Search security Social Graph software spl SWAT

Twitter uml USSD web Web 2.0 zendcon

Copyright Lorem Ipsum dolor sit amet. Powered by Wordpress.

Análise de métricas e comportamento

Information radiation

Como é o processo de desenvolvimento na Baby?

Desenvolvimentoem camadas

Análise, adaptação, melhoria, lançamento

ideação

prototipação

implementação

testes

Comunicaçãopróxima e constante

Arquitetura de Informação, Design, Análise e Gestão de Produto, SEO, Engenharia de Software, e Quality Assurance em

um único time

Backlog sempre visível

2 histórias sempre preparadas para o desenvolvimento

Arquitetura de Informação na preparação das histórias

~adaptação~

Comunicar com as áreas afetadas pela história

Benchmark de patterns

Estudos com wireframese diagramas de fluxo

Situação 2: Aplicou o cupom e mudou a quantidade depois

Edit cart - versão A

1. Mini cart

1 item R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

1 un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

1 un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

1 un x R$ 3.490,00

IR PARA O CAIXA >>

2.1 Cart checkout

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

19

2.2 Cart checkout

atualizar

Situação 2: Alterou a quantidade e não existe quantidade suficiente no estoque

1

5

3

5

3

2. Cart checkout

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

19

5

3

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

5

3

9

Nós temos apenas 9 desse produto no estoque, sugerimos essa quantidade.

atualizar

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

5

3

Ao alterar a quantidade, o subtotal foi atualizado e seu cupom não pode ser aplicado nessa compra.

Devido ao subtotal atualizado, seu cupom não pode ser aplicado nessa compra.

Essa quantidade de produtos não permite ao cupom ser aplicado à sua compra.

Situação 3: Escreveu zero na edição do cupom

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

5

3

0remover

Regras

- Não pode ser alterada a quantidade para números que não sejam inteiros, negativos, letras do alfabeto.- Se a quantidade colocada for igual a zero, o link exibido é o "remover"

Ao clicar em confirmar,

as infos sãoatualizadas e

um fade no numero

é aplicado como feedback.

Situação 1: Alterou a quantidade sem maiores problemas.

19

Ao reconhecer o numero zero

ao ser digitado, automaticamente

o label é ajustado

para "remover".

Ao editar qualquer valor dentro do

campo (diferente de zero), o link

confirmar é exibido.Caso o usuário

clique em finalizar, ele deve confirmar

o campo para poder prosseguir

apenas se a quantidade não

houver em estoque

Situação 4: Alterou a quantidade e o frete deixou de ser gratuito

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

3

1

3

Ao alterar a quantidade, o subtotal foi atualizado e o frete grátis não é mais válido.

Situação 5: Alterou a quantidade em função do valor do cupom

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Carrinho Trio Living RedPassion até 15Kg Chicco

un x R$ 3.490,00

Revise e finalize seu pedido

FINALIZAR

Subtotal: R$ 3.490,00Frete: Grátis

Entrega: 2 dias úteis

Tenho cupom

TOTAL: R$ 3.490,00 (à vista)

3

1

3

Coisa boa! Com esta quantidade seu subtotal foi atualizado e o cupom aplicado é válido.

Arquitetura de Informação durante o desenvolvimento

~melhoria~

Compartilhamento dos artefatos com o time

Analista de SEO, AI e analista de produto participam do planejamento técnico

Comunicação constante durante o desenvolvimento

Toda feature nova é desenvolvida com teste A/B

Arquitetura de Informação pós-deploy

~lançamento e análise~

Análise do impacto do release nas métricas e comportamento

Levantamento de novas hipóteses e repriorização do backlog

UX reports

E quanto ao futuro?

Focus groups, user testing, personas, clusters de comportamento

UX é um mindset

AI é um information radiator

Lançar, analisar, adaptar, melhorar

No fim das contas, o que mais importa...

obrigado!Eduardo Shiota

slideshare.net/eshiotashiota@baby.com.br

@shiota

Fonte das imagens:

http://www.flickr.com/photos/inquiettudes/5573156267/in/photostream/

http://googleforstudents.blogspot.com.br/2011/06/help-improve-google-products-by.html

http://annaandblue.blogspot.com.br/2011/08/aloha-summer-birthday-dessert-table.html

http://davidwalsh.name/crazyegg

http://365psd.com/day/2-63/

http://www.flickr.com/photos/yandle/3857000967/lightbox/