ROLE:
Sole UX/UI Designer
TIMELINE:
4 Weeks
(June '21)
TOOLS:
Figma
Adobe Suite
Miro Board
MY COLLABORATORS:
Individual Project
CORE RESPONSIBILTIES:
User Experience, Wireframing, Interface Design, Research, Prototyping, Usability Testing, Heuristic Evaluation
Background
This piece was designed as part of my HCI Monsoon course IIT Bombay instructed by Prof. Anirudha Joshi.
Built on the learnings of the Pandemic, this project attempts to bring about collaboration between teachers, students and parents through a digital platform that facilitates learning via physical and virtual mediums.
Project Overview
The Covid-19 Pandemic has triggered the growth of online schooling practices within the educational fraternity. This medium of learning has been both a boon and a bane for its users. With the situation slowly improving, physical schooling can be expected to start soon. As the world surges towards a new way of life, the question being asked is -
What is the educational model
from now on?
Pre-Pandemic
In school learning
COVID -19
Pandemic
During Pandemic Online Learning
Post Pandemic?
Will the online classes continue with half the children remaining non-responsive or is there a choice that offers the best of both systems?
Which aspect of in-person school to switch back to?
Design Process
Contextual Enquiry
12 interviews with students and teachers from different parts of India were conducted online. First, we tried to understand the way the educational system works in India. Next, we asked the interviewees about their experiences regarding the drastic change that the educational fraternity underwent during the COVID lockdown.
• What device do you use to teach online classes?
• What do you like and dislike about the online schooling experience?
• What teaching methods have you adapted towards teaching?
• What has changed for you since online schools started?
• What are your thoughts on schooling Post Covid?
• Which device do you use to attend online classes?
• What do you like and dislike about the online schooling experience?
• How did your parents react to online school?
• How do you self-study and prepare for a test?
• What all has changed for you since online schools
started?
• What are your thoughts on schooling Post Covid?
Ecosystem Model
Mapping out the existing ecosystem of Indian schools helped us understand how the 4 pillars of education communicate, thereby allowing us to identify the potential areas for improvements and draw further connections. Further we mapped out which schooling interactions worked better online and offline.
Artifact Models
Artefacts capture traces of people’s work practice. Users were asked to send photos of documents / objects during the interview. These artefacts were analyzed to understand how work is conducted and organized.
Game apps used to teach online and worksheets for tests in school.
But can they be customized? or do we install a game app for each subject?
Report card of a student based on a pure examination marking system.
Is it the best way to evaluate and motivate students?
Calendar / Diary of a student for writing reminders and notes.
Are these efficient enough?
Grade and Chapter wise folders segregated online.
Affinity Mapping
We did an affinity mapping exercise to figure out pain points in learning before covid and during covid. From this mapping, we realized that there were certain insights from online learning that the offline mode of education lacked while certain features of offline education could be enhanced using an ed-tech platform.
Insights from online education which the offline education lacked -
Insights from offline education platforms that was missed during online and can be enhanced using edtech platforms -
Teachers
Students
“Adversity brings opportunity ”
What the pandemic taught us?
The onset of COVID’19 made the schooling system quickly adapt. The system then looked towards technology to help them from this unanticipated crisis giving rise to the Online mode of learning. Online schooling made us realize the advantages of using tech in the education field and disclosed the flaws of our education system. Teachers had to abandon old obsolete ways of teaching and find new ways to teach and engage students. A huge leap to change the system needed to be taken. Initially, there were problems but the educational fraternity gradually adapted to the new education system - “The new normal”. The educational system started seeing the full potential of how technology could aid them to teach better. The pros of online schooling are discussed below through depiction of scenarios:
Schooling before the pandemic:
Schooling during the pandemic:
Before Covid:
Shruti tells her mother at 11pm about the fancy dress competition tomorrow.
Before Covid:
Shruti isnt able to cope up with her peers. She comes home with incomplete notes and unclear understanding. Neither does she have any readily available resources to practices and catch up with the missed syllabus.
Before Covid:
Students are prepared for / made to focus more on scoring higher marks in test papers, than practical understanding of concepts.
Before Covid:
Shruti gets bored and fails to pay attention in class with the obsolete textbook based approach of learning.
After Covid:
Online schooling prompts Shruti’s teacher to prominently use technology to her advantage. Rashmi Ma’am starts to incorporate new methods of teaching through observation and self exploration at home.
After Covid:
Shruti’s mother, Smita is updated about events on Whatsapp / Mail. She is now more aware of Shruti's school activities and progress.
After Covid:
Shruti gets bored and fails to pay attention in class with the obsolete textbook based approach of learning.
After Covid:
Focus shifted from exams, new ways of evaluating students are explored. The lack of exam pressure allowed students focus on skill development rather than purely studying from textbooks.
Schooling after the Pandemic?
Do we have to go back to obsessively quantifying everything a student attempts, weaponizing grades as a means of compliance and reinforcing inequity at every grade level? Or can we keep considering alternative models, like proficiency-based grading programs, and stop making school about scoring better than the kid next to you?
Based on our research we created a solution which catered to
students, teachers and parents.
Design Concept
Schools have gradually started to resume in person. Two years of adapting to a completely new system has made us realize the pros and cons of traditional schooling. By amplifying some current retainable advantages of online schooling, we have designed a hybrid solution for schooling post the pandemic. Having understood the concerns of its 3 end users , the main features which form its USP are :
Management & Organization
Community Creation
Activities
The app grabs this as an opportunity to shift the teaching method from textbook based to observation and activity based approach by integrating and promoting tech into the system .
Why a mobile app?
On conducting the interviews we realized that most teachers ,students and parents had maximum access to ‘mobile phones’ over desktops when it came to online schooling. Moreover, according to a study done by Statcounter GlobalStats, out of the total populaton in India, 76.57 % people use their mobile phones for dowloading and using applications. Taking these factors into consideration, a mobile application seemed the best fit for our design solution
Key Features
Resource Library
An archive where students and teachers can add, preview and bookmark important notes or study material of every subject for self-study.
Draft Room
A feature where teachers can prepare worksheets from study material using different customizable formats to make them more interactive to the students.
Analytics
A feature where students and teachers can keep a track of Students overall assessments, attendance and overall performance.
Bulletin Board
A feature where students and teachers are updated daily about the various extra curricular accomplishments about the students apart from soley academics.
Ask the teacher
A portal where students wellbeing and doubts can be taken care off on an individual level through personal chats or calls after school hours.
Calendar & Timetable
An organizational feature where students and teachers can maintain timetables and set reminders to make their working more efficient.
PTA Portal
A feature where parents can keep a tap on their childs performance and can communiate with the teachers when required .
Game Room
An interactive feature where students can solve worksheets and challenge their friends post school hours, compete in house leaderboard.
Product Goals
Promote interactive, activity-based learning for students for better understanding.
Make educational content easy to make for teachers.
Provide students with a platform to showcase their talents.
Smooth organization of classroom functions online.
Track a students overall growth - academic and health.
Project undertaken by the education board to provide integrated solution for associated schools across the nation post COVID.
To help the related education institutions to educate with a balance in online & physical school.
Target User Goals
Students
-
Want learning to be fun and engaging. Understanding concepts well.
-
To socialize, interact & collaborate with friends and teachers.
-
To easily communicate accomplishments and other information.
Teachers
-
To make the students understand and learn via practicing.
-
To try different assessing methods to make the learning more gripping.
-
To track the progress of the classroom and individual students more efficiently.
-
To distribute data and communicate with students effectively.
Parents
-
To know their child’s academic and health status.
-
To be a part of their child’s overall growth and development.
-
Being updated with school events and competitions.
Personas
Student
Curious Shruti, 14
Teacher
Energetic Rashmi, 36
Parent
Busy Smita, 45
Information Architecture
Usability Testing
User Testing
We conducted user testing with 8 users to analyze the following usability goals :
-
Playing and creating a game deck.
-
Adding tasks and viewing timetable.
-
Accessing the resources, making notes, and asking doubts about different subjects.
-
Viewing a student's progress and achievements.
-
The search bar position needs to be constant through all tabs.
-
Combining Time Table and Self-assigned tasks is unclear and confusing for users.
-
Add Buttons can be converted to floating buttons for easy access.
-
The games tab is too cluttered. Video call feature not required.
-
Submit button position needs to be changed
User Testing
Key Findings
Hi-Fidelity UI Design Screens
Onboarding & Sign up
Organized flow for onboarding users with their registered phone number, OTP & other details.
Bottom Global Navigation Bar
The navigation bar contains the 5 main features of the application.
Home
Bulletin
Games
Analytics
Library
Student, Teacher & Parent
Student, Teacher & Parent
Student, Teacher & Parent
Student
Home Dashboard
The home dashboard consists of 3 main tabs : Calender, Time Table & To-Do List. These features help the users organize, manage & plan their tasks.
The Calender feature shows an overall schedule of upcoming tasks, submissions and events.
The Time Table feature shows daily lectures and submissions as scheduled by the teacher.
The To-Do List is a self management feature where the user can set their owns tasks and reminders.
A pop-up once everyday records the student’s overall health which would be sent to the school counsellor.
Student, Teacher & Parent
Student, Teacher & Parent
Bulletin Board
Extra curricular activities often aren’t given much weightage as academic accomplishments. However, they mould a student and add to their personal growth.
The School Bulletin serves as a medium for reaching all users about upcoming programs, seminars & competitions. Teachers announce winners of school events that would motivate more students to participate.
The Student Bulletin allows students to view their peers and school mates talents and out of school accomplishments. Students get a platform to showcase thier skills and achievements.
Games
The Challenge of the Week encourages activity-based learning through creativity, exploration, and observation skills. A new challenge would be updated every week by the teachers where students get to experiment with different modes of representation like documentaries, charts, posters, etc.
Student & Teacher
Student
Student
Student
Student Interface
Student & Teacher
The games section for students focuses on making learning fun and immersive through virtual worksheets in the form of graphics, audio, video, and interactive activities such as puzzles, connect the dots, quizzes, etc. The games can be played solo or with a friend. These virtual worksheets would help students in their self-study and would promote healthy competition.
Student & Teacher
The game score and leaderboard between the four houses in a school serve as an incentive to the kids to try harder to study and practice more. It motivates students to attempt worksheets and compete with peers.
Student & Teacher
Student & Teacher
Student & Teacher
Student & Teacher
Augmented Reality
Student & Teacher
Student & Teacher
Student & Teacher
Student & Teacher
Augmented reality feature helps students learn and recollect study data more effectively. The interactive and engaging nature of AR makes learning captivating. They can explore models and get a better understanding of concepts.
Teacher’s Game Interface
Teacher
Teacher
Teacher
The ‘My Project Decks’ tab allows teachers to edit their uploaded game decks, create new games or save games in drafts to be further edited.
The gaming interface for teachers allows them to choose from a variety of mediums to prepare the game. These tools help teachers save time and makes working more efficient.
Various customizations available make these virtual worksheets personalized. The tools can be added by the user or also be selected from a default OnSchool Library.
Teacher
Teacher
Teacher
Resource Library
The resource library helps student to access all study material , get doubts solved and make notes.
Student
Student
Student
Student
Resources are categorized into subject wise folders for easy access.
Students can view all resources uploaded by the teachers. Every subject consists of doubts portal and a Notebook feature.
‘My Notebook’ feature helps bookmark important resources and make important notes by adding text, image and videos.
The Doubts Portal feature is a platform where students can post their doubts, which will be solved by teachers and classmates.
The app is customized to cater to the needs of three types of users.
The user can upload their data and select their avatar according to their school house
Analytics
The Analytics home page provides an overview of Game performance of a student.
The Student Report can be viewed by the student, teacher and parent to know the students progress
The Achievements tab contains badges motivate students to attempt worlsheets and perform better.
Student & Parent
Student & Parent
Student & Parent
Final Design Figma Prototype
Takeaways & Reflection
This was my first project was my first step into the field of HCI. Completing this two week course exposed me to working on an end-to-end user centered design process.
-
Every user is different and your design will be interpreted differently by all of them.
-
Design is very subjective so seeking as many feedback ay early stage is beneficial to see the general reaction of users.
-
We cannot design for every user or achieve all the design goals - scope is important!
-
Breaking it down into achievable deadlines and keep iterating the designs as it grows is the best solution.