NVITE MOBILE APP

AFUSO DESIGN
NVITE MOBILE APP
Flow & Wireframes
Version 1
Published May 01, 2013
Created by Jeremy Afuso
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
2 of 21
Version 1.0
TABLE OF CONTENTS
3 BUSINESS POSITIONING STATEMENT
13 WIREFRAME - RSVP & SHARE
4 COMPETITIVE ANALYSIS - GIDDYUP APP
14 WIREFRAME - CHAT & CONTACTS
5 COMPETITIVE ANALYSIS - MEETUP MOBILE APP
15 WIREFRAME - CREATE EVENT 1
6 FEATURE COMPARISON CHART
16 WIREFRAME - CREATE EVENT 2
7 PERSONA
17 WIREFRAME - CREATE EVENT 3
8 USER/TIME CHART
18 WIREFRAME - PRIOR-TO-EVENT PERMALINK
9 SITE MAP
19 WIREFRAME - DURING-EVENT PERMALINK
10 WIREFRAME - LOGIN & MAIN SCREEN
20 WIREFRAME - AFTER-EVENT PERMALINK
11 WIREFRAME - PERMALINK
21 USER TESTING COMMENTS
12 WIREFRAME - GUESTLIST
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
Version 1.0
Introducing Nvite Mobile
For everyone who enjoys social events, Nvite mobile is an interactive
experience for planning, attending and engaging with these activities.
Unlike traditional online invitation services, Nvite mobile provides
a combination of simplistic and socially intuitive mechanisms
for increased engagement prior, during and after an event for the
symbiotic benefit of both the organizer and the attendee(s).
3 of 21
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
4 of 21
Version 1.0
COMPETITIVE ANALYSIS GIDDYUP MOBILE APP
POSITIVES
-
fast event setup
SMS style group chat with invitees
no sign up needed
geared towards impromptu events
recipients don’t need to download app to view
invite
NEGATIVES
- harder to organize larger events
- contact list is just from phone’s contacts;
doesn’t link to Facebook or Twitter contacts
- Doesn’t show past events
- invite is useless once event starts
- invitees can’t share the event
CREATE EVENT
EVENT PAGE
GUEST LIST
CHAT
MULTIPLE EVENTS
With spontaneous event in mind,
user can quickly create an event
User can click to begin process of
creating an event.
User can click to begin process of
creating an event.
User can click to begin process of
creating an event.
User can click to begin process of
creating an event.
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
5 of 21
Version 1.0
COMPETITIVE ANALYSIS MEETUP MOBILE APP
POSITIVES
EVENTS LISTINGS
MAIN NAVIGATION
EVENT SEARCH
COMMENTS
Upcoming and past events in a
list format.
Access to groups, search, and
settings.
Search for local meetups in map
or list mode.
Comments can be made within
meetup groups and events.
-
able to search for events
able to see invitees’ social links
easy to find events based on location and upcoming
can take photos in app
can rate events
NEGATIVES
- can’t create events
- scrolling guestlist can be cumbersome when list is long
- messaging system feels disjointed from events page
-
MEETUP GROUP
EVENT LISTING
GROUP MEMBERS
MEMBER PROFILE
Main page of a meetup group.
Contains essential information of
event, and who’s going.
List view of members.
Basic information along with
links to social pages.
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
6 of 21
Version 1.0
COMPETITOR
COMPARISON
UPCOMING, CURRENT AND PAST EVENTS
EVENT LISTING
SHOWS JUST UPCOMING EVENTS
UPCOMING AND PAST EVENTS
EVENT CREATION
ALL ON ONE PAGE
CAN’T CREATE EVENTS
SEQUENTIAL CREATION OF EVENT
CHAT
SMS STYLE
COMMENTS STYLE
SMS STYLE
HASHTAGS
NO
NO
YES
LIVE EVENT FEED
NO
NO
YES
SEARCH FOR VENUES
NO
NO, BUT ABLE TO SEARCH FOR EVENTS
YES
SPONSORS
NO
NO
YES
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
7 of 21
Version 1.0
BACKGROUND
TECH USAGE
COMPUTER SAVVY
Age: 27
Industry: Industrial Design
Computer Usage: 3 hrs/day
Gender: Male
Experience: 4+ years
Cell Usage: 1 hr/day
Location: Providence
Status: In a Relationship
Owns: Blackberry
Occupation: Furniture Designer
Education: BFA in Industrial Design,
MacBook Pro
RISD
“It’s hard work getting the
word out.”
MOBILE ENGAGEMENT
PROFILE
MOTIVATIONS & GOALS
FRUSTRATIONS
Miles is a recent graduate from RISD. He studied industrial design, and currently works as a
• Expand invite list to potential new
customers
• People that say yes to invite don’t show up
furniture designer for his own business and in collaboration with other furniture designers.
MILES ENDO
SOCIAL MEDIA ENGAGEMENT
• People ignoring invites
He resides in a live/work loft with five other designers, and is very active still within the RISD
• A better read on whether night will do well
community.
• Stir up more excitement for events
He doesn’t spend too much time on his computer, as he spends most of his days in the
• A packed night in the bar, leading to
better night for everyone and bigger
payout for the DJs
• Boring layout of Facebook Events; they don’t
show flyers well
IDEAL EXPERIENCE
SCENARIOS
• Easy to add people to invite list
• Miles has a party coming up in three weeks,
He wants to expand the invite list beyond
his RISD contacts, and has friends at Brown
University that have a lot of contacts.
woodshop or practicing his Taiko drumming. He uses his computer for communicating with
clients and research, and doesn’t really keep up with the latest in technology. He does use
• People that move away but don’t update
profile
Facebook often though, and uses it instead of email to communicate with friends.
He also DJs a couple times a month, and is in charge of creating and sending out a Facebook
Event for each party. He manages the Musician Page for his DJ crew, so he tends to invite
everyone from this list, along with his friends that still live in the area. He wants to expand this
list to reach beyond his RISD contacts, and is trying to find ways to bring in new people.
He is finding it more difficult in getting people to commit to coming to his parties, or even
responding to them since they occur so regularly that he finds people are starting to ignore
them. He also finds it hard to predict how well a night will go based on the Facebook event
• Easy to find possible new participants based
on location and network
responses, as nights when a lot of people say yes still have a chance to not succeed, and vice
• Can keep track of who opens invite
versa.
• Can post last minute details, as well as keep
people updated through the night
• Can add photos & music from last event
• Miles just booked a popular local guest DJ a
couple days before the party, and wants to
get the word out fast.
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
BEFORE EVENT
ORGANIZER
GUEST
- CREATE EVENT
- POST EVENT
-
8 of 21
Version 1.0
RSVP
SHARE
ADD TO CALENDAR
RESEARCH INTO
OTHERS ON GUESTLIST
HOUR BEFORE EVENT/
DURING EVENT
AFTER EVENT
- SEE WHO’S CHECKED IN
- CHECK INCOMING
HASHTAGGED CONTENT
- CREATE SLIDESHOW
- ORGANIZE TIMELINE
- GET DIRECTIONS
- CHECK IN
- ADD CONTENT THROUGH
HASHTAGS
- SEE TIMELINE
- WATCH SLIDESHOW
- STILL HAVE ACCESS
TO GUESTLIST
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
9 of 21
Version 1.0
NVITE
MOBILE APP
Login
Create Event
Invitations
Event Details
Preview
Publish
Contacts
Your Events
Invited To
Messages
Settings
import
contacts from
social media
Privacy
bookmark
from events
guestlist
About
See Who's
checked in
RSVP
edit hash
tagged content
Share
Contact
thank you
message
Directions
How We Work
edit timeline
Check in
Look at
guestlist
add hash
tagged content
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
10 of 21
Version 1.0
LOGIN & MAIN LOGIN
SCREEN
& MAIN SCREEN
1. L
OGIN SELECTION
Choose from Twitter, Facebook, LinkedIn or
email to login with.
2. U
SERNAME AND PASSWORD
If already logged in, this screen with be skipped
to main screen. If not, username and password
is needed.
YOUR EVENTS
WELCOME
9
UPCOMING
11 TUE, FEB
26
6-10pm
FRI, FEB
29
7-9pm
1
2
SUN, MAR
12
Username
2-8pm
Password
SAT, MAR
18
3
7-10pm
LET’S GO!
10
3. L
OGIN BUTTON
PAST
SF BALLERS PRESENT
San Francisco
Dribbble Meet-up
80
ATTENDING
4
4. H
OME TAB
Goes to Main Screen.
DAYS TO RSVP
JOSH WEXLER
Happy Hours at
House of Shields
BONNIE PHILLIPS
Birthday Party for
Bob Reynolds
TECH CRUNCH PRESENT
March Social
Mixer
8
ATTENDING
7
5. C
REATE EVENT TAB
Goes to first page of create event sequence.
DAYS TO RSVP
20
ATTENDING
20
6. C
HAT TAB
Goes to Chat list view page.
DAYS TO RSVP
67
ATTENDING
26
DAYS TO RSVP
7. C
ONTACTS TAB
Goes to Contacts page, where user can organize
list of contacts pulled from different social
sources.
8. S
ETTINGS TAB
Goes to settings page where use can adjust
privacy and other settings.
4
5
6
7
8
9. UPCOMING EVENTS
List of upcoming events, including users own
events..
10. P
AST EVENTS
Archive of past events, which have access to
Timeline and the Guestlist.
11. E
VENT LISTING
Shows event and updated information about it.
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
11 of 21
Version 1.0
PERMALINK
1. B
ACK BUTTON
Goes back to previous screen.
1
BACK
2
NVITE
COUNT ME IN
NVITE
BACK
3
5
2. S
HARE BUTTON
Opens up share screen to forward event to
friends via email, or post to social media
(Twitter, Facebook and LinkedIn).
SEND REGRETS
San Francisco
Dribbble Meet-Up
4
COUNT ME IN
SEND REGRETS
7
8
TUESDAY, FEBRUARY 26
Add to calendar
5:30 PM - 8:30 PM
UNION HALL
Get Directions
DRIBBBLEAUG
The Twitter Design team is
sponsoring another Balllers
meetup at Union Hall, on
Tuesday, February 26th from
5:30-8:30pm. Come talk shop
over great food and drinks at
this killer venue! Drinks and
food on Twitter’s tab.
See Gallery
BACK
MORE
6
9
GUEST SPEAKERS
3. R
SVP BUTTONS
Choice between “Count Me In” and “Send
Regrets.”
4. G
UESTLIST STRIP
Shows rotating stirp of guests invited to event.
Pressing arrow opens up guestlist page.
5. E
VENT INFORMATION
Shows relevant information about event,
including name, date/time, location, and
hashtag. Clicking “More” will open up more
information and images.
6. M
AP OF VENUE
7. S
PONSORS/HOST
Logos of sponsors helping with the event, or
avatar of host and contact info.
8. DESCRIPTION OF EVENT
9. IMAGES
Images pertaining to event that could be
scrolled though.
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
12 of 21
Version 1.0
GUESTLIST
1. G
UESTLIST LIST VIEW
2. M
INI PROFILE
Shows information about guest, including name,
job, linked social medias, and mutual friends of
user.
GUESTLIST
BACK
1
LIST VIEW
BACK
3
GALLERY VIEW
2
4
LIST VIEW
GUESTLIST
5
BACK
x
Greg Samuels
7
5. GUESTLIST GALLERY VIEW
@imgreg
Jess McDaniels
13 Mutual Friends
Kyle Lum
UX Designer at Google
4. S
OCIAL LINKS
Shows linked social media, and allows user to
open them with built in browser.
8
GALLERY VIEW
6
x
Graphic Design at Loku
3. G
O BACK TO EVENT PERMALINK
TWITTER
4,275
478
4,362
TWEETS
FOLLOWING
FOLLOWERS
4 Mutual Friends
FOLLOW
Paul Richards
CEO at Pagehub
9 Mutual Friends
Wes Madison
Product Manager at Adobe
18 Mutual Friends
Lisa Santiago
Art Director at Wikimedia
3 Mutual Friends
Leslie Carson
Copy Editor at SF Chronicle
Greg Samuels
@imgreg
Greg Samuels
@imgreg
New Post: The Rainbow Spreadsheet:
A Collaborative Lean UX Research Tool
http://bit.ly/14e4nfQ #UX #Design
New Post: A Case Study: The Art
Of Storytelling Around An App
http://bit.ly/1381sEI #UX #Design
3 Mutual Friends
Greg Samuels @imgreg
What are the most interesting and
creative responsive designs that
6. S
EARCH GUESTS
7. G
UESTS AVATARS
8. L
INKED SOCIAL PAGE
Opens up in built in browser.
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
13 of 21
Version 1.0
RSVP & SHARE
1. C
OUNT ME IN TAB
2. B
RINGING GUESTS
Allows user to include guests with RSVP.
3. R
SVP WITH SOCIAL MEDIA/EMAIL
Select from Twitter, Facebook, LinkedIn or email.
NVITE
BACK
BACK
1
NVITE
BACK
NVITE
4
COUNT ME IN
COUNT ME IN
SEND REGRETS
2
BRINGING GUESTS?
SEND REGRETS
LET’S GO!
SEND REGRETS
+
1 SORRY, I CAN’T MAKE IT
3
COUNT ME IN
5
but I would like to
follow the event
- have access to live event timeline
- have access to post event features
SEND REGRETS
6
SHARE THIS EVENT
WITH FRIENDS
4. S
END REGRETS TAB
5. F
OLLOW EVENT OPTION
Allows user to decline attending event, but still
follow it via the live Timeline.
6. S
HARE EVEN WITH FRIENDS
Use social media to send invite to friends via
email, or promote with Twitter, Facebook or
LinkedIn.
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
14 of 21
Version 1.0
CHAT & CONTACTS
1. L
IST OF CHATS
Organized by time of last comment. Clicking on
a chat will open up to chat screen.
2. C
HAT SCREEN.
3. A
LL CONTACTS VIEW
CHAT
1
BACK
Greg Samuels
4:30pm
Ballers Meetup
I talked to Brian about bringing in some...
Jess McDaniels
12:23pm
MARK
2
BACK
3
What time are you going
to the Balllers meetup?
4
Happy hours at House of Shields
I’m out front.
Kyle Lum
YESTERDAY
Maker Faire
Let’s grab dinner before the meeting
Paul Richards
SUNDAY
Dinner at Camino
Cool
Do you know if Taylor can make it?...
Wes Madison
Not sure... gotta take care
of work stuff, then walk
the dog. Around 6:30?
2/11/13
Tech Crunch Social Mixer
I think there will be some people there who...
Lisa Santiago
2/9/13
I’ll see you there. I have
some comps to show you.
Happy Hour at Beer Garden
Not since the last time we saw them. They...
Leslie Carson
1/23/13
Mark’s Birthday Party
Cool
Lisa Santiago
Bay to Breakers
I might be able to make it. Let’s see.
1/20/13
Right on... see you there
5
ALL
CONTACTS
6
EDIT
4. S
EARCH CONTACTS
7
GROUPS
x
5. CONTACTS AVATARS
6. E
DIT CONTACTS
user is able to login to social medias and pull in
select contacts from those.
7. G
ROUPS
Similar to Meetup groups, users can join groups
with regular events, and be automatically added
to guestlist for upcoming events.
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
15 of 21
Version 1.0
CREATE EVENT 1
1. E
VENT CREATION PROGRESS BAR
Allows user to see where they’re at in event
creation process. User can also skip forward or
backward by clicking on any part of progress bar.
2. N
AME OF EVENT
BACK
CREATE EVENT
CREATE EVENT
BACK
SAVE
SAVE
1
NAME
DATE
VENUE
DETAILS
GUESTS
PREVIEW
NAME
3
2
Start your event here
name of your event
NVITE makes event creation easy
by allowing you to save your invite
at any time, and come back to later.
DATE
VENUE
DETAILS
M
1
7
8
T
PREVIEW
4. T
IME INPUT
4
FEBRUARY
S
GUESTS
W
T
F
S
2
3
4
5
6
9
10 11 12 13
starts at
ends at
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29
4
5
3. D
AY OF EVENT
If event happen over more than a single day, both
days will be highlighted with different color boxes.
6
7
50
55 AM
00 PM
05
8
10
DONE
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
16 of 21
Version 1.0
CREATE EVENT 2
1. S
AVE BUTTON
At any point during event creation can the user
save it and access later on to finish.
BACK
NAME
CREATE EVENT
DATE
VENUE
DETAILS
GUESTS
1
BACK
SAVE
PREVIEW
NAME
CREATE EVENT
DATE
VENUE
DETAILS
GUESTS
BACK
SAVE
PREVIEW
NAME
CREATE EVENT
DATE
VENUE
DETAILS
GUESTS
SAVE
PREVIEW
4
2. V
ENUE OF EVENT
User can input an address or venue name, or
search for locations near them or in a certain
neighborhood.
3. M
AP OF EVENT
User can confirm of this is the event.
Describe your event. Feel free to come
Union Hall, San Francisco
2
describe
your event in 140 words
back to this later if you’re not ready
OK
by saving this invite.
venue name or address
x
Don’t know where it’s going to take
place? Search for venues above.
For example, try “restaraunts in
Hayes Valley.”
3
5
create a hashtag
hashtag photos & tweets to add them to the event timeline
NEXT
done
done
4. D
ESCRIPTION OF EVENT
Describe the event. This can be further edited
after the event has been posted.
5. H
ASHTAG OF EVENT
Users can hashtag their social media (particularly
Tweets and Instagrams), which will be aggregated
in the event’s Timeline. Also, any media captured
with in-app camera and comments will be
marked with this hashtag.
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
17 of 21
Version 1.0
CREATE EVENT 3
BACK
CREATE EVENT
5
NAME
DATE
VENUE
DETAILS
GUESTS
PREVIEW
1
2
search contacts
3
x
PREVIEW
BACK
SAVE
PUBLISH
6
ADD IMAGES
San Francisco
Dribbble Meet-Up
PUBLISH
9
PREVIEW
+ADD SPONSORS
The Twitter Design team is
sponsoring another Balllers
meetup at Union Hall, on
Tuesday, February 26th from
5:30-8:30pm. Come talk shop
over great food and drinks at
this killer venue! Drinks and
food on Twitter’s tab.
TUESDAY, FEBRUARY 26
5:30 PM - 8:30 PM
UNION HALL
Get Directions
DRIBBBLEAUG
BACK
MORE
8
+ADD IMAGES
NEXT
2. S
EARCH CONTACTS
4. A
DDED CONTACTS
Users adds guests to list by dragging from
above field of avatars.
5. P
UBLISH EVENT
After going through and checking how invite
looks and feels, user can publish.
6. A
DD IMAGES
User has option to add images to invite.
See Gallery
4
SAVE
3. A
VATARS OF CONTACTS
7
Add to calendar
Drag and drop to your Guestlist to add
PREVIEW
BACK
SAVE
1. A
CCESS CONTACTS FROM
SOCIAL MEDIA/EMAIL
User can access various groups of contacts from
social media or email. Clicking on a tab will ask
to authenticate that method. Also can access
Nvite Contacts, which are organized beforehand
by user for faster access to closer contacts.
7. A
DD SPONSOR IMAGES
if user has sponsors of the event, or is being organized by a company or organization, user can
add their logo here. if not, field would show host
and ways to contact host.
8. ADD IMAGES
9. RETURN TO PREVIEW
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
18 of 21
Version 1.0
PRIOR EVENT
PERMALINK
1. P
ERMALINK TAB
Shows event details and guestlist.
2. DIRECTIONS TAB
NVITE
BACK
1
NVITE
BACK
BACK
NVITE
2
DETAILS
DIRECTIONS
CHECK IN
New York August
Dribbble Meet-Up
TUESDAY, FEBRUARY 26
Add to calendar
5:30 PM - 8:30 PM
UNION HALL
Get Directions
DRIBBBLEAUG
See Gallery
MORE
DETAILS
5
DIRECTIONS
CHECK IN
DIRECTIONS
DETAILS
CHECK IN
3
4
3. M
ETHOD OF TRANSPORTATION
Choice of car, walking or public transportation.
Start: CURRENT LOCATION
End: Union Hall
4. S
TART/END FIELDS
By default, will show “Current Location” for
start, and venue location for end.
6
CHECK IN TO ACCESS LIVE FEED
5. C
HECK IN TAB
After going through and checking how invite
looks and feels, user can publish.
6. C
HECK IN BUTTON
by clicking, user will have access to add content
via in-app camera and comments, as well as
have access to live Timeline feed. for those that
are following, and check-in to follow and see live
Timeline.
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
19 of 21
Version 1.0
DURING EVENT
PERMALINK
1. C
APTURE TAB
Default tab during the event.
NVITE
BACK
1
BACK
5
4
CAPTURE
DETAILS
DIRECTIONS
TIMELINE
CHECK
DETAILS
IN
CAPTURE
NVITE
TIMELINE
NVITE
BACK
7
CAPTURE
DETAILS
“Ria intis rero es ium nimusam,
corest, num ex escil id que.”
2
2. C
AMERA TOOL
Allows user to take pictures, which will
automatically be hashtagged and added to live
Timeline.
5:36pm
6
TIMELINE
DETAILS
New York August
Dribbble Meet-Up
TUESDAY, FEBRUARY 26
3. A
DD A COMMENT
Comments are automatically added to live
Timeline.
4. A
CCESS GUESTLIST
Add to calendar
5:30 PM - 8:30 PM
Add a photophraph
5:13pm
UNION HALL
3
or write a comment...
“Dem imustrum quia nonestotatis
as dictet quatibusapid qui bernam,
corrumeturis nemp?”
5:13pm
Christie Sanders Has Checked In
4:48pm
Get Directions
DRIBBBLEAUG
5. T
IMELINE TAB
Shows incoming content from guests. Content
is timestamped and is scrollable to see past
content
See Gallery
MORE
6. S
OCIAL MEDIA MARKER
Each entry is marked with logo of where content
came from. can also access that user’s social
media in the in-app browser by clicking on logo.
7. E
VENT PERMALINK TAB
AFUSO DESIGN
NVITE MOBILE
May 01, 2013
Jeremy Afuso
20 of 21
Version 1.0
AFTER EVENT
PERMALINK
1. T
IMELINE TAB
Default tab of post event. Shows content from
guests before, during and after event. Content
is timestamped and is scrollable to see past
content
BACK
NVITE
NVITE
BACK
1
3
TIMELINE
SLIDESHOW
DETAILS
TIMELINE
SLIDESHOW
DETAILS
TIMELINE
SLIDESHOW
5
DETAILS
New York August
Dribbble Meet-Up
“Ria intis rero es ium nimusam,
corest, num ex escil id que.”
5:36pm
NVITE
BACK
2
TUESDAY, FEBRUARY 26
Add to calendar
5:30 PM - 8:30 PM
5:13pm
UNION HALL
“Dem imustrum quia nonestotatis
as dictet quatibusapid qui bernam,
corrumeturis nemp?”
5:13pm
Christie Sanders Has Checked In
4
DRIBBBLEAUG
See Gallery
Fred Phillips
Ria intis rero es ium nimusam, corest,
num ex escil id que parumquiat.
Today at 4:05 pm
Comment Like
4:48pm
Jenny Olson
Erspit fugitas sapersp erchil enis nest,
optur mil ilicidi is milique.
Today at 12:28 pm
Comment Like
3. S
LIDESHOW TAB
Event organizer can go through content of event,
and curate a selection from those, which is
packaged into a slideshow.
4. C
OMMENTS ON SLIDESHOW
Get Directions
write a comment...
2. S
OCIAL MEDIA MARKER
Each entry is marked with logo of where content
came from. can also access that user’s social
media in the in-app browser by clicking on logo.
MORE
5. EVENT PERMALINK TAB
NVITE MOBILE
AFUSO DESIGN
May 01, 2013
Jeremy Afuso
21 of 21
Version 1.0
USER TESTING COMMENTS
GUESTLIST
BACK
LIST VIEW
BACK
GALLERY VIEW
LIST VIEW
GUESTLIST
BACK
Greg Samuels
x
PREVIEW
BACK
PUBLISH
PREVIEW
BACK
SAVE
ADD IMAGES
PUBLISH
San Francisco
Dribbble Meet-Up
PREVIEW
CREATE EVENT
SAVE
BACK
NAME
DATE
VENUE
DETAILS
GUESTS
NAME
+ADD SPONSORS
The Twitter Design team is
sponsoring another Balllers
meetup at Union Hall, on
Tuesday, February 26th from
5:30-8:30pm. Come talk shop
over great food and drinks at
this killer venue! Drinks and
food on Twitter’s tab.
TUESDAY, FEBRUARY 26
Add to calendar
478
4,362
TWEETS
FOLLOWING
FOLLOWERS
5:30 PM - 8:30 PM
FOLLOW
UNION HALL
Get Directions
9 Mutual Friends
Greg Samuels
Drag and drop to your Guestlist to add
@imgreg
New Post: The Rainbow Spreadsheet:
A Collaborative Lean UX Research Tool
http://bit.ly/14e4nfQ #UX #Design
18 Mutual Friends
Greg Samuels
3 Mutual Friends
DRIBBBLEAUG
See Gallery
BACK
MORE
SAVE
BACK EVENT
CREATE
CREATE EVENT
BACK
SAVE
PREVIEW
DATE
NAME
VENUE
7
Start your event here
T
W
T
F
1
2
3
4
5
DETAILS
PREVIEW
GUESTS
8
9
10 11 12 13
PUBLISH
PUBLISH
San Francisco
Dribbble Meet-Up
x
6
SAVE
PREVIEW
+ADD SPONSORS
The Twitter Design team is
sponsoring another Balllers
meetup at Union Hall, on
Tuesday, February 26th from
5:30-8:30pm. Come talk shop
over great food and drinks at
this killer venue! Drinks and
food on Twitter’s tab.
TUESDAY, FEBRUARY 26
ends at
Add to calendar
5:30 PM - 8:30 PM
DONE
28 29
UNION HALL
Get Directions
Drag and drop to your Guestlist to add
NVITE makes event creation easy
by allowing you to save your invite
at any time, and come back to later.
PREVIEW
BACK
SAVE
ADD IMAGES
S
21 22 23 24 25 26 27
name of your event
PREVIEW
BACK
SAVE
PREVIEW
14 15 16 17 18 19 20
DRIBBBLEAUG
See Gallery
4
5
+ADD IMAGES
3 Mutual Friends
Greg Samuels @imgreg
What are the most interesting and
creative responsive designs that
VENUE
GUESTS
search contacts
starts at
M
@imgreg
New Post: A Case Study: The Art
Of Storytelling Around An App
http://bit.ly/1381sEI #UX #Design
DETAILS
DATE
FEBRUARY
S
4,275
Leslie Carson
Copy Editor at SF Chronicle
SAVE
PREVIEW
4 Mutual Friends
Lisa Santiago
Art Director at Wikimedia
GUESTS
13 Mutual Friends
Wes Madison
Product Manager at Adobe
DETAILS
search contacts
Paul Richards
CEO at Pagehub
VENUE
@imgreg
Kyle Lum
UX Designer at Google
DATE
x
3 Mutual Friends
Jess McDaniels
Graphic Design at Loku
CREATE EVENT
BACK
NAME
Greg Samuels
Developer at Fluid
TWITTER
GALLERY VIEW
NEXT
6
7
50
55 AM
00 PM
05
8
10
BACK
MORE
+ADD IMAGES
NEXT
HOVER STATE ON GUESTS’ AVATARS
A SPACE TO DROP AVATARS
FEELS TOO EASY
IMPORTANCE OF PREVIEW PAGE
Given then some users won’t have their face as their avatar
picture, it would be hard to tell who’s who without their
name as well. Thought about if there’s a hover state where
name would be exposed.
The box where user would drop in avatars could appear to
be full... was suggested of a circle with a plus sign or “add
here” to give user a target to drop in new invitees.
Overall, the event creation was easy and simple. But for
more important events with important people, could feel
like process was too easy, and invite would lack enough
to not feel substantial. Not sure how to address this, but
definitely worth considering how to approach these events.
The hardest part of the event creation process is the
preview page. User has a last chance to make sure
everything is correct, and overall is compelling for people
to join. However, some users have anxieties of whether
something is wrong and is sent out. Thinking of how to
calm the users nerves in situations like this.
BACK
TIMELINE
NVITE
SLIDESHOW
BACK
DETAILS
TIMELINE
NVITE
SLIDESHOW
DETAILS
NVITE
BACK
TIMELINE
SLIDESHOW
BACK
DETAILS
New York August
Dribbble Meet-Up
“Ria intis rero es ium nimusam,
corest, num ex escil id que.”
5:36pm
TUESDAY, FEBRUARY 26
Add to calendar
NVITE
COUNT ME IN
5:13pm
TUESDAY, FEBRUARY 26
Add to calendar
5:30 PM - 8:30 PM
5:30 PM - 8:30 PM
UNION HALL
UNION HALL
Christie Sanders Has Checked In
Get Directions
write a comment...
Get Directions
DRIBBBLEAUG
DRIBBBLEAUG
See Gallery
Fred Phillips
Ria intis rero es ium nimusam, corest,
num ex escil id que parumquiat.
Today at 4:05 pm
Comment Like
COUNT ME IN
SEND REGRETS
DIRECTIONS
TIMELINE
CHECK
DETAILS
IN
MORE
BACK
CAPTURE
NVITE
TIMELINE
BACK
DETAILS
CREATE EVENTBACK
DATE
VENUE
DETAILS
5:36pm
The Twitter Design team is
sponsoring another Balllers
meetup at Union Hall, on
Tuesday, February 26th from
5:30-8:30pm. Come talk shop
over great food and drinks at
this killer venue! Drinks and
food on Twitter’s tab.
Add a photophraph
5:13pm
or write a comment...
“Dem imustrum quia nonestotatis
as dictet quatibusapid qui bernam,
corrumeturis nemp?”
5:13pm
GUESTS
NVITE
SAVE
CAPTURE
NAME
TIMELINE
venue name or address
NAME
CREATE EVENT
DATE
VENUE
DETAILS
GUESTS
SAVE
PREVIEW
BACK
NAME
CREATE EVENT
DATE
VENUE
DETAILS
GUESTS
SAVE
PREVIEW
Describe your event. Feel free to come
Union Hall, San Francisco
OK
describe
your event in 140 words
back to this later if you’re not ready
by saving this invite.
x
TUESDAY, FEBRUARY 26
Add to calendar
Don’t know where it’s going to take
place? Search for venues above.
For example, try “restaraunts in 5:30 PM - 8:30 PM
Hayes Valley.”
UNION HALL
create a hashtag
hashtag photos & tweets to add them to the event timeline
NEXT
Get Directions
DRIBBBLEAUG
See Gallery
MORE
BACK
GUEST SPEAKERS
BACK
DETAILS
PREVIEW
New York August
Dribbble Meet-Up
“Ria intis rero es ium nimusam,
corest, num ex escil id que.”
See Gallery
MORE
NVITE
BACK
CAPTURE
DETAILS
San Francisco
Dribbble Meet-Up
5:13pm
“Dem imustrum quia nonestotatis
as dictet quatibusapid qui bernam,
corrumeturis nemp?”
NVITE
BACK
SEND REGRETS
Christie Sanders Has Checked In
4:48pm
4:48pm
Jenny Olson
Erspit fugitas sapersp erchil enis nest,
optur mil ilicidi is milique.
Today at 12:28 pm
Comment Like
done
DELINEATE DIFFERENCE BETWEEN TIMELINE
AND SLIDESHOW
SEEING HOW INVITE WOULD LOOK IN WEB
VERSION OR EMAIL
ABILITY TO LIKE/COMMENT ON TIMELINE
CONTENT
Testing showed there was some confusion between the
two, and whether two separate tabs were needed. Perhaps
it’s a matter of language and what to call the two pages.
Timeline was shown to be confusing as to what it was and
its purpose.
With some users having anxiety over what the invite
will look like when sent out, one idea was to incorporate
language that preview is exactly how the guests will see
the invitation, and possibly easing the process of pressing
publish.
In order to encourage more interaction and adding
comments to the live Timeline, being able to like or
comment would help with that.
done
HOW TO HANDLE UPDATES/EDITING DETAILS
Users worry about having to update the event, or adding
more information. Started to think about how to show
details has been added, and whether those would be
timestamped and shown in a timeline way.