GAELF
Role: Product Designer
My involvement: UX/UI, client workshops, responsive design, accessibility, Remora variables, developer collaboration and design QA
Team: Sole designer working with the client, project manager and developers
01
The challenge
GAELF works towards the elimination of lymphatic filariasis, with scientists and researchers using the website to access information and resources.
The existing website had become difficult to navigate and information wasn’t always easy to find. Readability was also a problem, particularly on mobile, where content felt cramped and navigation was harder to use.
The client was seeing more people access the site on mobile, so improving the mobile experience and making important information easier to reach became a key part of the redesign.
02
Understanding what needed to change
I was the sole designer on the project and worked directly with the client and project manager.
During our initial design meetings, I gathered feedback on the main problems they were seeing and what they wanted from the new site.
The priorities were clear:
- make information easier to find
- simplify the navigation
- improve readability and accessibility
- create a much better mobile experience
- modernise the visual design without losing the existing GAELF identity
They wanted to keep their existing logo and use a minimal colour palette, which led to the blue and yellow visual direction used throughout the redesign.
03
Creating the visual direction
From the client feedback, I created a moodboard to establish the visual direction before moving into the full site design.
I then presented the direction in a design review so we could make changes early, rather than waiting until development.
Once the direction had been agreed, I adapted the variables within the Remora design system to create the GAELF theme.
This allowed the design system to carry the client’s typography, colours, spacing and other visual decisions consistently throughout the website.
04
Designing for mobile and accessibility
Mobile was particularly important because the previous website became cramped at smaller screen sizes.
I adjusted typography and spacing so content had more room to breathe on mobile and was easier to read without overwhelming the screen.
I also made accessibility decisions throughout the interface, including improving contrast, readability and making interactive elements such as buttons visually clearer than they had been on the previous website.
The navigation was simplified so users could understand the site structure more quickly and reach the information they needed with fewer obstacles.
05
Working within Remora
GAELF was particularly interesting because it was the first website built using the new Remora system.
The system allowed developers to export the design configuration and use those variables to build the website, while still allowing the client flexibility over page layouts and content.
Building the first real site with Remora also exposed opportunities to improve the system itself.
One of the things we identified was the need for dedicated mobile variables. We wanted typography and spacing to adapt automatically at smaller screen sizes rather than having to correct those values manually for every site.
That learning then fed back into the Remora system.
06
Working with developers
I worked closely with the developers throughout the project rather than handing over finished designs and disappearing.
Before presenting more bespoke elements to the client, I checked their technical feasibility with the development team. For example, the client had paid for a more customised homepage banner, so I reviewed the idea with the developers before presenting it.
During development I also wrote tickets, reviewed work while the site was in staging and carried out design QA before confirming that work was ready to be published.
Client feedback continued throughout this process. For example, the initial banner typography felt too large to the client, so I reduced it before the final version was approved.
.png)
.png)
07
The result
The redesigned site created a much clearer, more modern and mobile-friendly experience while retaining GAELF's existing identity.
A current Lighthouse audit of the live site scores:
93 Accessibility
100 Best Practices
89 Performance