Groops social app
An end-to-end app design to connect users to friend groups nearby
Role
UX/UI Design, Research, Branding
Timeline
4 weeks sprint, 2023
project background
Groops is designed for users to find friend groups near them with similar interests and experience desires. It is a concept born from the need for people to feel less lonely and connect in person with groups of like minded people. This app is perfect for young people 18-40 who often travel, are new to a city, or simply want to meet new people nearby.
Learning through empathy
I wanted to learn more about potential users of the Groops app, things like their methods of meeting new people, and what their pain points might be around doing so. I was especially interested in their use of technology to meet new people in real life, and any habits and concerns they might have while doing so.
Research Methods
User Interviews
Peer Analysis
Understanding users through interviews
In order to know what the audience needed, I had to ask them about their experiences one on one.
I recruited from my peers who were known to use technology to meet people, whether on Airbnb, dating apps, or others. They often traveled, and some had moved from other countries or states. I recruited a total of 5 interview participants.
I made sure to ask open ended questions about their experiences meeting new people on their own, and any experiences using technology to meet new people – including any safety concerns they might have in doing so, and their personal experiences meeting people from online.
Interview Insights
Users might be free spirited, interested in meaningful connections, trusting, adventurous, and even shy.
Meeting people is almost always influenced by proximity and shared interests.
People worry about being able to start up conversations with strangers, or being compatible with them.
People think meeting others randomly in a city may not result in meaningful connection.
People do fear for their safety when traveling alone and meeting new people, and therefore do so in public.
Most people have fair experiences when meeting people from online via dating apps or traveling apps.
Analyzing how peers solve similar problems
After completing my user interviews, I took a look at how similar applications interact with their users.
Tinder
I looked at Tinder dating app because I wanted to investigate how they went about connecting users who were located near each other and the ways they went about gaining user trust and keeping users safe.
Bumble
Bumble dating had an extensive onboarding process to get to know users so that their algorithm could give them more compatible matches.
GroupMe
I wanted to connect groups, so I needed to learn how they might be interacting with each other on the app and what features might be available for them.
NEXT STEPS
Learning from users through interviews gave me knowledge about what problems I could solve for users through this app. I had some ideas from my peer analysis about how to solve them based on my competitors, but I needed to dive deeper into defining my users and their needs to design the best app for them.
DEFINING NEEDS AND DESIRES
Once the research was done, I needed to clearly define the users’ needs based on my insights, and pose them in a way where I could start ideating solutions for those problems.
How might we facilitate the desire of free spirited people to meet new friends when they’re on their own?
How might we help introverts strike up conversations with strangers?
How might we help make people feel comfortable meeting like minded people from an app?
Developing Personas to keep our designs human centered
Once I had my users’ needs defined, I created personas to keep real people in mind as I designed solutions to their problems.
Uncovering opportunities through journey mapping
I mapped each of my persona’s journey through meeting people on their own to discover ways my app design could help them along the way.
Prioritizing design features
User Driven Connections
I wanted users to feel freedom in making friends with their Groop. I felt a chat room system would work best to give users the opportunity to collaborate and communicate with their Groop on where to meet up.
An Informed Algorithm
Users main concern when meeting new people was whether or not they’d have common interests or energies. I knew I had to include extensive data collection on every users’ preferences when it came to their lifestyle and interests.
Instilling Confidence
Users wanted to come away from their Groop interactions feeling good about their meetings, and have options of what to do if not. Photo verification, user rating systems and the opportunity to continue chatting after a real life meeting where all important.
designing an app for friendships
Research, check. Defining my design goals, check. Knowing what features I need to add, done! Now it’s time to design this thing! Here’s how I went about designing an app that would bring new friend groups together in real life.
Developing the Information Architecture with an App Map
I created an app map to see how our applications core screens would relate to one another, starting from the navigation.
User flows and Task flows show interactions
My user flow exploration. I ended up making changes once I began sketching out ideas more organically. See those sketches below!
Sketching flows for better clarity
I explored user flows more in depth, including what might be on a home screen and navigation.
I ended up using much of this work in our final design instead of what was first determined in our cleaner user flow above!
I find that sometimes this more organic, sketched out thinking provides better results than a structured, linear deliverable.
Sketching possible screens
I went from flow sketches to screen sketches, creating several different iterations and building our design out loosely before creating digital wireframes.
Digitizing sketches into mid fidelity wireframes
I then digitized those sketches into mid-fidelity wireframes… here are some examples.
CREATING AN INVITING BRAND
Groops needed to cater to an audience seeking connections, adventure and friendship. I wanted the UI to be simple, easy to use, and focused on creating Groops and their chats. The UI couldn’t take away from our app’s mission: to bring people’s together to share experiences.
Modern & Simple
Inviting & Friendly
Safe & Trustworthy
Fun & Adventurous
Designing a logo
I created a logo that was clean, modern and fun. We could adapt the icon mark into a home page button, and more!
Developing a new UI Style Guide
I created a color palette that would feel youthful and adventurous and kept the UI elements simplistic.
CREATING A HIGH FIDELITY PROTOTYPE
I now had all the pieces to build the product. It was time to start constructing this app.
I created screens for the homepage, on boarding flow, profile and chat features that would function well enough to perform usability tests.
Designing a dynamic onboarding flow
The onboarding flow would be crucial to the app’s success, as this friend group finding app needs user data to match people with the best friends.
Easily get matched with a friend group
The main function of the app is to match users with a group of like minded individuals nearby so they can meet up in real life. This is the flow in getting to the group chat from the homepage.
A profile fit for a social app
The profile would contain everything from the onboarding flow in case users wanted to refine their interests later.
checking our design with usability testing
I wanted to see how our app performed, so we set about conducting usability tests.
I did in person usability tests to get in depth feedback through user narration, questions, feedback and followed up with any questions for the users we had.
Quantitative data included error percentage and time taken per task, and qualitative data included our users thoughts and opinions while conducting the test.
Task 1: Successfully onboard in a reasonable amount of time
Task 2: Create a Groop and use the chat features like adding a photo or attachment, and finding the chat options
Task 3: Report a user and leave a Groop
Task 4: Find and update your profile
Usability Testing Insights
Users were able to complete onboarding quickly, and thought it included everything they might expect. Users wouldn’t want to skip steps, since they were all important to the function of the app.
People could not easily locate the chat options by clicking on the avatars/chat title at the top of the chat screen. This needed to be less confusing.
Reporting a user, leaving a groop and finding and editing the profile were all super simple for our users! I knew these didn’t need many changes.
PRIORITIZED ITERATIONS
Accessing the chat options was the only test that truly failed, so this iteration was the most important.
We removed avatars from the title space, and added a labeled icon for the chat options.
I made some small adjustements to the Choose your experience screen to make the slider options look less clickable. I also added another option, Professional or Leisure, per a user’s suggestion.
Instead of having arbitrary options of when to meet up, I gave users more control and allowed them to pick date ranges on a calendar.
Another small iteration, I altered the prototype to allow test users to be able to actively click options on/off.
I also set numbers for group size so users would know explicitly how large or small a group they’d be choosing.
FINAL THOUGHTS
I am proud of this minimum viable product as my first end-to-end application design for mobile! I feel my UI is especially strong, and that I took a challenge to create a proximity based meet up app and executed something people would find helpful and simple to use.
When it comes to things I feel could be further iterated on, I am interested in the logistics of creating friend groops that may not appear instantaneously, but take hours or days to create.
Realistically, there may not be enough users inputting similar groop searches to make a groop chat in a very short period of time.
Instead, a user may input their groop criteria, and be shown a page asking them to hold tight while their groop is made.
Depending on the nature of the user’s criteria, they may not find a group in the reasonable amount of time they’d like to meet with them, and have to try searching with different criteria.
This solution was brought up during testing by one of my test subjects, and posed great thought to further iterate the design.
While it was out of scope for this 4 week design sprint, I wanted to give mention to this future possibility!