Analisando, adaptando e melhorando a
Arquitetura de Informação
em um e-commerce
@shiota 2013

olá!Eduardo Shiota
slideshare.net/eshiota
shiota@baby.com.br
@shiota

front-end engineer
@

= UX

O que é UX?

Arquitetura de Informação
Design
SEO
Aná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 em
sistemas complexos

O que faz a Arquitetura de
Informação?

Estudos com usuários

Classificação das
informações

Fluxos de navegação

Padrões e metáforas
de interface

SWAT HQStrategic Worldwide Applications and Technologies
Home | About SWAT | Blog | Labs | Jobs | Contact
Search inside SWAT
search
Follow us on Twitter »
Twitter
mihswat The SWAT team
Metaprogramming: Ruby vs. Javascript:
http://fingernailsinoatmeal.com/post/29230185
9/metaprogramming-ruby-vs-javascript #mkx -
17 minutes ago
mihswat The SWAT team
And from the Nimbuzz blog: What theSkype/Nimbuzz Breakup Means To Youhttp://ht.ly/2YLEw #mkx - 3 hours ago
otaviofff 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 »
Flickr
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
Rafiq 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 find more about SWAT on our social profiles:
Jacques van NiekerkCEO
Beware of the young doctor andthe old barber. Most folks are about as happy asthey make up their minds to be.
Good taste is the worst vice everinvented.
Well, obviously we have a rapist inLiconln Park.
When everyone is somebody, thenno one's anybody. An undefined problem has aninfinite number of solutions.
When everyone is somebody, thenno one's anybody.
A sailor without a destinationcannot hope for a favorable wind.
An undefined problem has aninfinite number of solutions.
We don't know who we are untilwe see what we can do. Scrum is what separates the menfrom the boys.
Sometimes it is the quiet observerwho see the most. Walking is the best possibleexercise. Habituate yourself towalk very far.
Leon Coetzee
COO
Dani Valentin
Back-end developer Eduardo Shiota YasudaFront-end developer
Heidi Ocker
SEM and GA evangelist Jeanne-Marié RouxSoftware engineer
Otavio Ferreira
Senior Developer and OO Expert
Rafiq Phillips
SEO Expert
Rafael Dohms
PHP Warlock
Leon Myburgh
PHP developer
Steve Farrand
Viking of Kiting
Zunaid Parker
Industry Analyst
Tyrone Visagie
Architect
Projects and experiments
Visit SWAT Labs »
"Well, your honour," replied he, "I could not riskmyself, my men, or my little boat of scarcelytwenty 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," saidMr. Fogg.
SWAT Blog
Maybe a catchy tagline lorem ipsum?
Search inside SWAT search
The Web is Not Dead. Long Live the Web!
11
OCT
2010
by Eduardo Shiota Yasuda · Permalink
No comments
As mentioned in my previous post on An Event Apart, I especially enjoyed Jeff 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 Jeff, apologizing to his former employees, declared that
couldn’t disagree more about Wired’s opinion.
read more »
tweet like2.548
An Event Apart 201004
OCT
2010
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 comments
tweet like2.548
SES San Francisco 201027
SEP
2010
by Rafiq Phillips · Permalink
Difficult 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 benefited 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 comments
tweet like2.548
The proliferation of mobile VoIP and the
potential effect on cell network operators17
SEP
2010
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 comments
tweet like2.548
How does an organization ensure the
people in it are competent and empow-
ered to do their job?
15
SEP
2010
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://fingernailsinoatmeal.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
otaviofff 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
Rafiq 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 technologies
Home | 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://fingernailsinoatmeal.com/post/292301859/metaprogra
mming-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 ago
otaviofff 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
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
Rafiq 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.
"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 projectsand experiments
Share 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
find2followA minimalistic approach to finding people
you may like to follow on Twitter.
View more info »
Go to website
Go to website
SWAT on Twitter
SWAT on Flickr
SWAT HQ
Strategic 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 Jeff 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 Jeff, 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://fingernailsinoatmeal.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
otaviofff 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
Rafiq 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?

Desenvolvimento
em camadas

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

ideação
prototipação
implementação
testes

Comunicação
pró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 wireframes
e 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 Red
Passion até 15Kg Chicco
1 un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
1 un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
1 un x R$ 3.490,00
IR PARA O CAIXA >>
2.1 Cart checkout
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Revise e finalize seu pedido
FINALIZAR
Subtotal: R$ 3.490,00
Frete: Grátis
Entrega: 2 dias úteis
Tenho cupom
TOTAL: R$ 3.490,00 (à vista)
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Revise e finalize seu pedido
FINALIZAR
Subtotal: R$ 3.490,00
Frete: 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 Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Revise e finalize seu pedido
FINALIZAR
Subtotal: R$ 3.490,00
Frete: Grátis
Entrega: 2 dias úteis
Tenho cupom
TOTAL: R$ 3.490,00 (à vista)
19
5
3
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Carrinho Trio Living Red
Passion até 15Kg Chicco
un x R$ 3.490,00
Revise e finalize seu pedido
FINALIZAR
Subtotal: R$ 3.490,00
Frete: 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
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ão
atualizadas e
um fade
no numero
é aplicado como
feedback.
Situação 1: Alterou a quantidade sem maiores problemas.
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

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/eshiota
shiota@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/