Nora Molnar-Ercsei
UX designer

Limitless Project

Creating a website experience that helps young New Zealanders to build confidence, self-awareness, and to discover their strengths and values.

Project Background

Limitless is a Charitable Trust with the mission to equip young New Zealanders to lead lives of passion and purpose.
In this project, I worked as a UX designer in an agile team of two UX designers and a Developer. The project was 10 weeks long.

Our goal was to create a website for Limitless where they can promote their conferences and online courses for schools and year 10 students. Helping them to reach more potential customers and by doing that help more young people to build confidence, self-awareness, and to discover their strengths and values.
Our other main objective was to improve their brand identity.

Software Used In This Project

  • Figma

  • Adobe Photoshop

  • Miro

  • Microsoft Teams

  • Zoom

Design Thinking Process

Interviews

At the discovery phase of the project, we conducted user interviews in order to get a better understanding of the problem.

We interviewed the stakeholders, first the founder of Limitless and then customers, specifically teachers and students.

What we learned from the interviews are the following:

  • The founder wants to improve the brand identity, have more visitors on the website, keep the content up to date, make the site easier to navigate, create a better information hierarchy, promote their online course and their upcoming conference.

  • The customers want to see more concise up to date content on the homepage but they also want to be able to read longer format detailed information as well on separate pages. They want to be able to find information on the homepage about the upcoming events and on what other schools and students think about Limitless.

Limitless Website Redesign Project

Sketches

I usually start the design process with hand-drawn sketches/wireframes. This is the way I iterate through many design options quickly.
We reiterated and added to our designs as the scope of the project increased.

We then used the dot voting process to decide on the option we will move forward with and create a digital wireframe from.

Limitless Website Redesign Project

Wireframes

We then created wireframes in Figma for testing purposes.
First, the founder tested it, and then we conducted 3 more rounds of testing with 1 student and 3 teachers.

Limitless Website Redesign Project

User Testing

We conducted 4 rounds of testing in total on the wireframes.
The 1st round of testing with the founder happened in person, and we conducted the other 3 via Zoom.

Based on the feedback we received, we reiterated our wireframes and started to create prototypes.

When the prototype was ready we conducted 1 round of testing with the founder, reiterated our design based on that, and then conducted another 3 rounds of testing with teachers via Zoom.

Limitless Website Redesign Project

UI Design

Once we tested and fixed all usability issues, we started designing the final screens in Figma.

For the visual style, we went in a direction that conveys the important message and mission of Limitless and also shows the more light-hearted and youthful side of the organization as it is about Year 10 high school students.

We made sure to highlight all the important and up-to-date information, displayed all the achievements and social proofs on the homepage that will help potential future customers to make an informed decision.
In today’s digital ecosphere, 70% of consumers look at reviews and testimonials before they buy products or services. Based on our user research this section is really important for schools when making a decision about who they would like to work with.

We incorporated original images on the website and it helps to establish a personal connection that could potentially be the foundation for long-term customer relationships. Statistics show that using real, authentic images on a website can convert 35% more visitors to customers.

The branding has become brighter, more modern, and more captivating. Vibrant colors enable contrast that helps to increase readability and legibility.

The human brain reacts intensively to bold colors, that’s the reason why bright color combinations can be easily noticed and memorized. The colorful UI design has a great chance to stand out from the crowd among many products with weak colors.

Limitless Website Redesign Project

Before and After

In this before and after picture of the homepage, the difference can be clearly seen in the color palette, which has become brighter and more youthful in the new version.
Also, the amount of text that is displayed on the homepage has been reduced and replaced with more images and icons, emphasizing the most important data and information.

15+
Iterations
5
Screens
95%
improvement in user experience
70
cups of coffee