retrospective project two_hector_nandez

11
Redesign of Fishs Eddy’s Website The Retrospective Hector Nandez 07.17.2915

Upload: hector-f-hernandez

Post on 18-Feb-2017

16 views

Category:

Documents


0 download

TRANSCRIPT

R e d e s i g n o f F i s h s Ed d y ’s We b s i t e

T h e R e t r o s p e c t i v eH e c t o r N a n d e z 0 7 . 1 7 . 2 9 1 5

P r o j e c t o v e r v i e w

P r o c e s s e s a n d t o o l s

Fo r p ro j e c t t w o , w e w e re t a s ke d to re s d e s i g n F i s h s Ed d y ’s w e b s i t e a n d c re a t e a w o r k i n g p ro to t y p e o f o u r d e s i g n . I t w a s q u i t e a n e xc i t i n g j o u r n e y to c o m e i n to t h i s p ro j e c t n o t k n o w i n g a n y t h i n g a n d c o m e o u t w i t h e i g h t n e w l y m i n t e d s k i l l s .

I n t h e b e g i n n i n g o f o u r a s s i g n m e n t I i n s p e c t e d t h e w e b s i t e f o r a b o u t fi f t e e n m i n -u t e s . I w e n t to e a c h p a g e i n t h e w e b s i t e a n d t e s t e d t h e s e a rc h - a b i l i t y o f t e n p ro d -u c t s . F ro m t h i s p re l i m i n a r y a n a l y s i s I c o n c l u d e d t h a t F i s h s Ed d y h a d a ro b u s t w e b -s i t e l a y o u t d e s i g n a n d i t w a s g o i n g to t a ke a l o t to fi n d s o m e f l a w s .

A s w e p ro g re s s e d , w e w e re t a u g h t t h e f o l l o w i n g m e t h o d s o f a n a l y s i s i n o rd e r to d e e p l y u n d e r s t a n d a n d fi n d w h a t i s f u n d a m e n t a l l y o f f - p u t t i n g i n w e b d e s i g n b e s t p r a c t i c e p r i n c i p l e s a n d h o w w e c a n i m p ro v e u p o n t h e e x i s t i n g d e s i g n t h ro u g h t h e u s e d o f s i t e m a p p i n g a n d p ro to t y p i n g .

The Processes that were used are as fo l lows:

• Market Posi t ion ing Research• Compet i t ion Feature Compar ison• Compet i t ion Heur ist ics Evaluat ion• Compet i t ion Layout Analys is• Compet i t ion Product User F lows• Or ig ina l vs Redesign User F low analys is • User Interv iews• Contextual Inqui ry • Card Sor t ing• S i te Mapping

The Tools that were used are as fo l lows:

• Omnigraff le

• Adobe I l lustrator

• Sketch

• Inv is ion

• Keynote

• Photoshop

1

M y fi r s t s t e p w a s a p ro d u c t d e fi n i t i o n s t a g e , a s I e x p l a i n e d i n t h e b e g i n n i n g , I d i d p re l i m i n a r y re s e a rc h a n d a n a l y z e d F i s h s Ed d y w e b s i t e a n d to o k n o t e s o f m y i n i t i a l fi n d i n g s . I k i c ke d o f f m y p l a n , b a s e d o n t h e r u b r i c g u i d e l i n e g i v e n to u s a n d s t u d i e s m y p e r s o n a s s o I c o u l d s t a r t i d e n t i f y i n g f r i e n d s t h a t re s e m b l e d t h a t p e r s o n a a n d i n t e r v i e w t h e m .

T h e D e s i g n p r o c e s s

S t e p o n e

2

Define Bui ld& Deploy

Analys is&

Iterate

Ideate

Prototype

Usertest

Product Def ini t ion

M o v i n g i n to re s e a rc h , I re fi n e d m y a s s u m p t i o n s a n d fi l l e d i n s o m e o f t h e b l a n k s . T h e q u a l i t y o f t h i s p h a s e w a s b a s e d o n c o m p l e x i t y o f t h e e x i s t i n g w e b s i t e , t i m i n g , re s o u rc e s , l e v e l o f e x i s t i n g k n o w l e d g e , a n d l i m i t e d a c c e s s to i n f o r m a t i o n f ro m t h e e xe c u t i v e s a t F i s h s Ed d y. R e s e a rc h P ro c e s s e s u s e d :

A . C o m p e t i t i ve a n d M a r ke t A n a l y s e s

D u r i n g m y re s e a rc h I f o u n d t h a t F i s h s Ed d y d i d n ’ t h a v e a n y i m m e d i a t e c o m p e t i to r s a ro u n d t h e m b u t t h e y d i d h a v e m a j o r e C o m m e rc e c o m p e t i t i o n a n d I b u i l t m y re s e a rc h a ro u n d t h e s e t w o c o m p a n i e s ;

C r a t e & B a r r e l a n d W i l l i a m s & S o n o m a

