NIMC Web App
Year
2021Duration
7 WeeksRole
UX Research, UX Design/Analysis, UI Designs, Wireframing, Frontend Development, Usability Testing
About NIMC
NIMC (National Identity Management Commission) is the body responsible for the registration and management of Nigerian Identities, they oversee the registration of every Nigerian citizen as well as issuing of Identity cards to every registered citizen of the country. Since it's inseption it has register over 60M Nigerians and counting.
About Project
NIMC Web App is a project that aims at moving the current desktop application into a seamlessly fast, modern and reliable platform, thereby enhancing the usability and bringing in more operators into the application to ensure the ease of registration of users both in Nigeria and diaspora.
Project Goals
1. To register more Nigerians:
The first goal of the project is to build an easy-to-use app that can enhance the registration of more Nigerian citizens thereby moving away from the old and slow desktop app.
2. To create more job opportunities:
By introducing the NIMC web Application, there will be an increase in the accessibility of the app which will give rise to the number of operators thereby creating job opportunities.
3. Increase Accessability:
To make the app readily assessable both in urban and rural areas especially remote areas where there are no much stable network services.
4. Easily meet Nigerians NIN needs:
To create a product for people to easily Enroll, Renew/Replace, Modify, and control death reports through their identities.
Research Plan
What I did:
Before opening any design tool, We reached out to the current operators who are tasked with enrolling people on a day to day basis to find out some of their pain points, needs and frustrations using the current desktop app.
Some Questions I Asked
- 1. How many Nigerians are you able to register in a day
- 2. What process do they take in registering your users
- 3. How often do they register users who are in remote areas
- 4. How long does it to to register a user and get a print out
User Persona
What I did:
After summing up the User Interviews, We created a User Persona to help analize our customers in a more detailed view. with this, we could understand the main focus' behaviors, act and needs.
Current design
Asides from the app looking old, it also lacked some usability features, as a team we where able to spot those out through user research and usability testing which was conducted in the earlier process of the design phase, we noticed some the following:
1. There was misuse of space for the wizards, hence lesser space for activities.
2. Inability to tell between a button and an input field.
3. Instructions not well placed and could be easily ignored.
4. text on dark background and not readable
The approach for a new design
The result of our first design approach translates into a minimalistic views that solves the usability issues of the past design. We’ve solved these by:
1. Identify the faults in the current application:
For us to design a usable product we had to know what the current app looks like and how it performs, that way we can know what to inprove on and how to inprove them..
2. Ensure it is responsive for all devices:
Since we are converting to the web, we know most of our users will be using smaller devices like phones and tablets so we designed with reponsiveness in mind
3. Ensure it works in remote areas:
We had to consider a wide range of users in the remote areas where there are no good network connections by building in PWA features so that the users can opprate the app offline.
HTML code snippet
As an advocate for bootstrap 5, I was able to write some HTML, CSS and Bootstrap artifacts for the entire pages with linked "hrefs" for final testing with the users to see if it matches their needs and work on any concerns they may have using the product.
The final design, Making Enrollment Easier and Faster
We brought to life a new Enrollment dashboard that delights the user by its functionality ease and minimalistic look. We remove friction from the Enrollment feature to allow users to perform their activities faster. Below is a nimc flow of how NIMC official can easily enroll a user: