Issuu on Google+

Personal Stylist App process book


A


table of contents Taskflows

3-4

Wireframing

5-6

Prototyping and User Testing

7-8

Finished Prototype

9-20

A


taskflows Taskflowing was the first step after solidifying my personal stylist idea. The first two are lower level taskflows, where I then broke it down at a higher level in terms of user experience.

3


4


wireframing After finalizing my taskflow, I began developing wireframes. I started with a less detailed sketch, and began refining it after receiving user feedback.

5


6


paper prototyping I then made mockup paper prototypes and tested it on user’s to determine how the app was in terms of navigation, consistency and usability.

7


Search

Personal

Email.....................................

Out�it Generator

Password............................

Sign In

Log In

Sign Up

Search

0

0

Browse Brand Browse Color

Browse History

Generating your out�its...

Search

Search

Search

Search

3

Personal

Hooded Striations Dress $ 78.00 add

Out�it Generator

Shopping Cart

delete

Edge to Edge Blazer $ 148.00

Thanks for shopping with us, Chelsea! You’ll be recieving a confirmation email shortly.

Hooded Striations Dress $ 78.00 add

1

delete

Checking out...

Isabel Mini Wedges $ 168.00 add

Out�it 2

Search

Browse Occasion

Search

Out�it 1

Search

Search

Isabel Mini Wedges $ 168.00 1

delete

Start Over

Aria Cardigan $ 98.00 Frill Blouse

1

8


final prototype The final prototype was coded in HTML5 through the program foundation. The buttons are fully navigatable, with a consistent search bar at the top. Each image was used from Anthropologie’s website, as well as keeping their store logo consistent to make the applicaiton look more authentic.

9


sign in screen

10


email screen

11


browse options

12


color selector

13


generated outfits

14


checkout

15


credit card forum

16


confirmation screen

17


19


20


User Prototyping Final