Overview

Gorilla's Experiment Builder is a desktop-only, online behavioural science tool that lets users create a diverse range of psychological tests. The client struggled with managing support tickets, hoping to redesign the product for better UX and allow users to solve problems themselves. In my role I navigated client liaison, UX research, UI design, style guide creation, prototyping, and client presentations.

Key deliverables for the project included a contextual inquiry and audit of the current site, user flows and a hi-fi prototype to implement.

Gorilla's Experiment Builder is a desktop-only, online behavioural science tool that lets users create a diverse range of psychological tests. The client struggled with managing support tickets, hoping to redesign the product for better UX and allow users to solve problems themselves. In my role I navigated client liaison, UX research, UI design, style guide creation, prototyping, and client presentations.

Key deliverables for the project included a contextual inquiry and audit of the current site, user flows and a hi-fi prototype to implement.

Overview

Gorilla's Experiment Builder is a desktop-only, online behavioural science tool that lets users create a diverse range of psychological tests. The client struggled with managing support tickets, hoping to redesign the product for better UX and allow users to solve problems themselves. In my role I navigated client liaison, UX research, UI design, style guide creation, prototyping, and client presentations.

Key deliverables for the project included a contextual inquiry and audit of the current site, user flows and a hi-fi prototype to implement.

The problem

The problem

Users struggled with the concept of the builder's experiment tree, and how to use the interface to manage their task design. The client was wading through support tickets to help users, a time intensive and overwhelming problem for the team. Ultimately the client wanted users to be able to understand and use the tool more intuitively — solving problems on their own through better UI and signposting.

The solution

The solution

Enhanced onboarding experience:

  • Improved legibility and accessibility.

  • Targeted onboarding screens dynamically appear based on user needs.

Revamped navigation:

  • Introduction of F-pane layout for improved navigation efficiency.

  • Simplified builder interface for a more intuitive user experience.

  • Clearer distinction of UI elements and hierarchy, enhancing overall usability.

UI refinement:

  • Implementation of universal iconography for consistent and easily recognisable visual cues.

  • Adoption of visual card designs to enhance the overall aesthetics.

  • Expanded colour palette for a more engaging and visually appealing interface.

Help widget integration:

  • Introduction of a user-friendly help widget to replace the old, dense, and confusing help screen.

  • The new widget provides context-specific assistance, ensuring users can easily access relevant information.

Enhanced onboarding experience:

  • Improved legibility and accessibility.

  • Targeted onboarding screens dynamically appear based on user needs.

Revamped navigation:

  • Introduction of F-pane layout for improved navigation efficiency.

  • Simplified builder interface for a more intuitive user experience.

  • Clearer distinction of UI elements and hierarchy, enhancing overall usability.

UI refinement:

  • Implementation of universal iconography for consistent and easily recognisable visual cues.

  • Adoption of visual card designs to enhance the overall aesthetics.

  • Expanded colour palette for a more engaging and visually appealing interface.

Help widget integration:

  • Introduction of a user-friendly help widget to replace the old, dense, and confusing help screen.

  • The new widget provides context-specific assistance, ensuring users can easily access relevant information.

Impact

Impact

We witnessed a substantial improvement in System Usability Scale (SUS) scores, rising from an initial 20.4 during the first round testing of the old product to 75 on our latest prototype. This significant increase is testament to the effectiveness of our solutions in elevating the user experience.

Despite concluding my involvement before witnessing the implementation, the client reached out to show progress on the product - with a complete rebuild based on our design proposals. To further affirm the impact, the project lead crafted a personal testimonial, which you can read below.

Testimonial

Testimonial

"As the project lead for his team, Tom proved himself an excellent client liaison, communicating in a clear and personable manner whilst avoiding jargon. He demonstrated a high level of professionalism, and showed a passionate and genuine interest in our company and our users’ pain points.

He kept us informed throughout the project, asked insightful questions that showed he understood us and our needs, and worked with his team to produce a fantastic set of actionable insights. During the project, Tom worked on the user research prototyping, then subjected the team’s own work to further user testing to ensure the desired outcome. He contributed to the development of the UI style guide, and the resulting hi-fi prototypes demonstrated a blend of aesthetic talent and an eye for both detail and function.

The deliverables from the project were brilliantly executed, and the attention to detail in the final hand-off presentation really took the work to another level. We gave the team an admittedly vague brief, and they asked all the right questions to hone in on the core problems we were having — then went the extra mile to make sure they understood us and our users. Tom and the team took the initiative, conducted an impressive amount of UX research, and communicated their findings to us in a clear way. As our Head of Development said after the team’s presentation: ‘If I thought I could get away with it, I would drop everything I was doing and start implementing these designs today!’"

Johanna Tomczak, Solutions Developer at Gorilla

Read the full case study

Read the full case study