UX Case Study: Pride in Design
Introduction
The goal of this project was to design a captivating and inclusive landing page design experience for a non-profit organization focused on women's advocacy, utilizing a Pride Month theme to celebrate diversity and amplify the intersectional voices within the LGBTQ+ and women's rights movements.
I strive to ensure that this website reflects Empathica's commitment to inclusivity and empowerment. During Pride Month, the organization focuses on seamlessly integrating LGBTQ+ events and features while maintaining its brand identity.
My Role: UX/UI Designer
Tool Used: Figma
The project aims to:
- Create an appealing and user-friendly landing page design.
- Celebrate diversity and foster inclusivity.
- Amplify voices of marginalized communities.
- Drive meaningful action towards equality and social justice.
Research
User Interviews
Conducting in-depth interviews with a diverse group of participants is essential for gaining nuanced insights into the needs, preferences, and behaviors of the target audience.
Example Questions
- Can you describe how you feel when interacting with online platforms related to women's advocacy and LGBTQ+ rights?
- How important is it for you to see diverse representation of gender identities and sexual orientations in the platforms you engage with?
Pain Points
- Lack of Representation
- Struggle to Access Informative Resources
Problem & Context
Online platforms lack inclusive representation and accessible resources. Users feel excluded and disempowered, hindering engagement.
Brainstorming Ideas
- Inclusive Platform - An inclusive platform dedicated to amplifying the voices and experiences of women and LGBTQ+ individuals, with a focus on intersectionality and representation of diverse identities.
- Resource Hub - A comprehensive resource hub tailored to the needs of advocates for both women's rights and LGBTQ+ equality, offering curated collections of reports, articles, toolkits, guides, and workshops for advancing both causes.
- Community Building - A community dedicated to connecting advocates for both women's rights and LGBTQ+ equality.
- Virtual Workshops - Virtual workshops focused on key topics within both women's advocacy and LGBTQ+ rights, featuring expert speakers, interactive discussions, and skill-building sessions.
Low Fidelity Wireframe
Final Design
I'd like to curate a palette primarily featuring Pride colors in various tones and values, aiming for a calming effect. These hues are used in floral designs across the website, predominantly as part of a Pride theme. The website's core colors are #F5F5F5, #1A1A1A, and #D9D9D9.
The floral designs serve a symbolic purpose, representing growth and strength in the context of advocacy and empowerment. During Pride Month, incorporating with these colors into these designs amplifies the message of inclusivity and support for LGBTQ+ individuals.
This visual expression of solidarity fosters a welcoming atmosphere and reinforces the organization's commitment to diversity and equality.
Typeface - Primeform Pro (Demo)
Primeform Pro harmonizes clarity and elegance, elevating both readability and aesthetics within this design.
With its sleek sans-serif style, Primeform Pro guarantees effortless reading while radiating a contemporary and refined ambiance. Its diverse font weights and styles uphold uniformity and hierarchy, fostering a refined and inclusive user experience.
Conclusion
In my brief three-month journey as a UX designer, this project has marked a significant milestone. The project has been a valuable learning experience, showcasing the power of design in advocating for social justice and amplifying marginalized voices.
Moving forward, I am eager to continue honing my skills and making meaningful contributions to the UX/UI design field.
Tools used
From brief
Topics
Share
Reviews
6 reviews
Thank you for your work! I really appreciate the project and the overall idea behind it. The visual design and the overall feel of the landing page are great. The page structure effectively presents the value proposition in a clear, step-by-step manner.
However, I feel that the primary white buttons lack energy and motivation. The red "Join Us" button gives off a somewhat alarming feeling because of its color.
I also have some concerns about the UI design. On the login page, the buttons for signing in with Google or Facebook are quite small, even though they are important for the primary action of logging in.
These are just some small tweaks that caught my attention.
I would like to add the color used are so obvious. Would have loved if different color schemes where considered which can be derived from the same topic.
It is very nice topic that you chose and the design gives soft and cute feeling.
That hand-drawing style flowers, I like them. It matches to the theme.
Visual wise, I think it would be nice if you use more wider vertically
- like each of those three cards takes full screen, then user scroll down.
It would give more dynamic impression.
It is just another idea :)
Good work!
I was impressed going through your work. The details in the UX is outstanding and the UI is what I like the most. A proper representation of design elements that blends well with the structure and layout of your landing page while celebrating women in relation to Pride Month and LGBTQ+ community.
One thing I would like to see change is the CTA buttons on the hero section. I think a single CTA button will properly guide users to which action is best to take next depending on your goals for them.
I'm not a professional designer, but I genuinely appreciate your work. The outlines of the leaves are beautifully delicate, adding a unique touch and character to the page. It's charming, and the colors subtly emphasize the theme in a more refined way than the boldness of the flag itself.
Moreover, the topic you chose for the landing page resonates deeply with me. It addresses significant and meaningful issues that are prevalent in our everyday lives. Your design not only captures the essence of the subject but also brings attention to important matters in a thoughtful and engaging manner.
The overall aesthetic and the message it conveys make this landing page both visually appealing and impactful.
The project looks beautiful and meaningful. The visuals and the colours choice work perfectly together. 🙌
On a UX side, I see a bit of disconnection from presented information architecture and the design itself. One thing to research is the main business and users goals. For example, is the main purpose to receive donations or to login to the website or maybe showcase events? In any case adding main CTA will help to lead users through the website.
There are visual floral elements used, would be great to understand the choice behind them. Otherwise feels a bit unclear purpose.
Great work!
You might also like
GoDaddy Sign-in Page Accessibility Optimization
My Bestie Nessie - Making a game in one day at the Oakland Museum of Art & Digital Entertainment
Web SaaS Sign-Up Flow
Push notifications
Samyoung Chemical
Roof Recovery – Local Roofing Contractor
Content Strategy Courses
UX Writing
Common Design Patterns
Reducing User Churn