Top Banner
Marta Fioni General Assembly London - UX DI Summer 2014 The Magic Toy Shop
24

Magic toy shop - UXDi London 2014 - Project 2

Apr 22, 2015

Download

Internet

Marta Fioni

UX Design course project: developing wireframes for a vintage toy shop an e-commerce website. I have researched the competitive scenario, sketched the interface, developed wireframes of homepage, product pages, search pages, check out flow and reward and engagement system. I have then designed the clickable prototype in Omnigraffle, and run guerrilla testing to reiterate on the design.
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Magic toy  shop - UXDi London 2014 - Project 2

Marta Fioni General Assembly London - UX DI Summer 2014

The Magic Toy Shop

Page 2: Magic toy  shop - UXDi London 2014 - Project 2

Competitors Analysis

Bunny, my favourite toy

Page 3: Magic toy  shop - UXDi London 2014 - Project 2

‘Where have all these toys come from?’ Hiroshi Fuji

Page 4: Magic toy  shop - UXDi London 2014 - Project 2

An online toyshop that creates and re-creates

the magic moments of childhood.

The brief

Page 5: Magic toy  shop - UXDi London 2014 - Project 2

Curated

Mass Market

General e-commerce Toys

The opportunity

Page 6: Magic toy  shop - UXDi London 2014 - Project 2

Website Product page Navigation Check out NotesProduct reviewsSocial sharing

One click check-out Brand store

Categories Keywords

Brand stores

Edit basketStores multiple credit cards and addressesClear date of arrival

Powered by usersPersonalised

recommended items

Buy online/in store optionProduct tour (demo)

Might also interested in

Categories (10) Curated gallery

Mandatory registration

In store availabilityOn shelf promise

Email offersGift card

Toy safety Quantity / review

Social sharing Delivery / returns

Recommended age

Categories (10)Curated gallery

(brand, sub-subcats) Offers

Four steps check out Progress signals

Invoice information upfront

Pictures show the toy, not the box.

Only kids oriented,Functional

descriptions

Reviews + site repliesSocial sharing stats

Similar productsHeart availability / tags

Categories (9) newTop 50

Last chance

Four steps check out Justifies phone number request

Postcode automatic Look up

Pictures are curated! All objects in a

context

Quantity Availability

Themes Recommended by

buyers / shop history telephone number

Vertical form Too many steps

Boring tone of voice

Pure curation, no personality

What competitors do well

Page 7: Magic toy  shop - UXDi London 2014 - Project 2

As efficient as Amazon !

As surprising as Firebox !

As cozy and delightful as your favourite toy shop

The experience

Page 8: Magic toy  shop - UXDi London 2014 - Project 2

Designing for your users

‘He tells me what he wants - the problem

is to find it’

John

Tamsin Dexter

‘If I get her the cool stuff, she will think I am

a cool dad’

‘It’s not whether I can afford it, it’s weather I

can afford NOT to have it!’

Page 9: Magic toy  shop - UXDi London 2014 - Project 2

Designing the experience

Encourage Discovery

Support Buyers Decisions

Drive Sales & Delight

Page 10: Magic toy  shop - UXDi London 2014 - Project 2

Encourage Discovery

Page 11: Magic toy  shop - UXDi London 2014 - Project 2

One click to brand pagesDate

Notes

Title

g-design.net

>

Home Brand

>

Page 12: Magic toy  shop - UXDi London 2014 - Project 2

Support Buyer Decisions

Page 13: Magic toy  shop - UXDi London 2014 - Project 2

‘Ask someone’

Page 14: Magic toy  shop - UXDi London 2014 - Project 2

The expertsDate

Notes

Title

g-design.net

Help page Product Page

Page 15: Magic toy  shop - UXDi London 2014 - Project 2

The magic bagDate

Title

Notes

g-design.net

Page 16: Magic toy  shop - UXDi London 2014 - Project 2

Prototype

Drive Sales & Delight

Page 17: Magic toy  shop - UXDi London 2014 - Project 2

Check out process

ConfirmationPayment Bag

DateTitle

Notes

g-design.net

DateTitle

Notes

g-design.net

DateTitle

Notes

g-design.net

>> >>

Page 18: Magic toy  shop - UXDi London 2014 - Project 2

What’s your favourite toy?Date

Notes

Title

g-design.net

>

Form Discount

>

Page 19: Magic toy  shop - UXDi London 2014 - Project 2

Testing with users

Livia, Mum of Agata

Page 20: Magic toy  shop - UXDi London 2014 - Project 2

Results pages

Test page Final version

Page 21: Magic toy  shop - UXDi London 2014 - Project 2

Testing prototype

Final version

Messaging

Test message

Page 22: Magic toy  shop - UXDi London 2014 - Project 2

Demo

http://invis.io/5QYJS7NX

Buy a beginner’s level magic trick

Clickable prototype:

Page 23: Magic toy  shop - UXDi London 2014 - Project 2

Next steps

!

With your help,create magic content

Gather statistics and run A/B testing on the homepage

!

Monitor sales and engagement !

!!!

Page 24: Magic toy  shop - UXDi London 2014 - Project 2

Thanks!