D u r i n g m y m a r ke t re s e a rc h I b e g a n to re a l i z e d h o w b ro a d o f a m a r ke t t h e y s e r v e . F i s h s Ed d y d o e s n o t s p e c i a l i z e i n a n y s i n g l e m a r ke t a n d t h e y h a v e p ro d u c t s t h a t a p p e a l to e v e r y d e m o g r a p h i c . T h i s e x p l a i n s w h y t h e i r s to re i s s o c l u t t e re d a n d w h y t h e y h a v e s o m u c h i n v e n to r y. F i s h s Ed d y h a s b e e n i n o p e r a t i o n f o r o v e r 1 8 y r s a n d t h e i r b r a n d i m a g e o f h a v i n g e v e r y t h i n g y o u f o r y o u r h o u s e h o l d n e e d s a t a n y p r i c e w i l l n o t c h a n g e . T h i s i s w h e n I re a l i z e d t h a t F i s h s Ed d y n e e d s to f o c u s o n h a v i n g a n u n c a n n y o rg a n i z a t i o n l i ke n o o t h e r w e b s i t e , to b a l a n c e o u t t h e i r s to re l a y o u t , w h i c h

3

S t e p t w o

User Research

B . Fe a t u r e C o m p a r i s o n

A fe a t u re c o m p a r i s o n w a s c o n d u c t e d b e t w e e n F i s h s Ed d y a n d i t ’s c o m p e t i to r s i n o rd e r to u n d e r s t a n d w h a t fe a t u re s i t h a s t h a t a re w o r k i n g w e l l a n d h o w i t s t a c k s u p a g a i n s t i t s c o m p e t i to r s . T h i s a n a l y s i s w o r k s w e l l i n h e l p i n g i d e n t i f y n e w o r u n n e c e s -s a r y fe a t u re s .

D u r i n g m y a n a y l s i s I re a l i z e d a l l o t h e r w e b s i t e s h a d a w o rd y l a n d i n g p a g e m e n u a n d e x t re m e l y l o n g d ro p d o w n m e n u s t h a t t a ke u p t h e f ro n t b a n n e r w h e n t h e u s e r i s n a v i -g a t i n g t h ro u g h i t . T h i s p re s e n t e d a n o p p o r t u n i t y f o r a fe a t u re e l i m i n a t i o n d i s c o v e r y.

C . H e u r i s t i c s A n a l y s i s

H e u r i s t i c e v a l u a t i o n i n v o l v e s h a v i n g a s m a l l s e t o f e v a l u a to r s e x a m i n e t h e i n t e r f a c e a n d j u d g e i t s c o m p l i a n c e w i t h re c o g n i z e d A b b o y C o v e r t H e u r i s t i c s u s a b i l i t y p r i n c i p l e s .

D u r i n g m y a n a l y s i s , I c h o s e t h re e i m p ro t a n t U I fe a t u re s a d b a s e d o n h o w m a n y H e u r i s t i c e l e m e n t s a p p l i e d I g a v e i t a s c o re a c c d o r i n g l y. T h e re a re s e v e n h e u r i s t i c sa n d a s c o re o f o n e w o u l d b e b a d a n d a s c o re o f s e v e n w o u l d s i g n i f y e xc e l l e n t u s a b i l i t y.

4

S t e p t w o

B . L ayo u t A n a l y s i s

I C o n d u c t e d a l a y o u t d e s i g n a n a l y s i s f o r F i s h s Ed d y a n d i t ’s c o m p e t i to r s . T h i s h e l p e d e n s u re t h a t I c re a t e a w e b s i t e l o o k a n d fe e l t h a t n o t o n l y l o o k s g o o d b u t h i t s t h e m a r k i n o u r a re a o f f o c u s w h i c h i s e f fi c i e n c y a n d o rg a n i z a t i o n . S o m e o f t h e q u e s t i o n s I a s ke d i n c l u d e d .

A n a l y s i s a n d t e s t t h e s e a rc h , m e n u , s u b m e n u , l o g i n p a g e , s h o p p i n g c a r t o f a l l t h re e s i t e s .

W h a t d o y o u w a n t a v i s i to r to d o o n t h e s i t e ? L i s t t h e s e q u e n c e o f e v e n t s y o u w o u l d l i ke t h e v i s i to r to g o t h ro u g h .

H o w w i l l y o u d e fi n e t h e s u c c e s s o f t h e s i t e ?

A re t h e re a n y c o m p e t i to r s i t e s t h a t y o u w o u l d l i ke to u s e a s a b e n c h m a r k ? W h a t a re t h e y d o i n g w e l l o n t h e i r s i t e ?

A re t h e re a n y s i t e s t h a t h a v e a l o o k a n d fe e l t h a t i s a t t r a c t i v e to y o u r t a rg e t a u d i -e n c e ? L i s t t h e m .

H o w e f fi c i e n t i s i t to a d d p ro d u c t s to t h e s h o p p i n g c a r t ?

W i l l t h e re b e a s i t e s e a rc h ? I f s o , w h a t a re t h e fi e l d s a n d h o w m u c h s p a c e w i l l i t o c c u p y ?

5

