Fomo
Experience Stories You'll Never Forget
My Role
Co-Design Lead – Visual Design, Interaction Design, Design System, Wireframing, Prototyping, User Flows
Team
Ambra Ymeraj
Michele Battistioli
Davide Govoni
Timeline
1 Month
Tools
Figma, FigJam, Notion, Adobe After Effects
Background
As you stroll through Berlin, you encounter countless opportunities to connect with new people and become a part of their stories. But how can I find people with similar interests in a safe and efficient way? During my capstone project in the UX/UI Design bootcamp, we developed a unique app idea and created a prototype, which we presented to an audience at the end. Our idea focused on a platform that could help expats in Berlin easily find new connections shortly after moving.
A secure platform for expats in Berlin to connect with others by joining spontaneous activities shown on a live map.
In our app prototype, we offered login options via mobile phone number, Apple and Facebook. We chose these methods to increase security as these accounts are generally associated with real people and are less likely to be easily faked.
We also give the user the option to 'Verify yourself', which builds trust between users and gives the user the right to create activities themselves.
Every green chip/bubble represents a live activity that happens around you – the blue ones are planned activities that happen in the future. Activities can range from a spontaneous table tennis match in a park to someone reading poetry in a public place and he wants other people to join.
The best safety precaution when going out is to be with other people you trust – this has been shown by our research. This is why we included the feature to add your friends to join you for a spontaneous activity.
Fomo helps you to connect with more people in an efficient and safe way. Our design system reflects this by using colors only for key functionalities, ensuring the live map of activities gets the spotlight it deserves.
To build trust, we opted for an overall recent and airy design, using light colours, soft shadows and no harsh contrasts.
For a more in-depth look at the Design System (e.g. tokens) you can jump to the Visual Design section of the Case Study.
Research suggests that young adults are becoming lonelier and losing deep friendships.
We couldn't save the world yet. So we wanted to find the user who would benefit the most from using our app: Young expats who had just moved to Berlin. Factors such as language barriers, security concerns and different cultural norms made it particularly difficult for expats to make meaningful connections. And the pandemic only amplified these problems.
In addition, with 25% of Berlin's population being expats, it was also easier to find expats to conduct interviews and surveys to gather our own data.
To challenge our initial research, we conducted 9 User Interviews with expats to get their User Needs, Behaviors & Pain Points. Based on that we gathered 20 User Survey results to identify Trends and Patterns in the data of the User Interviews.
The Key Findings that we got from that gave us a better understanding on what our app has to offer.
So our Hypothesis was when we could create a safe platform where Berlin’s expats can easily meet new people, we could increase their chances of finding meaningful connections and lower the feeling of loneliness.
Approachable and modern design that generates trust and shifts the focus onto the activities
Since the bubbles represented activities and activities are the core offering of the app, we put a lot of care into their design.
We assigned the color green to the live activities, since this color has been used in other apps to signal something is live or someone is online. And it was validated by our Usability Testing. For the planned activities we used the color blue, since it’s slightly more passive but not too passive as grey so that it feels inactive.
The chips contain small images/videos of the event to generate interest and trust in the user. Plus the image serves as another differentiator that helps the user distinguish the different activities
Through Research and Usability Testing we condensed the necessary information that user needs to join a spontaneous activity.
We offered the user to use tags for their activities, so that they stay flexible about what type of event they want to create.
Spacing Tokens set up as variables in Figma were used to ensure consistent spacing across the UI.
We used the typeface FigTree for headlines/titles because it features slightly rounded corners that contributes to it feeling rather modern and approachable. Plus it’s geometric characteristics make the letterforms stand out more which adds character.
For body text/labels we chose Lato because of it’s superb readability across different screen devices and it’s versatility since it features a lot of different weights. Both typefaces feature a large x-height that improves readability.
Both text styles and variables were used to ensure a consistent design across the different screens.
Saving the world needs to wait
