General Assembly Final - Scope

ux Design melanie araujo

1Tuesday, October 15, 13

Table of content

1. vision 2. competitive analysis3. user research4. personas5. user flow6. wireframes7. desktop prototype


vision

1


problem

discover who is around you while making the most of where you are.


solution

allow users to scope the scene around them and see where people checked in and make it easier to connect with others.


Competitive Analysis

2


Tinder

SKOUT

Swoon

Hinge


Tinder


Tinder1. sign in via facebook and no second step2. if both parties like each other a private chat box appears3. swipe rated each 13 billions time since september 20134. August 2013 -3 billion matches5. 11 times per day average app user, 7 minutes at a time6. real accounts because populated with facebook7. location function rounding to the nearest mile8. can't send photos or video9. App Store top 25 social networking application10. 1.5 daily matches


Swoon


Swoon1. Color Scheme is meant to resonate with female users2. Look Back feature that works by shaking phone3. introduces strangers based on mutual interest 4. Both parties must show interest before chatting 5. In app chatting6. Larger photo 7. Photo carousel8. Female users can share profiles via text9. sign in via Facebook


HINGE


Hinge1. shows you trustable friends of friends2. sign in via Facebook3. Advance profile4. Sends a cute half-truth icebreaker if there is a match5. does not monetization 6. at noon, the app gives you a group of friends to check out7. scale of 1-5, match if you rate over 4 8. introduces via email


SKOUT


Skout1. sign in via Facebook2. allows users to meet new people, make friends, exchange pictures3. Grid View of people who are online at that time4. wink, start a chat, add them to a favorite list, send a virtual gift, alerted when they come online5. shake to chat with random and reveals users profile in 40 seconds6. Activities on Skout is points driven Basic features require points 7. large # of fake profiles, relatively little conversations going on8. monetization over socialization9. $3.99 to get rid of ads


1 Task1 goal7 participants

usability testing with tinder


goal:to see if it works as it is intended.

Task:You're not currently dating anyone but you’re interested in meeting new people who share similar interests. A friend has been very happy using Tinder, so you decide to download Tinder. Sign-in and start meeting new people.


usability test with tinder


usability test with tinder


usability Findings• user doesn’t use facebook & reduces potential users• launches first time user right into app without preparing

user• Hard to close out of profile and navigate app• match preferences (age, gender) do not display immediately• doesn’t prompt user to input interests however displays

information• Pulls decision screen to quickly and is not readable

7 participants (4M/3f; 25-42 years old)


USER RESEarch

3


A google survey with 41 participants (18 Females and 11 males) was conducted to understand what to build and who to build for.

12 questions were asked, 4 of the 12 questions were designed as distractors. findings from the 8 of questions were used to understand who to build for and what to build first.

three user types were identified.


what’s your current relationship status?

What’s your name and age? what kind of phone do you own?how many hours do you spend online?

Have you ever set up a blind date? or been on set up date?what are some things you do before going on a first date?what actions you would take to set up a date?Notifications from a stranger? dating sites?What sort of things would you do to get someone’s interest?

what do you live online (online communities)?

app feature?22Tuesday, October 15, 13



Have you ever set up a blind date? or been on set up date?what are some things you do before going on a first date?what actions you would take to set up a date?Notifications from a stranger? dating sites?What sort of things would you do to get someone’s interest?


app feature?23Tuesday, October 15, 13



set up a blind date? or been on set up date?things you do before going on a first date?actions you would take to set up a date?Notifications? dating sites?things you do to get someone’s interest?


app feature?

tell me who my users are.

attitude.

emotions. knowledge.

open-mindedness.behavior. needs.

behavior. needs.

behavior. needs.


Sample excepts from user research

41 responses; reported on 29 participants (22-39 years old, 11 males, 18 females, 28 iPhone users)

give here the magic wink. its golden

To be honest, I've never gone past simply telling one of my single friends about "how you should totally meet my friend XYZ" ...and then I totally forget about doing anything about it.

figure out her interests, find a restaurant she'll like or a movie she'd wanna see

Make a list of radical feminist things I shouldn't say... yet.

Umm... never really have. I've introduced people at the club as a wingman, and the two become boyfriend/girlfriend though. I knew she was his type, and just did wingman type stuff.

I usually invite 2 people I think would like each other to the same event/bar/party & introduce them when they get there. I try not to build it up too much for either of them to make it less awkward.

I normally try to strike up a conversation and see where it goes from there.

Oh geez. I'd probably start on social media! Following, engaging and interacting, and getting to know more about him from a safe distance.

I would tell them to meet me somewhere, show up and then introduce them and make up an excuse to leave but encourage them to stay.


survey findingsA-type users has no interested in setting up dates or going on blind dates. However if they had to set up a date, they will invite and introduce the person or play the wingman if he is already out. Other then that they are not really interested in going out of their way to set up dates. They are extremely intrigued and interested to get a secret admirer note and it’s is important for this user to be able to connect and chat with their admirer via chat as they prefer online conversation to in-person interaction. Lastly, a profile with basic information such as interests, likes and hobbies along with a picture is important in helping them to plan the first date

