Indigenous Canada Service Redesign Project
Role: UI/UX designer
Duration: 5 weeks (2022 March- April)
Tools: Xd, Figma, Miro, Trello, UXtweak,
Overview
UX design
-
User research
-
Redlining+Heuristic Evaluation
-
Persona
-
Usability test
-
Open&Closed card sorting
-
5-second test
-
Feature prioritization
UI design
-
Wireframing
-
prototyping
-
Moodboard
-
Story Tile + Story Guide
-
RWD Breakpoints Set Up
-
Iteration
Indigenous Canada Service was designed to Indigenous Services Canada (ISC) engages with allies to enhance First Nations, Inuit, and Métis access to the greatest resources. However, I observed that the current website does not deliver clear information. Users always struggle to find their destination due to the complicated navigation.
The Problem
Users become dissatisfied and waste a lot of time seeking for information due to the poorly organized navigation system and the lack of visual graphics. 😫⌚️
The solution
A solution is to redesign the website to make more accessible for users who need. 💡
Construct a logical and visually appealing method to assist ISC in developing a new website version and redesigning the navigation system using information architecture skills to improve user interaction with the organization.
-
Reorganized the primary and secondary navigation, utilizing the mega drop-down menu to make the navigation bar more user-friendly.
-
Instead of using a solely text website layout, we used graphics to draw users' interest.
-
Users can immediately find "Learn about" and explore social media through well-organized footer and header.
-
The navigation bar was carefully chosen to make it easy for people to find what they're looking for.
-
Emphasize our most recent news under the ISC explanation to present users with the most up-to-date information.
User Path - Understanding the problem
Proto Persona
Created the proto persona to understand better using the website experience. Her goals and pain points were made based on the experience of ISC.
User Scenario
Emily is a history teacher who is always striving to learn more about the world around her and positively impact her community and environment. She has recently become more aware of Indigenous issues in Canada and is appalled by the persecution they face. Emily wants to discover the true history of Indigenous communities in Canada and find out what she can do to support Indigenous causes.
Web Pages Visited:
Colour Accessaibility
Learning the colours that ISC website uses. Since the background is white colour the text and link colours are successfully approved.
User Testing
I completed 5 tasks. 5 people took part in an open-ended usability test. Observing and recording each participant's actions and experiences. In addition, participants shared their thoughts on the ISC website. Transform the test notes into an affinity diagram and a feature prioritization matrix using the test notes. Assist in articulating the most important usability issues. To comprehend the challenges of navigating and applying for Indigenous Service Canada.To examine what portions of the website/links would users need to click on to join for Indigenous Service Canada.
Objective:
To obtain the authentic information of Indigenous community in accessible/ inclusive approach for every users.
Tasks:
1. Task 1: Apply for Indian Status using the search bar
2. Task 2: Find out how many water advisories exist today
3. Task 3: Discover what is about the Jordan's principle
4. Task 4: Find out HOW to apply for First Nations housing
5. Task 5: Identify how Canada is working towards reconciliation
Affinity Diagram
Feature Prioritization
How might we improve the user experience of the ISC website?
So that our users may find the website they're looking for with simplicity due to an effective navigation system.
How might we improve the website's typography and layout?
So that our users' success is dependent on information that is easily comprehended and has a high level of readability and simplicity.
Navigating the challenges around the skeleton's development.
Heuristic Evaluation
To articulate the present challenge of accessibility and UI patterns, use redlining and annotation. Most notably, as much as feasible, identify the ISC website's usability flaw so that engagement productivity may be enhanced by rebuilding properly.
Card sorting
To find the most effective navigation classifying approach for primary, secondary, and tertiary navigation, I conducted open card sorting on Maze and close card sorting on UXtweak. To overcome the problem of too many topics on the primary, open card sorting is used to recategorize present primary navigation. The current primary categories became secondary after open card sorting, while the original secondary categories became tertiary. Closed card sorting ensures that the present secondary navigation is fully understandable. Following my research, I may decide to transfer some secondary categories into different major navigation. There are ten people in each card sorting approach. As a result of evaluating the test data, a sitemap was created.
Sitemap
Define the aesthetic of the project, as well as the prototyping
Moodboard
Lo-fi wireframe
Mid-fi wireframe
Iterating phase
Five second test
Take notes on the users' insights and challenges, then analyze them. Assess the homepage's functionality. To learn about the homepage and navigation of the ISC's redesigned website, as well as the visual focal points of users. When users search for a target destination on the internet, seek for their pain points.
First improvement
The font size of title on the left wireframe is slightly too small to read. As a tester mentioned during the usability test, some users are lazy to read if the words are too small to read. This will allow users to understand what this page is about.
Usability test notes
Opinions:
-
It can be hard
-
Indigenous info should be under the menu bar
-
Menu bar defines irrelevant info to Indigenous service
-
Search bar on the top not necessarily to be useful
-
Indigenous info should be under the navigation bar
-
Share the page shouldn’t be scroll down, should be the top
-
Indigenous info should easily accessible
Iteration
Home navigation page system
Desktop Nav header
Desktop Nav footer
Mobile Nav header
Desktop side menu bar
Mobile Nav footer
Mobile side menu bar
UI style tile
UI style guide
Final phase
Desktop and mobile home page
Final thoughts
Overall
In many ways, this government agency redesign project was onerous. When I first visited the ISC website, there were too many paragraphs and not enough visual representations. As a result, unless you looked closely at the website, it was difficult to get a sense of what it was about. However, even if you read carefully, some terminology were difficult to comprehend; as a result, I considered that graphic design and/or visual imagery could assist users in better understanding.
New Perspectives
During the usability testing, I learned a lot of new things from the participants that I wouldn't have known otherwise. For example, broken links or alignments should be fixed, word spacing should be adjusted, and typography should be consistent, among other things.
Next Step
Throughout the project, I made it a point to pay close attention to other people's points of view. All users, especially those who require access, should be able to access the government agency's website. I learned new Figma and Adobe Xd abilities, as well as putting what I learned in class into practise such as smart animation. These procedures piqued my interest in learning new talents in more depth.