Designing a website for the team of iGEM Outaouais 2024.
🤝 Volunteering
2023-2024
UX
Website
Empathizing to understand the needs of iGEM Outaouais
After joining the multimedia team and proposing to build the organization's website, I planned a meeting with the Head of iGEM Outaouais, Stéphanie Pontier, where we openly discussed about what were the intended goals and their current pain points.
Website has these pages : Homepage, About, Our Project, Team, Sponsors, News, FAQ, Contact
Website has to be responsive across all platforms
A platform to showcase the project
Raise funding for the project
Explain what's iGEM
Integration of their social medias
An active blog
Representation of the multidisciplinary team
User Research
I continued my work by doing research to understand who are going to be the potential users that will navigate on the website. I identified 2 types of users and their motives:
Potential Donor / Sponsor
They visit the website since they want to donate/contribute to the project of iGEM Outaouais. They are looking for personnality, reassurance about where their money is going and status.
Science / iGEM Enthusiasts
They visit the website since they want to know as much as possible about the project, have an active blog to follow week after week and see the progression of the ongoing project.
From there, I made user personas representing the two types of users to reflect and get a deeper understanding of their needs and pain points.
Competitive research (Benchmarking)
I also decided that competitive benchmarking would work great for this project since there are many organizations that have mastered fundraising through their websites. This is why I assessed a few websites from these organizations to understand what I need to incorporate into my own website for it to work well.
Clear intention of raising funds with the recuring use of CTA's, very clean aesthetic, looks credible and thrustworthy.
Information about the crises that they are fighting for is clear, articles about their achievements, statistics makes them more credible.
Has lots of personnality and could be a great model to follow for iGEM Outaouais. Representative fullscreen video, lots of insightful information.
Reflecting on my competitive research, I identified a list of insights that will be integrated into the website to ensure a better chance of success by following best practices.
Keeping transparent and clear intentions
Having lots of information related to the project
Recuring use of CTA's for donations
Articles related to the projects
Website has personnality
Clean and profesionnal look
Userflow
Once the research was done, I started the design process of the website by making a userflow defining each page that will be part of the website.
First Prototype of the website
Now that I have a plan and not much time before the deadline for the prototype, I needed to adapt. This is why I decided to skip wireframing and to go straight into designing and developing the prototype in Wordpress.
Iterations made, second prototype
I also needed to change the entire brand idendity since their official logo has been chosen along side with their new color palette.
Last few iterations and approval for launch
A few days before my deadline, I organized a last meeting with the Head of iGEM Outaouais to get her last feedback to make quick iterations and to get her approval for the launch of the website.
I executed the last few changes and launched the website!