(5/7 single males 24-33). This user is single, males and ave. 29 yrs.


survey findingsB-type users is ave. 27, single, females recently and has never set up friends on dates but has taken part in a date that was set up. Whether it is a blind date, speed dating, by a stranger, Facebook or in-group setting where they’re friends invites potential matches; this user is very much open-minded and likes to try new things. Unlike A-type user, this kind of user prefers the traditional interaction, in-person method to grab someone’s attention rather then online conversations. They’re super social, outgoing and have a good sense of humor. Appearance is important to them. So before the first date, this user will invest considerable amount of time to in their makeup, hair and outfit. They will even go as far as shopping for a new outfit and maybe even hitting the gym. Although super open minded, its important to these users that they are able to turn on and off notifications from admirers and be able to block users.

(11/14 females; 6/11 in relationships; 24-39).


survey findingsC-type users are also social butterflies but not as free spirited and open mind as B-type users. These folks are usually in a relationship or are married. They have tons of friends and they will only set up dates if they are asked to. Otherwise, similar to A-type users these guys will do only the bared minimum and invite their single friends to an event. They also prefer to in-person interaction rather then online conversations. These people don’t like notifications from secret admirers and it has a lot to do with the fact they are in relationship. However they are not as mean as A-type users and they want their friends to be happy because these people like to have happy people around them. So they set up friends via group setting but won’t initiate the connection until they are approached.

C-type user is ave. 30 yrs female the is in a serious relationship (22-35, 7/8 females, 6/8 relationship/married)


Personas

4


Er!"#, 26

open minded

confident about herself in social situations

remembers everyone she meets name

prefers in-person to online

filter through people she’s not interested in

A way to meet new people while she's out

meet new people while exploring her surroundings

doesn’t want to miss out on events

“the ultimate extrovert”


A$%r&w, 29

works long hours

not 100% open-minded but will push himself

prefers to express interest via social media

wingman for his friends

simple to use, to connect with others online, BAsic profile

meet new people with similar interests

ability to check out the scene

recommendations; needs a reason

“The economical user”


L#'r&$, 36

engaged and outgoing

likes to be in charge and liked by her friends

prefers things, people, activities that are non-threatening, friendly

in person interaction to online

ability to connect with others in the same space

make coordinating with friends easier

meet new people while being supportive of her single friends

“The facilitator”


user flows

5


system sends a

reset link

Forgot Password

Page

user taps submit

user taps on forgot pass link

System flow Charttake use to sign up flow

Launch App Login Page Sign in

page Is login

information valid?

N display error msg

Homepage with Map

Is GPS on? Y

N display error msg

user taps to sign in Yuser taps

go user taps on

drop pin

B) Sign in with OkCupid

with forget pass link

user taps go

user taps to sign up


System flow Chart Cont’d

user taps to keep rating

Chat Room

Alert user of a

match

user taps to start

chatting

Y

Alert Message "will notify when

new people check in or if

there is a match"

Y

Recommendation Page with nearby

users

user taps on rec page

Location Information page with

checked in info

Is user in vicinity?

Rating Page

Is there a match?

user taps to check in Y

N

Is user at end of rating page?N

user rates other

profiles

N display error msg


Sign up user flow

Launch App Login Page Sign in

page Is login

information valid?

N display error msg

Homepage with Map

Is GPS on? Yuser taps

to sign in Yuser taps go

user taps on drop pin

Create New Account

Are all fields completed?

user taps to sign in

N display error msg

Y

user taps go on keypad


Sign up user flow cont’d

user taps to keep rating

Chat Room

Alert user of a

match

user taps to start

chatting

Y

Alert Message "will notify when

new people check in or if

there is a match"

Y

Recommendation Page with nearby

users

user taps on rec page

Location Information page with

checked in info

Is user in vicinity?

Rating Page

Is there a match?

user taps to check in Y

N

Is user at end of rating page?N

user rates other

profiles

N display error msg


6

Wireframes


4.0

3.0

1.0

2.0

Homescreen

3.0 Login Button

4.0 Sign Up Button

1.0 Email Text FieldIf user taps in this text field, then slide screen up and show Sign In Page. Otherwise, keep text field as display.

2.0 Password Text FieldIf user taps in this text field, then slide screen up and show Sign In Page. Otherwise, keep text field as display.

If user taps on this button, then slide screen up and show Sign In Page. Otherwise, keep button as display.

If user taps on this button, then slide screen up and show Create New Page. Otherwise, keep button as display.


Login In page

3.0 Password Reset

4.0 Sign Up Button

1.0 Email Text FieldIf user taps in this text field remove ghost and show cursor. Otherwise show ghost text.

2.0 Password Text FieldIf user taps in this text field remove ghost and show cursor. Otherwise show ghost text.

If user enters incorrect information after attempting to login, display question mark.


5.0 Login ButtonIf user taps to login and information is valid, take user to Home/Map page.

6.0 Go Button If user taps to login and information is valid, take user to Home/Map page.

1.0

6.0

