I created an “Event Map” feature for the Facebook mobile app. This project was inspired by my observations that a lot of my peers seem to be unaware about events taking place in the area. Facebook emphasizes their mission to connect people to the world around them, so this project is a step towards achieving the company’s higher level goals.
By ideating through solutions, I arrived at an interactive map design that displays information about events in the area. The design considers Facebook’s design patterns while implementing new patterns around my feature.
Because I live in a college town, there are a lot of events in my area. Unfortunately, a lot of the time, students aren’t aware of what goes on in the area due to insufficient marketing. Whether there are social events, academic events, or career events, there are always a lot of valuable opportunities that I feel like people are missing.
There was a review session?
We missed the BOGO deal today!
People in the community use a variety of mediums to keep updated, but there’s no denying that Facebook is an important hub for event awareness. I looked at Facebook’s mission statement, and I saw that this issue around a lack of awareness disrupts the company’s vision.
Facebook's mission is to give people the power to build community and bring the world closer together. People use Facebook to stay connected with friends and family, to discover what's going on in the world, and to share and express what matters to them.
I wanted to think about solutions to this by improving the discoverability of Facebook events.
Because the observations stated above are subjective, I wanted to test them using 5-minute interviews with 10 of my friends.
|Name||Age||How does FB contribute to your awareness of events in the area?||How many events have you missed this month that you were unaware of?||How much time in a day do you spend on FB?|
|Angie||13||'It doesn't'||0||< 10 mins|
|Lee||19||'If Facebook didn't exist then there wouldn't be much I would know about.'||10||30 mins|
|Brian||20||'It depends on how often I check it.'||4||30 mins|
|Sachi||21||'I would say a lot!'||0||2 hours|
|James||21||'That’s primarily how I find out about events.'||5||1.5 hours|
|Sierra||21||'Facebook is really useful for staying aware.'||2||2 hours|
|Ting-Ting||22||'Facebook is 15-20% of how I find out about events.'||2||1 hour|
|Mohamed||24||'I’m only aware of events that my social circle attends.'||3||2.5 hours|
|Steven||31||'Nope; I rarely use Facebook.'||0||0 mins|
|Celeste||58||'I don't use it for that and don't know how to.'||0||0 mins|
I was able to get a lot of responses from my age group, but I didn’t have much access to younger and older populations. Nevertheless, the evidence I have suggests that these groups wouldn’t use Facebook to search for events as often. I assume that children and adolescents don’t have the liberty to freely go to community events, and working-class individuals have less free time on their hands. Ideally, I would have more resources and access to test these assumptions, but that is not the case here.
As seen, in young adults, Facebook is a very important resource for event awareness. In rare cases like Sachi, Facebook users may not feel like they’ve missed any important events; but the majority of users say that they have. Lee had the highest number of missed events (with 10 in a month) and said that he is only aware of 50% of events that he’d like to go to.
Since my redesign would need to fit in the Facebook app's ecosystem, I prepared for my wireframing session by looking at the app's UI to keep my visual patterns conistent with its standards.
While wireframing, I had several considerations and assumptions while thinking about improving event discovery:
Out of all of the ideas, people seemed to be most excited about the map and the notifications. People don't seem to be content with the calendar idea since it already exists and doesn't work well. I decided to use both ideas in the design solution and moved on to Sketch to create mockups.
Based on the solutions and feedback that came out of the ideation step, here are the screens that I came up with:
Newsfeed: The Newsfeed section now has an event map below the stories module. It is placed high on the feed so that people can easily discover the feature and are more likely to interact with it.
Events: As seen in the subnavigation bar on this page, there is a new link to the new Map feature.
Event Map: Users can pan, zoom, and select events on the interactive map so that they can become more aware of events in their area. Selecting an event highlights the corresponding event thumbnail on the carousel above. Users can select the thumbnail and be brought to the event page if they want more details. People can also gain awareness of events at other locations or times using the filter section above the map.
Settings Overlay: Enables the user to access Notifications and Preferences settings.
Events Notifications Settings: Allows users to control when they recieve notifications about events and modify the proximity of the events that they are notified for.
Lock Screen Notification: Exemplifies what an event notification would look like on a lock screen.
The tricky part about designing a product or feature on the Facebook app is picking “correct” design patterns. Facebook has a lot of separate product teams that create their own design systems. This means you might find two different symbols that allow you to do the same thing, or you might find heading counterparts with different font weights.
If I were to hypothetically place myself in a product team at Facebook, the cost of creating my own system with more relevant symbols, typography decisions, and intuitive navigation would be inefficient (considering designing and development time). Therefore, to streamline implementation, I would want to use Facebook’s existing patterns.
To make sure that my design was as intuitive as possible, I used design patterns from several different Facebook products and have annotated where I took them from.
In the end, I came up with two ideas that were supposed to create more opportunities for people to be aware of the events happening around them. By creating more awareness around events, Facebook takes another step towards their mission statement of helping people “discover what's going on in the world”.