Access Figma prototype here

Context

Company

Ulule is a crowdfunding company operating in Europe and North America. It focuses on funding projects with a positive impact. Frequent projects funded on the platform include clothing or self-care brands, music or book releases and charity fundraising. These projects can be of many different sizes, raising from 1000 up to a million euros.

Ulule is often recommended by creators thanks to its coaching team, helping them succeed in funding their projects.

‍Project

For a very long time, navigation on Ulule's website consisted of a nav bar and a burger menu. This system used for many years had a lot of flaws, it was unsuccessful in presenting projects (which are the main content on Ulule) and used the burger menu with no hierarchy or real meaning. Considering this, we decided to redesign Ulule navigation UI while trying to reach the following goals :

Improve access to projects and curated channels on Ulule
Keep an easy access to the "launch a project" CTA
Provide a clear presentation of Ulule's services in a single place

Main softwares used for this project: Notion / Figma

‍

Research

Analytics

To get a better understanding of how our navigation UI was used we made several Hotjar maps and Google analytics reports. Those made us realize that the most used functions on our nav bar were research, access to online projects and launching a project, which makes sense since they are at the core of what Ulule does.

Using personas

We also analysed our navigation UI by using our personas, some being backers (people who give money to projects) and some being creators. We divided and ranked content depending on the most important needs of these users.

Ranking content depending on type of users

‍

Prototyping

Early ideas

Following those investigations, our first approach was to propose a content navigation for each type of user, one for backers and one for creators.

This lead us to experiment with many UI and wireframes, all based on this idea of a menu per user. After trying dozens of possibilities, and looking for inspiration all around the web, we came to the conclusion that this type of UI highlighting all of our services was really complex. It would have been a great fit for a SAAS website but it was not a good idea on a platform like Ulule that needs to address both creators and consumers.

Experimenting our one user one menu approach — Experimenting with our one menu per user approach

Rethinking our approach

Following this first step, we decided to rethink our approach and make it more centered around our users' needs and not just on listing content. That's why we worked on a new hierarchy and on a more limited selection of content that we wanted to show.

Comparing hierarchy of different menu structures

This lead us to the conclusion that we needed to avoid any big burger menu that would be a complex unfriendly list and focus on a lighter UI addressing those 3 needs:

Finding a project through search, categories or channels
Launching a project as easily as possible
Get to know all our services in depth

The third need being a secondary one, we made the decision to include it on a landing page and not as a full menu.

Having our three main components, we started experimenting with every layout possibility for this navigation bar. We eventually decided to go with a centered logo since it was our specific design for many years and we added 4 links to the menu :

Discover Ulule
Launch a project
Explore project
My profile

Testing different layouts for our menu bar

Landings

After finding a great layout for our menu bar, we then had to focus on landing pages and menus. For the Discover Ulule and launch a project buttons we would create landings pages that would present the tools made available for creators and backers. This would end up being a spin-off project that we would develop together with a design agency.

Designing a search UI

Since one of our focuses was to give easier access to the projects being funded on Ulule, the redesign of the search / explore projects UI was crucial.

At first, we went for a menu that would appear when clicking on search and explore and only show a list of categories. We ended up realizing this UI was very generic and did not give a feeling of engagement towards content.

‍

Since we really wanted to focus on content discovery for this new UI, we tried showing our channels (curated project lists) on the search menu in order to give it a more vibrant look and help users find new projects.

Experimenting the implementation of channels

We strongly believe this was a good move because channels are an important part of our brand content and partnership strategy and they really help users discover new projects. That's why we approved this idea and added it to our UI.

‍

Final UI

Main UI

The final navigation UI that we proposed consisted of this new navigation bar, with the 4 links previously chosen. Just like we wanted, it's a simple straightforward UI focusing on users need and Ulule's content.

The second main element of this new UI wad our search / explore projects hub that allow users to search projects and have a look at our channels and categories for easy exploration.

Mobile

All of those UI were also designed to be responsive and work well on mobile.

‍

Follow UP

This new navigation UI was implemented on Ulule some months ago and we then took some time to run new Hotjar and Google analytics reports. Those showed that, as expected, the new UI increased the number of users actually exploring projects through searching or channels while keeping things easy for people who wanted to launch a project on Ulule.

Overall, our goal to create a more usable navigation UI for both creators and backers was achieved.

We are now working on new steps for this project such as adding live search results and we keep working on our landing pages spin-off project.