LITERATOR

INTERACTIVE DASHBOARD

 

TL;DR

Literator is a tool for teachers to track student's progress in class and plan better educational strategies.

We created a flow with the aim to make the process of teaching pre-k more efficient. The goal was to make complex information accessible and to create a responsive dashboard that engages the user.

 

 

Problem

Literator team conducted the research and handed over the results to our team.

Results indicated that users are dealing with complex data and they need to:

  • Easily create profiles and update them.

  • Easily interact with assessment tools in the app.

  • View student information and easily compare them. 

  • The ability to take notes and follow up with parents.

My role

I was on a team of 4 designers and I participated in all phases of the project with a special emphasis on:

  • Create an easy navigation flow.

  • Improve users interactions and data input methods.

  • Create an interactive dashboard to compare and view data.

DESIGN PROCESS

PROBLEM DEFINITION 

 

Lack of flexibility in creating profile

Teachers can only create classes of students, and there is no option for customizations for smaller groups.

Difficult interactions with Assessment tools

In the existing app, a binary assessment is used for updating student's levels, and this method lacks accuracy.

IDEATION

Scenario 

To understand our targeted user, I created a scenario with a provisional persona called Melanie. Our persona is a pre-k teacher who is having a hard time tracking students.

LO-FI Sketching

We conducted a design studio to brain storm ideas for Literator's new flow

During a design studio, we brain stormed ideas and came up with solutions to achieve:

  • More flexibility in creating profiles (Creating new groups and easily edit them)

  • Responsive dashboard (That can be updated)

  • Easier data update (Through one tap on the progress indicator) 

 

 

 

LO-FI Wire frames

 

Based on the design studio feedback, we moved our ideas to Sketch app to create a clickable prototype. We divided the flow into 3 main levels that can be edited and compared.

Classe level ,Group level, Student level.

 

Overview of the flow through the app

see detailed screens below

  

Validation

We conducted validation testing with the Invision clickable prototype. 

 

Findings:

  • Navigation: The new flow had different levels of information, so it was hard for users to navigate.

  • Clickability: The interactions were confusing as the taps did not seem clickable.

  • Discovery of progress tracker: Users had to scroll to view the rest of the dashboards.

​​

 

 

HI-FI Prototype

We iterated on our design and created another prototype to solve the issues from Lo-Fi. Here is the main feature of each flow (Class-Group-Student).

 

Class flow

 

The class level provides a high-level view of the students' information:

 

  • The user can create groups of student profiles.

  • The user can view and move student profiles between groups.

  • Providing the user with recommendations, and auto-generate groups.


 

 

 

VALIDATION

Our team conducted another round of validation testing.

Results were positive, except some issues. Most of the major pain points have been resolved.

 

 

 

 

ClICKABLE PROTOTYPE

Click anywhere to interact

© 2018 by Aya Khalifa

  • email-icon-vector-niEKXzMiA
  • linkedin_circle_black-512
  • 540524_03ad1450dea24e52b57fc352c09d3c65-mv2_d_1600_1200_s_2
  • Twitter - Black Circle
  • 49403