Portfolio Architecture +Design 2013-2016
2
CONTENTS Springboard Survey Analysis
03
Heuristic Analysis
04
Empathy Maps
05
Personas
07
Site Map
09
Card Sorting Analysis
10
User Flow
11
Wireframing
14
Style Guide
16
Research Wrap Up
17
2
Gift-urp A New Gift Giving Experience Research Analysis: Daniel Cho
Research Statement The research is used to understand and learn more about peopleÂ’s thoughts, emotions and behaviours as they make their decisions to purchase gifts for another. The purpose of Gift-urp is to make this gifting experience more enjoyable, quick, and easy.
Online Survey
3/4 97%
90%
of testers spend more than two hours searching for gifts. of testers spend less than two hours decorating for gifts.
YET! of buyers use computers to purchase gifts
66.7%
72%
of testers believe in the importance of decorating gifts. Who do you most frequently buy gifts for?
5.1% Coworkers
43.6% Family
12.8% Friends of buyers use smartphones to research gift ideas
38.5% Lovers
Common Words Used:
Demographics:
39 Participants
Money 33.3%
Personality want
66.7%
Needs
Joke
Hobby
Function
Like
Price
Interests 3
Heuristic Analysis https://www.etsy.com/ Visibility of system status The content on etsy is quite simple with enough information for the user to navigate through. The navigation system is very visble and simple. The cart and different registeration is visible to the user. The search bar is the largest element in the page, showing the emphasis of its function. The categories are divided into different sizes to show the heirarchy between the seasonal products versus the daily products.
Match between system and the real world The vocabulary of the page is quite consistent and easy to understand. There are no jargons nor words that are unknown. Instead, they are short and straightforward.
User Control and Freedom There are options in the top left to revert to the previous page without the back button. Moreover, the user can return to more general category. The <- arrows help show the navigation system of the hot key.
Consistency and Standards The page follows the consistency of the modern world. There are no words or actions that are unpredicted and surprising.
Recognize rather than recall Everything is recognizable and visible to the user. All the objectives have clear instructions and the page seem quite orderly.
Aesthetic and minimalist design There are no overly done designs. The background is neutral in color, and the hot keys are similar in color scheme so that the user is not overwhelmed by a vast number of colors. However, the video in the homepage may be a little distracting.
http://www.uncommongoods.com Visibility of system status The navigation bar of this page is simple and brings in the basic requirements of the search bar, the different categories, and the cart. However, I do not see a register or a sign-in anywhere. Moreover, its odd and redundant how there is another category bar in the left side, while there is one at the top of the page.
Match between system and the real world The use of words are !ne, but one of the phrases had me confused. It went like Problems you didn t know you had-SOLVED . I at !rst ready it as Problems you didn t know you had solved and it confused it me, but after reading a second time, I understood the intention. However, the text should not put any user in that position.
User Control and Freedom There are really now methods to go back other then using the back button or the home button in the page. I do not see the placement buttons where one would see how deep they have gone into the webpage, nor any methods to go back.
4
Empathy Map Desire -give a personalized gift -give happiness to the reciever -show love and effort through the gift
Emotions
Motivators
-excited to give a gift -anticipation for reciever to use the gift -anxiety of decorating -stress to choose
-needs to be meaningful -method of showing love and care -not cool to bring in a unthoughtful gift
The I m Not Creative Fellow
Pain Points
Do
-doesn t know how to decorate -scared of ruining the gift -doesn t like decorating -uncon dent to be creative -no time to be creative or more creative
-easier if told what to gift -spends more money in place of creativity
Summary -There needs to be a method to encourage users to be creative without spending too much time and overwhelming them with multitude of options. -The process of gift giving should be easy and pleasing rather than stressful and full of anxiety. -There should be a method to personalize the gift with ease, creativity, and speed.
5
Empathy Map Desire -easily choose the perfect gift -be creative within a short period -know what the reciever wants
Emotions
Motivators
-excited to give a gift -anticipation for reciever to use the gift -anxiety to nd the time and place -stress of choosing quickly
-needs to be meaningful -reciever needs to nd it useful -method of showing love and care -not cool to bring in a unthoughtful gift
The Busy Gifter
Pain Points
Do
-no time to decorate -no time to ponder on choosing -spending time on gift is secondary
-easier if told what to gift -spends on more expensive gifts -gifts are more broad, than speci c
Summary -There needs to be a method to quickly ascertain what gift is great for the userÂ&#x2019;s reciever. -The credit of choosing the gift should go all to the user; the interface should play a supporting role. -The process of gift giving should be easy and pleasing rather than stressful and full of anxiety. -There should be a method to personalize the gift with ease, creativity, and speed.
6
Persona Pro les
The I m Not Creative Fellow DEMOGRAPHIC GENDER
AGE
INCOME
Male
18-25
In Debt
LOCATION Collegetowns, College Campus
EDUCATION Undergraduate, Graduate Programs, First Career Job
DESIRE
BIO
- give a personalized gift - give happiness to the reciever - show love and effort through the gift
The user is a college student at the University of Illinois UrbanaChampaign. He is currently majoring in electrical engineering and is always busy with his exams and papers. Outside of school, he likes to watch Netflix, go drink with friends and browse through internet memes and other things with his phone and computer. He wants to gift his brother something special and personal, but doesn t believe he has the creativity and time.
PAIN POINTS
TECHNOLOGY
- doesn t know how to decorate - scared of ruining the gift - doesn t like decorating - uncon dent to be creative - no time to be creative or more creative
INTERNET SOFTWARE MOBILE APPS SOCIAL NETWORKS
PERSONALITY Extrovert
Introvert
Sensing
Intuition
Thinking
Feeling
Judging
Perceiving
Assertive
Turbulent
7
Persona Pro les
The Busy Gifter DEMOGRAPHIC GENDER
AGE
INCOME
Female
18-25
In Debt
LOCATION Collegetowns, College Campus
EDUCATION Undergraduate, Graduate Programs, First Career Job
DESIRE
BIO
-easily choose the perfect gift -be creative within a short period -know what the reciever wants
The user is a college student at the University of Illinois UrbanaChampaign. She is currently majoring in nance and is always busy with her sorority, club events, school, and social life. She is always active and has no energy to focus on things outside of college. Her best friend from high school is having a birthday party, but she is unable to attend to due her busy lifestyle. She wants to send a personalized creative gift, but does not have the time to do so.
PAIN POINTS
TECHNOLOGY
-no time to decorate -no time to ponder on choosing -spending time on gift is secondary
INTERNET SOFTWARE MOBILE APPS SOCIAL NETWORKS
PERSONALITY Extrovert
Introvert
Sensing
Intuition
Thinking
Feeling
Judging
Perceiving
Assertive
Turbulent
8
9
Share/Publish
Edit
Pro!le Building
Check Out
Inventory
Decorate
Quiz
Shopping Cart
Start from Scratch
Design Lab
Storytelling
Recipient
Search
Purchase
Explore
Learn
Inspiration
Works
Blogs
Artists
Home Page
My Designs
My Pro!le
Orders
Wishlist
My Account
FAQ
Tasks
Purpose
About
Gift-urp A New Gift Giving Experience Daniel Cho
Card Sort Four users were asked to participate in a card sort. These users came from different backgrounds, but were all residents of Urbana and Champaign. These users did not necessarily all fit the personas I had built, but many of them shared similar desires and problems with the personas. From the card sort, several similarities arose. The category recipient, recipient information, and recipient gift were spoken often in defining the tasks that focused on the recipient. The about, information, general information, etc were all written many times. Purchase was a stable use in the exercise. Lastly, the category title design was used many times too. From the category titles the content was created through the about page, recipient page, purchase page, and the design page. Some of the difficulties of categorizing the cards was the fact that many tasks fit in not only one, but many categories. Moreover, some of the tasks were to broad to exactly name a category for the task. The users understood some of the main points from the tasks such as that these tasks pointed to purchasing gifts for recipients and to decorate the gift. However, they failed to understand the aiding of choosing gifts and the inspiration process of encouraging users to be creative and have a design oriented mind.
10
11
Yes
Account Accepted
Profile Building
Splash
No
Home Page
Error
Sign In/ Sign Up
Sign Up
Create Account
Sign Up As Artist
User Flow 1 Logging in or Signing Up
Yes
Signed In
Sign In Page
Sign In
No
Error
12
User Flow 3 Artist Perspective
Details
Other Artists
Upload Art Work
Yes
Account Accepted
Error
Save
Design Lab
No
Sign Up
Profile Building
Sign Up As Artist
Create Account
Sign In/ Sign Up
Splash
Edit
Publish/Share
13
Denied
View User Flow 1
Error
User Flow 2 Using the Recipient Build
Quiz
Review Order
Gift List
Add to Cart
Check Out
Continue as Guest
Sign In/Create Account/ Continue as Guest
Results
Results
Check Out
Credit Info Shipping Info
Storytelling
Profile Build
Complete Order
Authenticate
Recipient
Reciept
Home Page
Splash
No Results
Design Lab
Error
No Results Page
Product Page
Artists
Inspirations
High Fidelity Wireframes
14
15
Gift-urp A New Gift Giving Experience Style Guide: Daniel Cho
Colors The colors for Gift-urp consist of the different shades of blue with some hint of green. The more neutral colors are the white and the dark grey.
#1D98A2
#A4DAD7
#61C2A6
#FFFFFF
#004760
#231F20
Typeface Roboto is the font-type that will be used for this project. It is commonly seen in Google and Android, so the familiarity will aid in the ease of reading.
Header :
Roboto Medium 24pt
Title :
Roboto Medium 20pt
Subheader :
Roboto Regular 16pt
Body :
Roboto Light 14pt
Call to Action Buttons
Search
Add to cart
Sign In
16
Gift-urp A New Gift Giving Experience Style Guide: Daniel Cho
Main Tasks Buy a gift The users were able to purchase a gift or reach the check out point. However, they were confused by the lack of access to categories of gifts. Most of them used the search bar to reach the check out point.
Look for artists and friends The users were able to !nd the artist easily and view their friends news feed, but the search for certain artist and friends or !lters for the artist they wanted to search for were unavailable.
Use the profile building tool. The users were unable to purchase a gift through the pro!le building tool because it was not complete and lacked the path to the check-out.
Design a gift The users were able to easily reach the design tool because it was accesible at three different points in the process, home page, product detail page, and the check-out page.
Look for Artists The users were able to !nd the artist easily, but the search for certain artist or !lters for the artist they wanted to search for were unavailable.
Summary In conclusion, the testing went really well for the most part. There were many missing pieces in the wireframe, therefore, the users weren t able to accomplish some of the tasks. However, for the functions that were available, the users were able to quickly run through the paths without any hindrance. The transition from the design lab tool to the checkout was most confusing for the users. They didn t under-stand how the pricing worked. However, most of the users thought that many of the functions were similar to social media they were comfortable with such as Snapchat, Soundcloud, Facebook, and Instagram. There were three users tested. One of them !t into the I m not creative persona and the other two !t into the busy persona. Two of them were females and one was male. All of them were between the ages of 20 and 24 and attending the university of Illinois Urbana-Champaign. They all were experienced with shopping through technology and were all heavy social media users.
17