2021 Website & Resource Center

The Trevor Project

CREATIVE DIRECTION + USER EXPERIENCE + User interface + DESIGN SYSTEMS

The Trevor Project is an organization with the important mission to end suicide among lesbian, gay, bisexual, transgender, queer & questioning young people. We were tasked with reimagining TheTrevorProject.org for a digitally native audience.

The Challenge

Reintroducing TheTrevorProject.org to a digitally native audience meant not only refreshing a decade-old website but ensuring that the vital, life-saving functionalities of The Trevor Project were conveyed, accessible, and user-friendly. It was essential to streamline paths to critical features like TrevorLifeline, TrevorText, and TrevorChat, ensuring immediate and straightforward access to help.

UX Design: A Guiding Hand in Crisis

Bearing in mind the criticality of the services provided, our UX strategy hinged on crafting a digital space that was as clear and accessible as it was empathetic and reassuring. The information architecture was meticulously developed to navigate a broad spectrum of resources, subtly guiding users through their journey and seamlessly integrating relevant content, ensuring they never felt lost or alone during their digital experience.

Evolving a Dual-Purpose Website with Strategic IA

Our solution incorporated a bifurcated website that gracefully navigated through two significant pathways. One led to a sanctuary—The Resource Center, a haven where LGBTQ youth could access immediate help and find a supportive community on TrevorSpace. The other avenue propelled visitors towards organizational aspects, emphasizing donation drives and resources, vital in fueling The Trevor Project’s mission. Explore the wireframes below to visualize our strategic IA in action.

A Toolkit for Future Initiatives

A flexible design toolkit was devised, ensuring adaptability and responsiveness to the ever-evolving needs of The Trevor Project. Through a custom-built CMS, we empowered the organization to build custom pages in response to unique initiatives, ensuring the platform remained perpetually relevant and user-centric.

Crafting a Digital Identity with Emotional and Visual Impact

In close collaboration with my colleagues on the Kettle brand team, I took their foundational palette and creative direction, and meticulously built upon it, elevating and scaling their work into a more extensive visual toolkit. Together, we seamlessly integrated and enhanced their existing brand elements, crafting a robust and dynamic digital identity that not only aligned with but also amplified their vital message across all online platforms. This ensured a consistent, engaging, and supportive online presence for every visitor, from LGBTQ+ youth seeking support to allies looking to contribute.

Radiant and Reflective Visual Engagement

Our design philosophy was multifaceted, aimed at resonating authenticity and positivity to both LGBTQ+ youth and their allies. It was not merely a platform to find support but a reflection of the vibrant, positive, and affirming existence within the LGBTQ+ community. The design successfully bifurcated to cater to both young individuals seeking support and allies and donors looking to contribute, each narrative distinctly and empathetically conveyed.

Closing Note

Working on a platform that serves as a digital lifeline was both an honor and a responsibility, underscoring every strategic and design decision made. Through this digital transformation, TheTrevorProject.org was not only modernized but strategically enhanced to align with and amplify its vital mission, offering an accessible, supportive, and uplifting digital space for LGBTQ+ youth and their allies.

CREATIVE TEAM

Client: The Trevor Project

Agency: Kettle

My Role: Creative Director + Art Direction

Team: Jessie Yuan + Aly Arrieta/UI, Meagan Cheung/UX, Marilyn Manno/Copy