During the first term of the college, I was responsible for wireframing and prototyping the “About Us” page for the Ontario Professional Engineers Foundation for Education website, along with team members. I used Adobe XD for this work.
The Ontario Professional Engineers Foundation for Education is a non-profit charitable organization that funds scholarships for students in the Engineering field. In partnership with Centennial College, the foundation needed a revitalized design for their website in order to represent better what the organization does.
I was responsible for the UX/UI designing of part of the sections and the whole About Us page, the current state analysis for the whole website, and one of the several personas we have created. I made part in user research, competitive analysis, content strategy, user journey, wireframing, and prototyping.
Survey & Interviews
UI prototype & Documentation for developers
Current State & Competitors
User testing and changes
Creation & Development
Low, mid and high fidelity wireframes
For each persona
Content Audit & Content Strategy
A great majority of the foundation’s funding came from one organization, the rest comes from existing members of the organization. With many other charitable causes, it was important that the foundation improved its presence online to obtain more donations.
Overall, the website was outdated with very little content or engagement to achieve its objective. Thus, we presented a project of a website that would have a user-friendly interface and a better content structure.
This analysis’ purpose was to help with the optimization and redesign of the website’s interface, especially in terms of the user experience, which inevitably improves the image of the organization by making its message and navigation clearer.
Below are two of the pages of the current state analysis made by me for the foundation.
We did two competitive analysis of similar institutions or organizations websites to compare them to the client: one for the overall website, another for the content. Both analysis served to help us and the foundation to identify the opportunities.
We have selected some criteria for this analysis and compared them, which helped us to create a new digital strategy for the foundation.
We surveyed users and engineers who were unfamiliar with the foundation. We also interviewed some of these participants to get more details about them. Of the many surveys sent out, 15 responses were received to contribute to the final project.
Based on the user research, we created several personas and the journeys we should consider. The following is the persona I personally created, as an example, and all the personas my group created for the project.
From the user research and the personas, we created a journey for each persona. For Carlos Diaz, as shown earlier, I created the following.
In the group, I was the responsible for proposing a new interface and content for the About Us page. Through an About page with more content and interactive elements to engage users, they would know all the context and history of the foundation and trust it even more.
Seeing it today, I’d change some things but this was my first project while studying UX/UI, and the organization was thrilled with the page overall and with this solution for the history portion of it.
The new About Us page for the Ontario Engineers Foundation I designed proposed a one-page concept including all the necessary information about the foundation.
We have created the content strategy by conducting surveys among current users as well as engineers who are unfamiliar with the foundation. We considered both the User Experience (UX) practice and following the Accessibility for Ontarians with Disabilities Act (AODA) guidelines.
Professional but not stuffy
Informative but not wordy
Inspiring but not cheesy
Suggestive but not pushy
Candid but not harsh
Minimal but not vague
Formal but approachable
Clean but not sterile
We made a content structure guideline for each page we worked on.
We also included recommendations according to SEO, one of my specialization from my background in digital content, for a future blog, and other pages of the website that our project didn’t involve.
After studying the competitors, the users, and the objetives of the foundation, I suggested a new information structure and site map, as seen below. The About page would include the one-page suggestion I designed.
After completing the project, we delivered to the client all the analysis and a complete strategy for the content and design, including a style guide. Besides that, I made some extra recommendations based on WordPress, since the client asked for that since they used that platform in their website.
We also made a formal presentation to the foundation board and members presenting the suggestions, the wireframes and prototypes.
The project was made during the Interactive Media Management program at Centennial College and because of that, we received excellent feedback from the professors and the client. Our group even received a Dean’s Entrepreneurship and Innovation Award from the college. Our recognition and work for the foundation are also part of an article posted on Centennial’s website.
Dean's Entrepreneurship and Innovation Award
Issued by Centennial College · 2021
My group of UX/UI project to a real client received this award that honored our independent thinking, and our initiative in identifying and creating opportunities that established value for the client.
