← Back to Projects

Zeraki Teachers

Company

Zeraki(EdTech)

Timeline

2023

Link to Prototype: https://www.figma.com/proto/4LBxoOV9BzzN5fiwCSv3bx/Zeraki-Assignment?type=design&node-id=8-15429&scaling=min-zoom&page-id=8%3A1425&starting-point-node-id=8%3A15429

Project Overview.

Problem Statement.

Challenge

  1. Every child needs a report card at the end of the school term. And the platforms for producing these report forms are offline computer-based platforms. So, teachers have to line up behind two or three computers at a school to do the data entry in order to produce the report forms.
  2. Lack of a proper channel to share students academic performance with their parents at home.

Solution

  1. By moving the old school grading system to a mobile-first experience, it means that as soon as teachers are done grading students’ grades whether at home or in school, the teachers just enter the scores on their phone via the app.
  2. The teachers can furthermore generate report cards to be printed or shared with the parents via email.
  3. Parents will be able to track their children’s academic performance as they get a notification/email once results are out.
  4. The app's purpose is to give a simple and attractive user interface while also demonstrating how we maximize the process.

Design Process

Empathize

User Survey

I conducted interviews and quick survey. Teachers(during and after examinations) and parents(at the end of the school term) were the main user groups discovered through study.

Insightful Comments

Define

User Persona

I developed a persona to assist in examining the demands of a broader user base and designing the app with a specific target audience in mind.

Empathy Map

For a better understanding, I created an empathy map to study the user's sentiments and help me figure out insights.

Storyboarding

I've chosen to use a storyboard to investigate the user experience of my app and visually describe the insights I learned from my research.

Big Picture Storyboard

Closeup Storyboard

User Journey Map

Then I constructed a user journey map to discover the customer's pain spots and emotions when recording grades. I also sought for answers to the issues the app would resolve.

Define

User Flow

I've designed a user flow of the primary task in which the user navigates from the beginning to the finish of the procedure.

Design

After being acquainted with the target user, it was time to build the app, I made a few paper wireframes that helped me structure what the app would look like.

High Fidelity UI Design

High Fidelity Prototype

Link to Prototype: https://www.figma.com/proto/4LBxoOV9BzzN5fiwCSv3bx/Zeraki-Assignment?type=design&node-id=8-15429&scaling=min-zoom&page-id=8%3A1425&starting-point-node-id=8%3A15429

Accessibility Considerations

The app has been tested for contrast and meets at least AA requirements. Every frame was examined with contrast checker tools such as the figma plugin "Stark Contrast Checker."

Takeaways

What I learned

During my project, I worked on a variety of design thinking processes, did user research, examined problems and defined solutions, generated low-fidelity wireframes, and finally built workable high-fidelity designs and prototypes. This was my fantastic path toward developing user-centric solutions using what I had learned. The design still had room for improvement and iteration; this is not the end. I've made a lot of mistakes and still have a lot to learn.