November 2022 - Present
UX Researcher
UX Designer
UI Designer
Figma
Adobe Suite
Zoom
Miro
THE WALKTHROUGH
Sapphira is an app that addresses the disproportionate access to communal spaces within the Sapphic community, focusing on creating accessibility to spaces, lifestyle, and events and fostering connection.
PROBLEM
Users have experienced difficulties and have expressed feelings of frustration, sadness and isolation when accessing Sapphic spaces, events and lifestyle.
SOLUTION
Introduce a platform tailored for Sapphic individuals offering transparent and centralized access to Sapphic events, spaces, and lifestyle while also connecting users through a community focus.
There were four objectives to be prioritized throughout the design.
01
Users can search and book reservations for sapphic events, spaces, and lifestyle in one place.
02
Allow users to post media-centered reviews of spaces and events ensuring accuracy and safety.
03
Incorporate a community section to connect users.
04
Users, organizations, and vendors can all host and advertise events, spaces, and lifestyle though the app.
Users are able to explore any location and filter their options with the option of viewing via a list or a map. A details page allows users to see who is in attendance and view more information/ photos and video reviews to ensure accuracy.
Sapphira centralizes information to where users are able to make direct bookings reservations or RSVP to events, spaces, etc. User can check out with Stripe and add their ticket to their Apple Wallet or, view their bookings directly through the app.
Users are able to explore photos and videos of their selection- they have the option to sort them based off of who posted them or, a specific aspect they are looking to explore for example, vibes of the space, food menus, etc. This is useful in ensuring accuracy and allowing users to know what to expect before going into a space.
Users are able to join groups and explore it’s feed, about section and access events the group is hosting directly. Users can also create posts, and comment on posts within the group, fostering connection.
Users can search for friends and view their activity across the app. From the profile page, a user can choose to add a friend, message them, see groups they’re apart of, people they’re followed by or following, or view more information about the profile. The profile page has sections dedicated to an extensive bio, posts from the user, and photos/videos.
From the Community Tab, users can explore a general feed where they can filter what posts they see. Users can post to the feed, view stories, and access chats from here. Users have the option of chatting with other members directly and accessing chats from groups, events, or other community aspects.
CONTEXT
What is Sapphira?
Sapphira is an app that addresses the disproportionate access to communal spaces within the Sapphic community, focusing on creating accessibility to spaces and events and fostering connection.
Sapphic: Sapphic, sometimes known as women loving women (WLW), or sapphist, refers to a woman or woman-aligned person of any sexual orientation who is attracted to women or woman-aligned genders/gender identities.
The Background
Historically and presently, the Sapphic community has faced limitations in accessing spaces, creating challenges for women within an already marginalized group. Scarce Sapphic events, lifestyle options, and non-lightlife spaces contribute to a gap in LGBTQIA+ community. This issue is exacerbated by the dominance of male-centered spaces within the queer community. This lack of a variety of spaces weakens community bonds and fosters a sense of disconnection. The centering of nightlife leads to reliance on non-sober activities for community engagement.
RESEARCH
Generative Research
My research started with conducting secondary research, which included a Google search and exploring various sources such as trade publications, white papers, third-party research summaries, and popular press coverage to understand the problem space.
Research Questions:
How do sapphics typically find queer spaces?
What is their experience in the spaces and how well do they feel they cater to their identity?
What are their interaction experiences with interfaces catered toward finding sapphic spaces?
What would be their desired experience when looking for sapphic spaces and events?
What are the strengths and weaknesses of competing apps?
Key Findings:
01
No dedicated websites or booking engines exist for accessing Sapphic spaces and events, relying on scattered information from blogs.
02
Information is primarily spread through word of mouth and across platforms like Reddit, Instagram, and Tik Tok, lacking a centralized source for direct access.
03
Dating apps serve as information hubs, with a drawback of the inability to make event purchases.
04
Existing blogs focus on only one travel, nightlife, or lifestyle for the general LGBTQIA+ community.
Next, I conducted a competitive heuristic analysis on different apps to understand usability and draw inspiration for potential solutions I evaluated these apps based on three of Nielsen Norman Group's heuristic principles.
My research revealed Tripadvisor as a top inspiration of Sapphira.
User Control & Freedom:
Consistency & Standards:
Error Prevention:
View Full Competitive Heuristic Analysis
I then onducted user interviews to gain firsthand insights from Sapphic users familiar with searching for spaces, events, and lifestyle.
I launched an online screener survey and reached out via social media, friends, and family to recruit participants for interviews and gain more insight.
What best describes your experience with finding Sapphic spaces/events?
How frequently do you seek out queer events and spaces?
What do you typically use to find queer events?
The screener survey helped me recruit 10 users to interview via Zoom. Here are some quotes that stood out to me:
Affinity mapping helped me pull common themes from the user interviews.
What I came to find:
Looking for belonging when going to Sapphic spaces
Looking for Sapphic spaces while traveling
Finds queer spaces through word of mouth
Uses social media to stay connected to Sapphics
Uses social media to find events
Uses group chat to stay connected to Sapphics
Motivated to find women when seeking Sapphic Spaces
Has negative feelings when seeking Sapphic spaces
Empathy Maps from Research
My research helped me put myself in the user's shoes leading me to create empathy maps from what I pieced together.
To personify the information I had gathered about users, I developed three user personas. These personas helped guide me as I started brainstorming ideas and making design choices.
Synthesizing Research
DEFINE
The limited availability of sapphic spaces, events, and lifestyle options within the LGBTQIA+ community, compounded by a dominance of male-centered venues and a lack of accessibility beyond nightlife, leads to frustration for users when searching for events and spaces, isolation, and hinders the development of a cohesive sapphic community, pushing individuals towards a non-sober lifestyle for community engagement.
In wrapping up my research, I brainstormed my "How might we" questions to more precisely define the problem and goals before beginning the ideation phase.
How might we generate visibility to Sapphic Spaces?
How might we reduce confusion surrounding the process of accessing sapphic spaces?
How might we give users access to as many spaces/events as possible in one spot and connect users to sapphic spaces based on their needs?
How might we ensure the accuracy of advertising sapphic spaces/ events?
How might we aid users in connecting with other users like them within their community?
To know what feature to proritize in the initial design, I began crafting user stories from the perspective of my personas using the basic framework of "As a (user), I want to (do some goal/task) so that I can (achieve some outcome). This helped me understand what users would like to accomplish.
I decided which user stories were essential for the MVP by evaluating their importance to user goals, impact on users, value to customers, and implementation difficulty. I came up with three objectives of the app.
Objectives:
01
Meeting new people and connecting with the community
02
Centralize and create transparent access to spaces, events, and lifestyle
03
Showcase and provide a booking engine for things to do
04
Travel (last priority)
How might we enhance visibility, simplify the access process, centralize information based on user needs, and ensure accurate advertising of Sapphic Spaces, events, and lifestyle while facilitating connections within the Sapphic community?
IDEATE
Searching for Sapphic spaces, events, and lifestyle:
Users can complete this route without an account and is prompted to sign in or make one when making a reservation, a purchase, when favorite items, or completing actions relating to community. This is the most important flow of the app.
I prioritized the user flow having minimal touch points to complete the task of making a reservation to an event.
In designing the flow, I considered allowing users to access the app without requiring sign-in to enhance site retention.
After gathering data and outlining the user flow, I brainstormed ideas. I sketched red route screens for my mobile app to convey concepts effectively and collect early user feedback before wireframing.
To test the first concept, I utilized Marvel Pop to create a clickable prototype. I went to a local cafe to guerilla test my flows.
The goal here was to identify any potential issues with the user flows
User testing participants: 10
Key Findings from Guerilla Testing:
After guerilla testing, I decided against including a "notifications" tab, as participants found it unnecessary and potentially overwhelming. Their feedback emphasized the importance of prioritizing clarity in design. While users found the main flow to be intuitive, there was much more to be brought to life in my designs.
PROTOTYPE
Wireframes Based on User Feedback
Branding and Identity
Before moving on to creating detailed screens, I had to establish the foundation for my brand's look and feel. I had to start from the ground up by defining my brand's platform and style guide.
After careful consideration, I decided on the name "Sapphira," inspired by the renowned Greek poet, Sappho, known for her beautiful Sapphic poetry originating from the island of Lesbos.
Moodboard
My mood board was inspired by the goals of Sapphira and Sapphic pop culture: Serene, uplifting, trendy, new, and inclusive.
Style Guide
I went with a neutral green and blue color to stick with the serene and uplifting theme.
I checked text colors against the secondary and primary colors to ensure accessibility and visibility.
I used the Inter font, as this is a common font used for apps and I wanted it to feel familiar and easily legible for users.
First High-Fidelity Mockups
- The search bar is put at the top as the app’s primary function is to search and explore events, spaces, and lifestyle
- Users can choose to make a specific search or explore general options provided with the sub-header.
- Home screen is meant to prompt user engagement and ad revenue by recommending sponsored events and spaces while also tailoring results to the user
- Adding a map to allow users to have a visual idea of where their selections are located
- Users can quickly select from the categories they’d like to browse by or set more in depth filters
- Information provided allows users to scan and know a little bit about the event before enlarging it
- Showing chips at the top bar of the filters users have selected
- Users are able to slide through photos on the photo carousel at the top of the information page
- Users are able to see who is attending an event out of members of the community and even chat with them or add them as a friend through there. This facilitates community and connection and should be prioritized at the top of the screen.
- Important information is prioritized at the top of the screen and users can scroll down to learn more
- Users are able to view various types of media of a venue or an event.
- Users are able to sort and select the type of media that they would like to see which gives access to a large amount information while ensuring accuracy- something users expressed they struggle with during this process
- The community page allows users to view posts from either their friends, or all members on Sapphira. They have the option of filtering what they see.
- Live updates or “stories” from other users are placed at the top of the screen
- The search button allows users to search anything within the community
- Users have the option of joining committees
- Users have the option of messaging other users
- The profile page provides important social information for users seeking to connect
- Users are able to find others like them based off of tags or keywords used on a user profile
- Users are able to see what groups other users are a part of
- Users can customize their profile with posts, photos, and story highlights
VALIDATE
We conducted five usability tests via zoom and in person.
Goals of the user test
01
Can participants have an easy, stress-free experience searching for specific events, spaces, and lifestyle without confusion?
02
Do participants feel certain they’re getting accurate information about an event or space?
03
Do participants feel there are opportunities to connect with and meet others in their community?
04
Are users finding the information they need and is it what they are looking for?
Task 1: Search for an event, filter it, and reserve a spot
“Imagine you’re traveling to a new city and want to find an intimate flamenco event and reserve the most expensive option. How would you go about doing this?”
Task 2: View photo reviews from users
“You want to attend an event but want to make sure it’s accurate and in line with the vibes you’re going for before you attend. How would you do this?”
Task 3: Join a community, comment on a post
“You're new to the Sapphic community and want to find a community where you can share your coming out story. How would you go about finding a community group, joining the group, and commenting on your first post?”
Task 4: Searching for and adding a friend
“You've just met a new friend while you're out and they want you to add them on Sapphira. How would you go about finding them, adding them, and exploring their page?”
Task 5: Creating a post, chatting
“You’re wanting to explore to your community. How would you go about creating a post, and chatting with a friend?”
What could be improved?
Main feedback:
Inaccessible chat and search features on the community tab
Issues with the functionality of the search bar
Users found the color palette to be a bit plain.
The “Write a Post” button is not as intuitive for users
5 out of 5 participants said they would use this app and hope it gets developed!
User Test 1 Findings:
Inconsistent Search Function
A) Users were unsure of whether or not they had to click before typing to activate a search bar. This was due to inconsistencies in my design.
- The search function was "automatic type" on some pages and was not on others.
A) Make typing automatic as soon as the keyboard comes up on all pages.
- Make sure the search function is consistent on all pages to reduce confusion.
Icon Visibility
B) Users were unsure of whether or not they had to click before typing to activate a search bar. This was due to inconsistencies in my design.
- The search function was "automatic type" on some pages and was not on others.
B) Change the color of the icons, making them darker for additional contrast
- Give the icons a background to contrast from the header
- Increase icon size
Intuitiveness of the "Write a Post" Button
C) Users instinctively went to find the “write a post” at the top rather than using the “write post” button
C) Put a section for “write a post” at the top of the page
REFINE
Revisions Based Off User Feedback:
Based off of user feedback, these were the revisions I made to the initial prototype:
I changed each search bar to automatic typing versus the user having to manually select the search bar for it to type.
Before
After
- I darkened the color of the search and filter icons, enlarged them, and added a fill to increase visibility.
- I moved the "write a post" button and created a section at the top of the page for users to write a post, as users said this feels more intuitive for them.
- I changed the chat feature to a button to make the top bar less overwhelming.
Before
After
Usability Test 2: Did We Solve the Issues?
What could be improved?
New feedback:
Users had a hard time knowing when their comments had been posted.
Users wanted to be able to sort and categorize the communities they could join.nd organize communities easily.
Repeated Issues:
Users still have issues finding the search bar in the communities tab.
Next Steps:
Iterate, repeat, iterate, repeat. Let’s do this all again!
I plan on using the feedback from the second usability tests to revise my designs. After this, I will conduct another round of usability tests to validate this design!
Reflections:
By the end of this project, I realized how important the research process is in considering a user friendly design. This was my very first project as a UX designer and researcher and in a way, it was like my baby. With that, I taught myself Figma and all of the design process- so I am pretty proud of myself.
Working alone on this project, there was much trial and error that pushed me to become a better designer and thinker. I will greatly miss working on this project and being of service to a marginalized community.