Unifying Mozilla Fellowships’ web presence to strengthen the visibility of the program
My role: UX/UI Designer
Main contributions to this project: I contributed to this project from start (research, ideation, wireframes) to finish (UI design – based on existing Mozilla Foundation design system, implementation with engineers). I also participated in stakeholder management (met with diverse stakeholders, addressing their feedback).
Problem statement
The Mozilla Fellowships program lacked a cohesive online presence, with information about fellowship types scattered across different websites. This fragmented information posed challenges for applicants in understanding our full spectrum of fellowships and discovering new opportunities, which was negatively affecting the number of potential applications.
The goal of this project was to unify the fellowships web properties into one place.
Process
I Discovery Phase
I had a kick off meeting with stakeholders to better understand the goals they wanted to achieve with this project. This meeting was essential to uncover some other needs that were not apparent to me at a glance. This hub should address the needs of multiple groups of people with different needs:
- Potential applicants
- Current and past Fellows, serving as a connection hub
- People interested in learning more about our Fellowship program: funders, media and others
I then mapped and analyzed all the existing Mozilla Foundation’s web properties that hosted fellowship content so I could leverage the good things we already had in place and identify the areas that needed improvement.
After that, I did an information architecture benchmark analysis to identify best practices and become acquainted with the structures familiar to our main target audience, potential applicants, in this highly specialized field.
II Planning Phase: UX
In the next step, I identified the personas that better represented our target audiences and developed a user journey for each one of them.
After gathering enough information, I went to the next phases: creating wireframes and interactive prototypes. The project coincided with Mozilla Foundation’s transition to a new CMS, introducing an added layer of complexity. Ensuring compatibility with the CMS and prioritizing component reusability became important considerations.
Since we had stakeholders in different time zones, it was difficult to schedule meetings in which all could attend. To address this challenge, I created a video presentation with the design walkthrough, together with links to prototypes and a document for collecting asynchronous feedback. Stakeholders found this approach easy to follow and really liked the convenience of giving feedback when their schedule allowed.
“What a great way to do the presentation! Thank you!”
Feedback from one of the project’s stakeholders
III Delivery Phase: UI and engineer implementation
After integrating stakeholders’ feedback into the experience, I moved on to designing the interface. We had a library of components and color scheme already in place (for the rest of the site) so the UI work was focused on creating illustrations/icons, choosing/editing pictures and organizing the elements in a way that made sense in terms of hierarchy and flow.
I worked closely with engineers on not only the public-facing part of the site but also the CMS side: how staff would input the information and how the different components connected to each other.
Conclusion
We successfully launched the Fellowships Hub in April/May 2018, and by November of that year, it had around 18K pageviews. This achievement reflects our team’s success in meeting our goals: centralizing website traffic, facilitating seamless updates for staff, and effectively directing our audience to the hub.