Brisk: Improving the user experience of a school management application
Dojo hubRole(s): UI Design, UX Design 2019
Brisk is a school management application owned by Dojo hub Ltd. and aimed at digitally transforming the academic and non-academic operations of primary and secondary schools across Nigeria. My goal for this project was to improve the overall experience of the existing application. Making it easier for administrative staff and teachers to manage and process student data.
Understanding the application and its problem space
I started the project by reviewing all documents on the product – from the application’s usage data to bug reports, evaluation reports, and other documents that described everything about the product. After reviewing all documents, I scheduled interview sessions with the stakeholders, where we had discussions about the product – its problem space, goals, current user base, and users’ frustrations with the product.
Identifying usability issues and fixing them
Based on the information gathered from the literature review and interview sessions, I went ahead to perform a usability assessment of the product to know what usability problems existed and how they relate to the issues reported by users.
Working within the confines of a very limited budget, I relied on my knowledge of usability heuristics while using the cognitive walk-through method of evaluating the usability of a product. In collaboration with the SME on the project, I also took a close look at the application’s information architecture.
I used Jacob Nielsen’s 10 usability heuristics for user interface design and Abby Covert’s information architecture heuristics as a baseline for my evaluation. This led me to uncover several usability problems.
At the end of this process, I came up with solutions to the identified problems that were desirable, feasible, and viable. The following sections outline the identified problems and the solutions I came up with.
Issue 1: No clear path to setting up the product
The system has a hierarchical data structure, establishing interdependencies within its design. For the system to work properly, specific data sets need to be gathered according to the established hierarchy. However, the existing design presents first-time users with a blank content area and no guidance on what to do next or how to set up the application to function as expected. This resulted in errors and multiple support requests from clients.
To solve this problem, I introduced a Setup Wizard to the system. The goal of the setup wizard was to collect the primary data needed for the application to function correctly. It was designed as a multi-stage form with the ability for users to review or update data from previous stages. After a couple of iterations, I ended up with a design that satisfied heuristics numbers 5 (error prevention) and 8 (aesthetic and minimalistic design).
Issue 2: A “not-so-clear” navigation system
One of the frequent complaints of users logged by the team was the confusion experienced in navigating the product. After my evaluation of the existing design, I could see that the problem was first, the choice of component used for navigation and then the menu true and its nomenclature.
To make the navigation menu structure more user-friendly, I worked closely with the SME on the project to gain a better understanding of the terms used in the education profession, as well as the hierarchies, and dependencies of every dataset throughout the application. With the help of Abby Covert’s information architecture heuristics and the application of the principle of Separation of Concerns, I was able to come up with a solution that was clear, easy to understand, and matched the real-world expectations of the end users.
The next step was to redesign the UI to support the new navigation structure. To do this, I replaced the existing toolbar/menu system with a side navigation system as shown in the images below.
Issue 3: Over-clustered content area
The existing design took a modular (dockable windows) approach to present content in the content area. However, this approach results in the over-clustering of the content area making it difficult for users to manage data efficiently.
The solution was to implement a parent-child-grandchild relationship between the views of each navigation menu item and their corresponding actions.
In this structure, a parent view is the root view of a navigation menu item, a child view is directly connected to the parent view while a grand-child view is any other view that can be accessed from a child view. Though the grandchild view can be either directly related to a child view or related to an entirely different parent view, there is a sequential relationship between each view navigated, enabling a user to easily navigate back to the previous view.
Challenges
The general challenge I faced during this project was that I didn’t have access to real users to evaluate the existing product and test the proffered solutions to the identified issues. I had to wait for months to know if my designs actually solved the users’ problems and the improvements that could be made to the new designs.
Results and conclusion
After about 8 months of collecting usage data, the team recorded an 85% reduction in support requests related to setting up the product and a 7% increase in license purchases based on client referrals and recommendations.
In conclusion, despite the challenges faced throughout the project, it turned out to be a success with lots of lessons learned.
