Visual Design — part 1
Taking my wireframe to hi-fi with user testing and validation
The purpose of this personal project is to pick up at where I left off on my Kensington is Kensington project
User Research and MVP were done, and here is the mobile-first wireframe design:

Desktop design:

To refine and iterate, I sent the mobile version to UserTesting.com for feedbacks
The basic scope is really to find out if users can recognize what kind of site this is at a basic wireframe stage; can they navigate? ; and how do they feel or find the function of blogging on a e-commerce site.

Tests with 5 Primary Persona’s demographic, then, created affinity diagram to sort and define feedbacks.



Key User-Testing feedback:
- 1/5 user questions why would there be blog inside an e-commerce site, if so, what is the purpose of each blog
- 5/5 users can’t find the actual blog post; 1/5 user is confused after clicking Blog
Validated through User-Testing:
- 5/5 testers can figure out this is an e-commerce site without much explanation or guessing
- 5/5 users can finger out where the menu is and what each category in the menu do
- 3/5 testers are interested in reading blogs if they are relevant to what they are shopping for or looking into (restaurant, grocery type etc)
- 2/5 users said they like how this is more than just product with events, restaurant, and grocery: “there is a lot that you can explore”, which is exactly what Kensington is about
(Wireframe is further refined based on feedbacks — Blog section and its flow redesign)

Visual Design — part 1
Kensington is Kensington’s main visual message: Diversity
Inspirations:

Identity, Mood board and Style Guide:


To be continue …
Other UXUI projects: SafeMap, AskMom, FeedBack, Connects Fashion Professional, A Trackable Start for Eva’s Initiatives
