Design Solutions for Badoo

Design Solutions for Badoo
Enor Anidi
The Issue
•
I understand that a large percentage of women who are members of Badoo do not get an opportunity to explore
the site fully
•
These female users are spending a lot of time interacting with other users on chat, and therefore miss unique
messages from members who are on the Encounters game feature
The Objective
To obtain a higher percentage of female users to investigate the rest of the Badoo website. These users
should start to interact with other members and connect with those using the Encounters game feature.
My Approach
When solving design issues, my preference is to make recommendations based on quantitative and qualitative
insight in order to understand ‘pain points’ and user ‘touch points’. However, in the absence of this data, these
recommendations have therefore been made based on my own experience of working on user-led projects. I have
also thought about best practice and like any other UX evangelist, I have put myself in the shoes of your female
users.
I hope that this presentation will be able to provide you with a number of recommendations that you can still
implement.
01
Who am I designing this for?
Personas
As discussed on the previous slide, I believe that any designer should put themselves in the shoes of
those that they are designing for. One needs to understand the problems faced from the users’
perspective, and in the absence of qualitative feedback, the only way for me to do this is to become the
user myself.
As requested, I signed up as a female member to Badoo, and I pondered over the reasons as to why a
female user might be motivated to use the website. I thought about the criteria that I would use if I was to
carry out qualitative research before designing, and after some thought, I created the Persona and
profile of “Jane Holloway”.
02
Meet Jane
About Jane
Jane Holloway
Age: 29
Education: MBA
Languages: English and French
Occupation: Project Manager
Location: Brighton, UK
Martial Status: Single
“My friend told me that Badoo
was a great place to flirt and
meet local men in my area”
Goals
•
•
•
To make new friends
Meet new men in Brighton or nearby
Become more confident and learn to approach potential suitors
Jane has a very stressful, but enjoyable job as a Project
Manager for a London based digital agency.
She considers herself to be out-going, friendly, communicative
and is a great relationship builder.
Outside office hours, Jane is a keen gym goer and enjoys
Bikram Yoga to de-stress. At the weekends, she can often be
found attending gigs, or going to dinner with her close friends.
Jane has been single for about 7 months now but before then,
she had been in a long-term relationship with a gentleman who
she had met at University.
Jane is a new member of Badoo and heard from a friend that it
was a good way to meet new gentlemen to flirt with and to
possibly date.
Pain points
•
•
•
Confusing navigation on dating websites
Being bombarded with too many messages (especially
inappropriate)
Being charged for all features on a dating website
Image Credit: http://www.flickr.com/photos/mandyanddaniel/6297693444/sizes/l/in/photostream/
03
Why are female members only engaging in interactive chat?
04
1. Navigation
Once a user has logged into Badoo,
they are taken to the “People Nearby”
page. From looking at the design of
this page, the most visually stimulating
items are the pictures of the members.
The navigation is clean, but it is also
rather small. The highlighted tab of
“People Nearby” stands out, but the
Encounters looks greyed out (I am
aware that this is due to it being in the
non-active state). It fades into the
background and is overshadowed by
other elements on the page.
05
1. Navigation - Visual Explanation 1
The profile pictures
overshadow other
elements on the page.
This means that users
are more inclined to
investigate profiles
rather than the rest of
the website.
This navigation element for
the Encounters game is
greyed out. It also doesn’t
appear to look like a clickable
tab, so users may not be
aware that it is something that
they can investigate further.
06
1. Navigation - Visual Explanation 2
I see the ‘flashing’ number for
my first message, and go to
check it out. Then less than 3
minutes later, I receive a
further 4 more new
messages, so I give in to the
‘flashing’, and abandon this
page to read them. This then
takes me away from other
features on the website.
07
1. Navigation - Recommendations
Remove the flashing
icon that lets users
know they have
messages, but rather
have it static. This is to
stop users from being
distracted by the
constant flashing
reminder.
•
•
•
Make the entire navigation more
prominent so that it looks clickable
and more like a conventional
navigation menu
Change the icon next to Encounters
to make it feel more like a game. At a
glance, users may not relate to the
image of the dice
Have a small corner banner with the
word “NEW” to attract users to this
feature
08
2. Visibility
I have already established that the
design of the navigation may be
stopping users from visiting the
Encounters page. Users will also be
tempted to keep checking their
messages once they see the flashing
number.
Once a user clicks on the Messages
tab, they’ll see the number of online
chats and messages that they will
have been sent. The issue with this, is
that users will then become too
engrossed in new chats, and miss out
on other elements of the website,
including messages from people on
the Encounters game.
If you want female users to participate
in the Encounters game feature, then I
believe that you need to change the
design of the Messages page, and
push the feature more. In my opinion,
it simply isn’t visible enough and
needs to become a core feature of the
website.
09
2. Visibility - Visual Explanation
This section of the
page clearly tells the
user how many people
are online and offline.
It takes up a lot of the
page, and I think that
other elements of the
website hold more
importance and some
of this space could be
sacrificed.
This element is confusing.
Firstly, the user gets notified
that a message has been
sent to her. To most people
a ‘message’ might mean
email, and when the user
replies, she might expect to
reply back with an email
first. Instead, she learns
that she has actually been
sent a chat message, rather
than an email, and her reply
then turns into an
interactive chat, which may
not be what she was
expecting. This then
enables the user to end up
chatting to a number of
people as the system is
very fast.
10
2. Visibility - Recommendations 1
Instead of this feature, I would suggest
that “Who’s online’ is closed by default,
with an option for the user to open it up
as an accordion feature. This in turn will
offer up more space where you can then
include an embedded version of the
Encounters game.
Alternatively, you could have a pop-up
arise for users who have been chatting
for more than 10 minutes to remind them
that someone from Encounters likes
them. It could ask them whether they
have played the game yet today or to
earn some extra credits for free. Some
examples of this can be found on the
next few slides.
I believe that this section of
the website is largely
interactive, (and users love
to chat), so I would strongly
suggest implementing a
change in design whereby a
user can differentiate
whether they have received
an email or a chat
message. Furthermore, I
recommend that users get a
pop-up notification if
someone wishes to chat
with them (it could be in the
bottom right hand corner of
the screen) and users will
have the option to: Accept,
Send an email, Deny or
Block the request.
11
2. Visibility - Recommendations 2
I would suggest that there
should be a moderator or
filter for messages that are
rude/crude in this nature.
Not only can a message
like this give a user the
wrong impression of the
website, but I believe that it
is extra off-putting for the
message to appear as an
interactive chat. This is
because it feels even
cruder on chat and a sense
that it is more personal as
the user is waiting there
online, as opposed to if it
had been received in an
email format.
12
2. Visibility - Wireframe of the current Messages page
13
2. Visibility - Wireframe of the new Messages page
Version 1
15
2. Visibility - Wireframe of the new Messages page
Version 2
17
Visual of pop-ups
19
3. The Encounters page
I strongly feel that the design of the
Encounters page should be changed
in order to retain the attention of the
users.
There are a number of changes that I
would make, and these
recommendations are as follows:
•
No back button: Users may quickly
go through the profiles and without
thinking, click “No” to someone they
quite like. There isn’t a back button
for the user to be able to go back
through the profile pictures. If you
click the back button within the
browser, it actually closes the
Encounters game feature
altogether.
•
Improve the game: I think that this
is more of quick match-making
feature rather than a game. I believe
that more users would play it more if
there was an element of challenge
or fun attached, rather than just the
three existing options.
20
3. The Encounters page
•
Settings placement: The settings
icon is most likely to be unclear to
users, especially to those who do
not own a smartphone (the icon is
used on the iPhone for example). I
would recommend that you have
instead the words ‘Search profiles’
so that the user has an
understanding of what will happen
by pressing this button.
•
Links below the fold: I strongly
recommend that you bring these
links up above the fold and make
them bigger. As it stands, the user
cannot see them, and might
presume that there is nothing below
the picture. Furthermore, they have
to click ‘Yes’ to make contact. If they
do this, it just takes them to the next
profile and of course there is no
back button to return to the profile!
21
3. The Encounters page - Visual Explanation
What happens when you click
Yes? Does it mean that the
user can make contact with
the person in question? It
doesn’t! It takes the user to
the next profile.
There is no back button.
What if I like him and I press
‘No’ by accident? How do I go
back to find him again?
What does
this mean?
What does
it do?
There is a lot of white space
here that isn’t being used. I
feel that this makes the
feature seem like an
afterthought and not in-line
with the original design.
The links below the pictures
are too small and sit below
the fold.
22
3. The Encounters page - Recommendations
I recommend that after
clicking the Yes button,
users’ either get taken to the
persons profile page, or a
window opens with the option
to make contact with the
chosen member. As it stands,
it takes the user to the next
profile, which might confuse
someone who thinks that they
are about to make contact
with a member they like the
look of.
I would recommend
implementing a back button
just in case I click ‘No’ when I
really meant ‘Yes!’
I would recommend re-designing
this panel, so that there is far less
unused white space and to allow
implementation of other
recommendations I have made for
this page.
I suggest
implementing
the word
‘Search Profiles’
rather than
using a settings
icon which isn’t
an appropriate
or relevant UI
icon to be using.
I strongly suggest that the
links (below the image) are
brought up above the fold
and are increased in size.
23
3. The Encounters page - Wireframe of the current page
24
3. The Encounters page - Wireframe with recommendations
26
Some other things to consider
In order to assist you to improve the overall usability of the Badoo website, I have evaluated some other pages and
have made some miscellaneous recommendations. These are not related to the task that you set me, but I do hope
that you find them of some benefit.
Pictures
Once you have logged into Badoo (for the first time) and created your profile, you are told that you have to upload
three images in order to interact with other members. I understand that this is most likely to ensure that the members
are genuine, however I feel that this could be off-putting to new members. For example, you may have a member
that is shy, new to online-dating or isn’t technically savvy and needs some assistance before doing this. A better
option would be to prompt new users’ after a period of time (7 days for example).
Badoo Tour
A good way to help users understand all the benefits that Badoo has to offer, would be to include a tour of the
website and it’s features. This tour could be offered to new female and male users as well as existing, and would fit
in nicely if you did make the changes to the design.You could use an informal tone such as “first off, let me show you
around”. It would be crucial for new users to receive this tour before they upload a picture of themselves as this
would enable them to understand all features before they get inundated with messages.
Earn points
Sometimes if you can’t get users’ to engage, an incentive will usually do the trick. As you charge users’ for some
features (such as being featured on the top of the page), you could consider giving the female users 10 credits per
day on the Encounters game and after 10 days, they get a days feature.
28
Speech bubble
On the Encounters game feature, you have a link which reads: Has he seen your photo? When a user clicks on this
link, a speech bubble opens with two options which are to ‘Activate Now!’ or ‘Try them for free!’. The only way of
closing this speech bubble is to click on either of those links. Whilst the intention may be to persuade a user to at
least choose one option, it may be frustrating for those who simply want to close the bubble. The only way a user
can get rid of this bubble is by refreshing the screen or pressing the back button on their browser, and some novice
web users may not be aware that they can to do this. I would recommend implementing a ‘close this’ option,
especially for those users who may have clicked the original link accidentally.
Consistency
As I logged into the website several times over a period of two days, I soon realised that each time I logged in, I was
met with a variety of splash/promo pages. I am not sure whether this is because I was a new member or whether it
is something that you are now implementing. I thought it would be worth mentioning that users’ prefer a consistent
journey, and one they can become familiar with. It’s a bit like putting on an old, comfortable pair of shoes. Users
prefer consistency and they can build trust in a system if they know what to expect. If you are thinking of introducing
splash/promo pages each time someone logs in, I would suggest that you think about this feature a bit more and to
find out if your users like/dislike this experience.
29
The End
Thank you for your time, and I hope this has been of some interest.
Enor Anidi
[email protected]
077386 36657