Out & About
The Project
Inspired to serve the LGBTQ+ community, my project team concepted and prototyped a curated events, resources and career services website that enables users to organically network their way toward greater social and financial stability.
Team
Scope
-
UX Research Leads (Rey, Melissa)
-
Market Research Leads (Caitlyn, Amira)
-
IA and Wireframing Lead (Caitlyn, Amira)
-
Branding Leads (Caitlyn, Melissa)
-
User Testing, Prototype and UI (All)
-
UX and Market Research
-
Sitemapping and User Flows
-
Wireframing and Prototyping
-
Branding and Visual Design
-
User Testing and Iteration
Timeline
Two weeks
Overview
Background
​
Engaging with the prompt from Ideo BridgeBuilder 2019, we were confronted with the challenge:
How might we as people on the move and neighbors build bridges to a shared future of stability and promise?
​
The Ask
​
To narrow the scope of our solution, and in light of recent hate crimes targeting the LGBTQIA+ community, we opted to create a tool in service of the queer community. But how could we best generate a "shared future of stability and promise?"
​
​
Priorities
​
Given the ambitiousness of the project, time management and clear role designations were key. Using Agile methodologies, we identified tasks that each team member either excelled at or wanted to tackle, and created a rough schedule built backwards from our deliverable deadline. Wishing to work highly collaboratively, we checked in with each other multiple times a day to track progress and to offer assistance toward other work tasks as needed.
UX Research
The information gathering phase. Our aim was to create a tool that would help fortify a "shared future of stability and promise" in the LGBTQIA community.
Questions to answer
What other organizations and/ or products provide a similar service?
Who is our target user and what do they need?
How do they define community, stability, and well-being?
​
User Interviews
Our initial discussions hinted at a solution rooted in mutual community-based support. Subsequent user interviews revealed that "stability" for users required fortifying supports that are not only social and emotional, but more concrete, like robust healthcare and financial resources.
We initiated a broad market analysis of competitors in the LGBTQ+ space (like The Trevor Project, Center on Halstead in Chicago, and the Born This Way Foundation) and among other functional competitors for event listing and networking (like EventBrite, MeetUp and Bumble Friends). Crafting questions around our hypothesis of event networking as a service to the community, we conducted interviews with our target user group.
Image: Affinity Mapping revealed clear themes in event type preference (online or in-person), definitions of strong community and the importance of career resources.
Some takeaways were as follows:
​
-
Financial security provides greatest stability and wellbeing for users
-
Learning new skills has also led to increased stability and wellbeing for users
-
Events are a common pathway to creating new social connections
-
Users are most comfortable with people that are like-minded
-
Users often seek out close, personal connections when in need of support (friends before family)
User interviews confirmed our thinking around the benefits of peer-to-peer as well as mentorship supports. For example, the majority of interviewees explained that while emotional support from family is important, that it is easier to open up to friends or a paternal figure/ mentor who is not an actual parent. While validation of their sexuality and gender orientation was highly valued, almost all interviewees also stressed the need for financial support and self-sufficiency to undergird their sense of wellbeing.
Next came crafting a user persona and problem statement to focus our ideation.
User Persona
Jade (she/they)
​
Age: 23
Location: Boston
Race: Filipino
Education: Undergraduate college
Income: $35K
Relationship: Partnered
​
​
Jade (she/they) just graduated from the University of Massachusetts, Boston, with a degree in Education.
While in school, she enjoyed being part of creative extracurriculars like improv comedy and acapella. She enjoys being around like-minded people, and wants to continue having an active social life now that she's done with school. She especially wants to get more involved in the LGBT community. Unfortunately, working full time in retail to make ends meet doesn’t allow her to spend much time socializing.
She’s passionate about social justice, especially as intersecting with LGBT community concerns, and would like to find social events in these interest areas that, ideally, also advance her career network. Because she doesn’t have a lot of free time, she needs to be selective about which events she’ll attend.
Market Research and Product Ideation
Armed with the findings from user interviews, a user persona, and a clear sense of the problem to solve, we began ideating.
​
A central question in the early phase of our ideation rose around the importance of a physical space as part of our proposed solution. We looked at non-profits like Bitwise Industries, which focused more on the skills training side of the stability equation by hosting coding classes and providing co-working spaces to participants. Ultimately, we decided that the more nimble solution that required less overhead would be an exclusively web-based events hub with the potential to host pop-ups at various locations around Boston. It was more important to bring community resources together through networking than to build out a brick-and-mortar business model. That said, we do propose a small office space rental for a web admin to maintain the website, publish event listings, and host the Cyber Center, where community members can come to access a reliable internet connection and tech tools for job-hunting and career planning purposes.
​
We revisited competitors and comparators studied earlier in the process and dove deeper, taking a content inventory, plus/ delta and element analysis of their websites. This revealed that sexual health resources, if not hosted by the organization itself, were generally at least aggregated on these sites for easy browsing.
​
Another piece of our proposed solution came from the inherent social and academic resources in the Greater Boston area. The Greater Boston Area is home to 44 colleges and universities, including Harvard University and the Massachusetts Institute of Technology. Capitalizing on the high concentration of colleges and universities in Boston, it made sense to build a web-based tool with which members of the queer community could use to organically network in academic, professional and social circles, developing authentic support structures that benefit the community in multivalent ways.
Problem Statement:
Jade needs an events resource hub to promote a regular cadence of events in Boston, so that she might benefit from enhanced LGBTQIA+ community bonds that contribute to both social and financial stability and wellbeing.
Product Design
Our research has yielded trends which we have distilled into a problem to solve, and an initial product ideation. Now, to give it form.
​
Questions to answer
How should we organize information within our product?
How do we expect the user to navigate this information?
How will the product look?
Site Map and User Flows
We created our site map and three user flows. The first and third flows had to do with browsing and navigating the events pages, and the second flow led the user through the sexual health resource pages.
Wireframing and Prototyping
We tested our ideas out wireframes which we then developed into a very low-resolution prototype, and refined to mid-resolution before testing with users. Perhaps my favorite part of the UX process is seeing the wireframes gain resolution and clarity as they evolve into a high-res prototype. Below are a few screens from each iteration.
Refining the Product
We now have a clickable prototype ready to be put in front of users. Let's see what they do.
​
Questions to answer
Are users encountering difficulty using the prototype?
If so, how can we fix it?
Are our changes improving the user's experience?
User Tasks
We conducted two rounds of usability testing, first with our mid-fidelity wireframe, and then again with our high-fidelity wireframe after some iterations. Our three user tasks are below.
​
Task 1:
Show me how you’d find and reserve your spot for a casual crafting meetup.
Task 2:
Show me how you’d find a sexual health primary care provider in your area.
Task 3:
Show me how you’d find and reserve your spot for an upcoming career networking function.
​
In Round 1, 12 out of 15 users (80%) completed each task in 1 minute or under; all 15 completed the tasks within 2 minutes.
User errors clustered around the navigability of the sexual health resources, and use of pagination for browsing on the events listing pages. We rewrote some headers, tweaked the look and placement of our pagination, and refined further.
​
In Round 2, 8 out of 9 users (89%) completed each task in 1 minute or under. We tested 6 additional users that were less tech-savvy than average, just to see how accessible and intuitive the content was. Only 3 out of 6 (50%) completed each task in 1 minute or under, but there was a noticeable learning curve, as later tasks showed considerable improvement. Taking into account both the average and less tech-savvy users, all 15 completed each task within 2 minutes.
Final Prototype
Our current prototype is the result of an initial prototype, one round of usability testing, one round of iteration, and a second round of usability testing to assess any change in user behavior. There will always be more features to improve, and new ways to smooth out the user journey; no prototype is truly final.
​
Find our current prototype here.
Conclusion and Next Steps
Our clickable prototype is simple, clear, and easy to navigate. It has a well-articulated copy and a fully realised UI, including branding and color palette. We do, however, have more features to build out and opportunities to iterate further.
​
For next steps, we'd like to:
​
-
Build out the other sections available on the Services and Resources page
-
Launch our donation page; this will be essential for funding the brick-and-mortar cyber center and administrative office
-
Keep testing pagination; While our iterations have shown improvement, there is need to keep testing for further optimization
-
Build out mentorship program, as this was an important takeaway from our user interviews