UX improvement for the Fighting Fears Community Website.
Final product:
Mockups and the list of design suggestions for the Fighting Fears Community organisation’s website.
Project type:
Volunteering work for the Human Rights organisation.
Contribution:
Research interviews
Structure & content analysis
Brand shaping
Personas identifying
User journey mapping
Paper & low fidelity prototypes
Design analysis & changes suggestions
Challenge
The website of an organisation providing psychological support to LGBTQ+ individuals combines business and volunteer efforts based on shared values (human rights organisation + business for psychologists and coaches working within it).
Complexities:
The organisation operates as a hybrid of business, volunteer work, and a values-driven human rights organisation.
The website was created and is maintained by just one or two people. The goal is to preserve the design, style, and structure while keeping it simple enough for the team to manage using website builder platforms.
The site contains a large amount of information but lacks a clear structure. It was not initially designed to accommodate all the projects and activities that have since been added. Content is added randomly, with no clear guidelines on what should be included or where it belongs. Despite its chaotic structure, the site is necessary and reflects a dynamic, evolving project that allows for experimentation. However, its complexity hampers user interaction.
A part of the main page before my work:
Research
Due to limited resources for conducting UX research, I conducted in-depth interviews with the creators and the person responsible for maintaining the website. These interviews helped clearly identify the user personas.
The project has no fixed deadlines, and changes are implemented as time allows.
Project goals
Improve the website’s effectiveness by:
Making it easy to purchase webinar and online session tickets.
Enabling organisations to reach out for collaboration opportunities.
Simplifying site navigation for creators.
Increasing the number of users subscribed to the newsletter.
Enhancing the organisation’s professionalism and user-friendliness.
Boosting views of psychological articles and profiles written by trainers and coaches.
The results will be measured by website statistics, the number of services purchased through the site, and the number of collaboration requests received.
Analysis:
Brand Analysis.
Before starting work on the website, we analysed the organisation as a brand, defining its scope and competencies. This process helped the organisation clarify its identity and focus, addressing key questions like "Who are we?". It also guided the differentiation of unique content, partner information, and external resource sharing.
The analysis was conducted using two methods: project analysis and interviews.
We reviewed existing company projects and their current website, which required structuring.
Additionally, we conducted a series of interviews with the company's owner and founder.
Through this process, we identified the core identity of the Fighting Fear Community (FFC), its key characteristics, and unique traits.
Planning:
Due to the website's abundant and chaotic content, the first step was to establish criteria for structuring the content and restructuring the site with minimal changes. This required analyzing the web portal to understand what the company already offers, its current activities, and the user scenarios it supports. A map of the existing site was created.
Simultaneously, given that the project has been active for several years, surveys and in-depth interviews with the website team allowed us to identify and accurately describe the project's personas:
Mark, 25
Loyal Community Member.
Follows the project's social media, learns about updates from TikTok or Instagram, and visits the website to purchase a webinar ticket or read an article they saw announced on social media.
Ive, 33
Organization Searching for Queer Professional Collaboration.
A representative seeking LGBTQ+ training for their organization's employees. They find the project via search engines, request collaboration after confirming the organization's expertise in such projects, and communicate through a contact form or direct email.
Sam, 31
Queer Person Seeking for Help and Support.
Looks for psychological help, advice, or online consultations with a psychologist. They need assistance with issues related to queer identity and want to feel understood and confident that the specialist will be knowledgeable about their identity and its specific challenges.
The next phase of the project involved two simultaneous approaches:
1. Analysing and structuring existing website content and projects.
2. Assessing user needs to create User Scenarios.
The first step was to analyse the current structure and areas of the company’s work as reflected on the website. The existing structure was studied and documented.
Due to the lack of a clear structure and hierarchy of sections, the challenge was to identify and account for all sections. Some subsections could be accessed from the main menu, others were linked through multiple paths, and some were hidden behind an image that didn’t appear to be a button, located on a third-level page. The goal was to establish principles for structuring the material while preserving the old structure as much as possible and as rationally as possible.
During the work we defined and briefly described the website content according to various characteristics.
Web Page Sections.
Therapies
Webinars and Other Events
Blogs (Articles from the FFC professionals)
Freeya (AI Bot)
Peer-to-Peer Support
Collaborations - LGBTQ Consultant Services
LGBTQ+ Resources (Queer Library)
About Us
Our Shop
Become a Part of Our Team
Page/Chapter
The content also needed to be divided into unique (created by the FFC) and recommended (reposts from other sources). Additionally, the content should be separated for individuals and for organisations (groups, teams).
User Needs and Actions.
Need for Inspiration and Knowledge.
- Read blogs from FFC professionals.
- Attend webinars and workshops.
- Explore the Queer Library.
Need for Help and Support.
- Ask questions to Freeya (IA bot).
- Find a therapist.
- Peer-to-peer support.
Need for Special Solution
for Organisation
- Build a collaboration with FFC.
Active User Actions.
To Write to the FFC.
- Request a solution for a company/organization (build a collaboration).
- Suggest something for the Queer Library.
- Ask questions about the FFC services.
- Offer queer-professional services (join the FFC team).
- Volunteer for the FFC.
To Buy.
- Purchase a ticket to a workshop/webinar.
- Find a queer therapist and book a session.
- Purchase special services/events for an organisation/team/company.
Design:
The design of the new information architecture and wireframes was initially sketched on paper and organised with sticky notes. These concepts were then discussed with the client during an in-person meeting.
Changing the visual design of the product was not part of the project plan, as the client wished to retain as much of the original design as possible. Since the client would be responsible for maintaining the design, I prepared a list of practical recommendations for design and usability improvements for them to implement independently.
Instead of creating high-fidelity prototype, it was decided to provide the client with a visually-oriented document. This document broke down and described the design and proposed changes by section. Additionally, I created a list of suggestions to help the client further optimise the site and improve its usability and design structure.
At the client's request, the work results were presented as follows:
Structure of the Main Page
Block 1: Main Menu.
Block 2: A short and clear description answers two questions.
Who We Are: A community of queer professionals for queer people. (2-3 sentences maximum. It might be helpful to explain the name of the organisation - what fears do we fight.)
What We Do: Clearly outline our actions and projects, such as offering professional psychotherapy support for individuals and couples, queer educational and inspirational webinars, and consulting services for organisations on LGBTQ+ themes. A straightforward, simple explanation is needed.
Block 3:
Responding to User Needs:
What can we do for you today? Options include:
Education and Inspiration
Help and Support
Collaboration
Buy Event Ticket
Block 4:
Education and Inspiration:
Webinars and other events with the option to purchase tickets. "Our Next Event"
Blogs from our team (also serves as an advertisement for our therapists). "New in Blogs"
This block should include text about how we educate and inspire queer people, with links (buttons) to the Events page and the Blogs page. (A button linking to LGBTQ+ resources could also be included here.)
Block 5: Help and Support
This section highlights the various ways we provide help and support for queer individuals. It includes information on our therapeutic services, well-being activities like Qi Gong, wellness tips, and self-care practices (moved from the Resources page). Additionally, it covers peer-to-peer support and introduces our IT bot, Freeya.
Links (buttons):
Therapies page
Peer-to-Peer Support page
Note: We don’t need a button for Freeya’s page, as Freeya will appear directly in the dialog window on the page.
Block 6: LGBTQ+ Consultant Collaborations
Interested in building an LGBTQ+ collaboration?
Contact us (button)
Collaborations we've worked on:
Here are examples of how the FFC team has supported organizations, tailored to their specific needs:
Negative Impact of Gender Norms: Online seminar and workshops for Yara, Belgium.
Psychological Wellness, Trauma Processing, Resilience Building: Well-being retreat for YA4D, Chiang Mai, Thailand.
Clinical Supervision and Consultation: Services for Naz Project, London, UK.
Religious Identity and Queer People: Contribution to the book Relationally Queer for Pink Therapy, among others.
(The format should follow the first example, with 3 to 6 examples of collaborations.)
See more collaborations (Link/button to the Collaborations page)
Block 7:
Downpage menu
Subscribe to our newsletter button. The rest of the menu as it is now.
List of suggestions.
The client also received recommendations on the website’s design and information structure. The advice was provided in a list format.
Here are a few examples:
Whenever possible, external links should open in a new window to avoid navigating away from the FFC page.
The buttons and links on every page must be consistent, serving as a unified "action language" throughout the website. Using images as links is not intuitive, especially since not all images on our website function as links. Therefore, I recommend avoiding the use of images as links.
Slide-show images are effective when creating a general impression or conveying emotions. Since users typically focus on only one or two photos from a slide-show, each image must carry equal informational weight. If every picture is important, avoid using a slide-show format.
After the changes and new main page concept were approved, similar work was done on the "Therapy" and "Cooperation" sections.
Launch:
The changes are being gradually implemented by the website creators themselves. With a clearer, more understandable structure and direct links to all sections, the client was able to organize the content of their web portal. As a result, they finally found it much easy to navigate to different sections.
According to website analytics, even after implementing some of the changes, we achieved the following results:
A significant increase in the number of users navigating from the main page to other sections of the website.
An increase in the number of ticket purchases through the website.
An increase in the time users spend on each page.
I didn’t have direct access to the analytics, so these results were shared with me by the client.
Further changes and development of the website are being managed by the client themself. You can check the current state of the project on the official website of The Fighting Fears Community at fightingfear.co.uk.