3.0

5.04.0

2.0


2.0

3.0

1.0

4.0

5.0

6.0

7.0

Sign up / create new

4.0 Email Address Text Field

5.0 Password Text Field

1.0 Back ButtonIf user taps on the logo, it will take user to the previous screen - Login in Page

3.0 Username Text FieldIf user taps in the text field, ghost text disappears show blinking cursor.

If user taps in the text field, ghost text disappears show blinking cursor.

If user taps in the text field, ghost text disappears show blinking cursor.

6.0 Gender Input FieldIf user taps in this input field display a dotted square around selection.

7.0 Birthday Input FiledIf user taps into this input field, automatically display iOS 7 number keyboard

2.0 Photo Input If user taps on photo input, display message "upload from camera roll or take new"


Forget password

1.0 Back ButtonIf user taps on the logo, it will take user to the previous screen - Login in Page

2.0 Email address text fieldIf user taps in the text field, ghost text disappears show blinking cursor.

3.0 Submit ButtonIf use taps on the submit button, send user reset password link

4.0 Go ButtonIf use taps on the submit button, send user reset password link

1.0

3.0

4.0

2.0


5.03.0

1.0

6.0

4.0

2.1

2.3

2.2

7.0

Homepage - map1.0 Header

2.0 Navigation 2.1 If user taps here, take user to Profile Page. 2.2. If user taps here, take user to Account Setting Page. 2.3 If user taps here, take user to Chat Page

3.0 Drop Pin

4.0 Drop Pin BannerIf user taps on drop pin, show banner with name of place. If user taps on drop pin second time, close banner.

5.0 Forward ArrowIf user taps on forward arrow, take user to location detail page.

6.0 MapIf user holds down on map and move, shows the area the user moved to with drop pins. If not display a map with paid drop pins based on user location.

7.0 GPS locationIf user taps on this button, readjust map and show user's current location.


2.0

1.0

3.0

5.0

4.0

6.0

Location detail page

3.0 Check in Button

4.0 Sub-header Text

1.0 HeaderIf user taps here, take user to previous page. In this case, take the user to Home - Map.

2.0 Location Name & DetailShow user information about the location. Include address, hours of operation walking distance.

If user taps on this button, check user into location and display a blue button with "Checked In" and take user to rating page. If user taps on button for the second time, check user out and show "Check In" button.

Display direction on how to navigate displayed screen.

5.0 User Profile PhotoDisplay a distorted image of user. If user taps on profile take user to selected user profile page.

6.0 Sliding ScrollIf user holds down, slide feed down and show photos of user checked in.


4.0

5.0

2.0

1.0

3.0

RAting page

1.0 HeaderIf user taps on the header, take user to location detail page. If not show user rating page after user has checked in.

2.0 Floating ProfilesDisplay stack of distorted profiles to tease user and increase engagement. Move forward as user rates profiles. As user reaches the last few profiles, reflect change in the number of profiles.

3.0 Current ProfileIf user taps on photo, take user to profile page. Otherwise display as the primary profile and pull away after user rates.

4.0 Yes ButtonIf user taps on yes, store data for future matches. And pull to top right corner.

5.0 No ButtonIf user taps on no, pull away to the bottom left corner and store in do not match pile.


user profile page

4.0 Username and age

2.0 Rating ButtonIf user taps on either of the rating button, store data. This is another opportunity to allow users to cast vote while viewing profile.

3.0 User Profile PictureIf user taps on photo, take user to the rating page. Otherwise show this screen.

Display information enter by the user when registered. Allow users to edit this section in under the profile setting.

5.0 User Bio

HeaderIf user taps on the header, take user to previous page. If not, keep user on this screen.

1.0

4.0

5.0

1.0

3.0

2.0


6.0

4.0

1.0

5.0

3.0

2.0

match alert message

3.0 Login Button

4.0 Sign Up Button

1.0 Email Text FieldIf user taps in this text field, then slide screen up and show Sign In Page. Otherwise, keep text field as display.

2.0 Password Text FieldIf user taps in this text field, then slide screen up and show Sign In Page. Otherwise, keep text field as display.

If user taps on this button, then slide screen up and show Sign In Page. Otherwise, keep button as display.


5.0 Sign Up ButtonIf user taps on this button, then slide screen up and show Create New Page. Otherwise, keep button as display.

6.0 Sign Up ButtonIf user taps on this button, then slide screen up and show Create New Page. Otherwise, keep button as display.


3.0

4.0

2.0

1.0

End alert message

3.0 Recommendation Button

4.0 Back to Map Button

1.0 Message HeaderDisplay alert message header.

2.0 Message SubheaderDisplay alert message sub header.

If user taps on this button, take user to recommendation. Otherwise show end alert message.

If user taps on this button, take user to homepage map. Otherwise show end alert message.


7

Prototype


usability FindingsRound one - original copy didn’t resonate with user- user sign up represent with camera or person - redesign search bar from bottom to top right of screen- thumbnail instead of person icon

Round two - distort images didn’t resonate with user (distracting)- icon representing


desktop prototype