S t e p t w o

6

S t e p t h r e e

Contextual inqui ry is a semi-structured interv iew method to obta in informat ion about the context of use , where users are first asked a set of standard quest ions and then observed and quest ioned whi le they work in the i r own envi ronments. Dur ing th is phase I used the fo l low tools :

• User Interv iews• In store observat ions• Card Sor t ing

C a rd s o r t i n g i s a s i m p l e t e c h n i q u e i n u s e r e x p e r i e n c e d e s i g n w h e re a g ro u p o f s u b -j e c t e x p e r t s o r " u s e r s " , h o w e v e r i n e x p e r i e n c e d w i t h d e s i g n , a re g u i d e d to g e n e r a t e a c a t e g o r y t re e o r f o l k s o n o m y. I t i s a u s e f u l a p p ro a c h f o r d e s i g n i n g i n f o r m a t i o n a rc h i -t e c t u re , w o r k f l o w s , m e n u s t r u c t u re , o r w e b s i t e n a v i g a t i o n p a t h s .

Context Inquiry and Implementat ion

7

S t e p F o u r Implementat ion

D u r i n g i m p l e m e n t a t i o n , I to o k a l l t h e d a t a I h a d g a t h e re d a n d c re a t e d a s e r i e s o f s i t e m a p s a n d w i re f r a m e s .

S i t e M a p s

Home

Dinnerware CookingwareServewareCo ee & TeaGlassware Utensils

Footer

Fancy Plates

Simple Plates

Fancy Bowls

Simple Bowls

Wine

Cups

Gifts

Mugs Spoons

Forks

Knives

Napkins

Salad

Spice Dispensers

Pots

Pans

Knives

UtensilsDessert

First I terat ion Third I terat ion

Sixth I terat ion

N o w t h a t I h a d a s i t e m a p c re a t e d , I w a s re a d y to c re a t e a m e d i u m fi d e l i t y w i re r a m e ,w h i c h w o u l d l a t e r b e p ro t y p e d u s i n g I n v i s i o n A p p . T h e f o l l o w i n g a re b a s i c w i re f r a m e sf o r t h e w e b s i t e .

8

S t e p f i v e Protyping

N o w t h a t I h a d t h e w e b s i t e p ro to t y p e d , I w a s re a d y to g o i n to u s a b i l i t y t e s t i n g w h e re I m a d e a s c e n a r i o a n d h a d m y u s e r t e s t e r s s i t d o w n a n d t r y to a c c o m p l i s h t h e s c e n a r i o .

T h e s c e n a r i o :

“ Yo u a r e h o s t i n g a w i n e a n d c h e e s e p a r t y f o r a f r i e n d a n d y o u r e a l i z e y o u a r e t e n r e s e r v e w i n e g l a s s e s s h o r t . V i s i t F i s h s E d d y w e b s i t e , a d d t e n w i n e g l a s s e s t o y o u r s h o p -p i n g c a r t ,”

R e s u l t s :

A f t e r t e s t i n g o n fi v e u s e r s , I w a s a b l e to c o n c l u d e t h a t t h e u s a b i l i t y o f m y p ro to t y p e s c o re s h i g h o n t h e h e u r i s t i c s s c a l e a n d t h a t t h e s i t e m a p e p ro v e d e a s y to n a v i g a t e a n d c u t o n e s t e p o f t h e c h e c k o u t p ro c e s s o u t o f t h e u s e r f l o w a s d e m o n s t r a t e d b e l o w.

9

S t e p S i x Usabi l i ty Test ing

I t w a s a g re a t p l e a s u re to w o r k o n t h i s p ro j e c t a n d l e a r n s o m c u h a b o u t h e h o u s e h o l di t e m s i n d u s t r y.

F i ve t h i n g s I t o o k a w ay:

• Yo u a re n o t t h e u s e r• M a i n u s e r s a re c a n n o t b e i d e n t i fi e d t h ro u g h a s s u m p t i o n o r o b s e r v a t i o n s a l o n e . R e s e a rc h , re s e a rc h , re s e a rc h .• Yo u c o u l d b e t h e b e s t u s e r re s e a rc h t h e re i s b u t i f y o u c a n n o t c o m m u n i c a t e y o u r fi n d i n g s e f fe c t i v e l y, y o u h a v e d o n e n o t h i n g . • V i s u a l d e s i g n i s n o t e v e r y t h i n g .• O n e o f t h e b i g g e s t U s e r E x p e r i e n c e re s e a rc h s k i l l s o n c a n h a v e i s t h e a b i l i t y to d o c u m e n t a p ro c e s s p ro p e r l y.

N e x t S t e p s :

• C o n d u c t m o re u s e r t e s t i n g

• R e i t e r a t e o n e x i s t i n g w i re f r a m e s ; c re a t e h i g h fi d e l i t y v e r s i o n s .

• R e s e a rc h t h e b e n e fi t s o f c re a t i n g a F i s h s Ed d y A p p

1 0

C o n c l u s i o nTake Aways and Next Steps

T h a n k y o u !