“Zoom App”: Recreating interactive experience for the teacher to monitor and control students— a UX case Study
Hey! This project was done as a part of my submission for a 48-hour-long sprint with my four fellow teammates. Surprisingly our team managed to bag the second position ;)
The problem statement on which we worked was to recreate an interactive student-teacher classroom experience for the Zoom app and help teachers monitor and control the classroom teaching.
So Zoom being a familiar app, we did have some pre- assumptions about the gaps existing. But all and all we made a point to make sure that we aren’t the sole users.
We began with a night full of intense desk research and mugs of dark coffee. We initially had dropped the idea of the user interviews because we just had 48 hours to come up with our final product. But sooner, we realized that qualitative insights have to be our prime requirement.
Problems
Breakout Rooms: Teachers find it very difficult to be repetitive especially when they have smaller groups. Teachers have to drop into every group to pose the same questions or instructions again and again. Primarily the feature of breakout rooms is hidden. Also, moving from one group to another requires a few taps. All and all it is a very time taking tedious process.
Attendance: Generally the class starts with the majority of the students and ends with almost half of the students present. Tracking present students is difficult as they keep joining and leaving. Teachers find it difficult to report a student’s daily attendance.
Dashboard/Portal (newly introduced): Teachers keep toggling between Zoom, Whatsapp, youtube, drive, notes, etc. There is no such single stop where they can store their daily lessons, pdfs, notes, timetable, etc
Goals
Breakout Rooms: A hassle-free interaction with breakout rooms so that teacher can broadcast at once and every room can hear it. The teacher must be flexible to either speak individually in every group or can at once commonly broadcast (for all the groups).
Also, we aim to give this feature more visibility and flexibility for the user to access.
Attendance: For a teacher to track the students in between the classes, a random check is important. But this should not just include the teacher to open the participant's list but also involve the students' attentiveness in class.
The attendance taken in the meeting should also be saved in the portal.
Dashboard: This is a newly introduced feature which aims to store all the necessary data. It should primarily aim for easy and quick accessibility.
What and Whys of our plan of action
- Desk Research: Existing data had everything to contribute in terms of understanding the user and the product.
- User Interviews: Winning insights and the most qualitative process.
- User Journey: To understand the user’s interaction with the product at every single step
- Empathy Mapping: Put ourselves in our users' shoes to find their pain points. To know what they feel, think, say, and do with the product.
- How Might We’s Turned challenges into design opportunities.
- Ideation: Brainstormed our ideas to get some achievable design solutions.
- Wireframes: Converting our ideas into making features and functions.
- UI Design: Giving wings to our research and making hi-fi wireframes.
Desk Research
It was the most prioritized method for us because the existing data has a lot to contribute in terms of us understanding the users and their behaviors in general.
It took a whole night for five of us to stick on our screens and come up with our findings. We thoroughly went across to fetch insights into teacher and student behavior. One of us spent some big hours to understand competitive platforms. So some of the highlights of our insights were as followed:-
For more detailed research on how we got to know the students and competitors. Kindly visit here.
User Interviews
I doubt if we could rock our final presentation without the User Interviews. I am so. overwhelmed that the interviews I did gave us beautiful, honest, and genuine Voice Of Customers to quote. I learned how being impulsive can make your project grab WOW’s.
“my whole phone is filled with screenshots of zoom’s participants panel — Best way to show attendence to the cordinator
“areey , bahut se bache hein jo sirf shakal dikhane aate hein, kya pta kitna padhte hae woh log”
“Breakout room- bahut hee alag feature hae , uske set karne mai hee 10–15 minute lag jate hein”
“Dekho beta sidhi si baat hae , meri class mai 70 bache hae aur mai 3 sections ko padhata hu , Aap soch sakte ho mai har group mai ja ja kar same hee brief dunja toh meri kya halat ho gyi “
“Meri halat chordo , Time kitna waste hoga? “Jo maza bachon ko dekh kar padhane mai hae woh idhar kaha” “Par abhi koi baat nahi , bahut ache features bhi hae , kaam. toh chal hee jata hae “”Bache bahut pagal banate hae . Pehle toh class mai aa jayenge aur phir class ke khatam hone time sirf adhe hee bache hote hein “
“Mannn toh karta hae inko btayu , ki abhi school mai hote na toh btati “
“Kabhi koi kuch kar rha hae kabhi kuch , Itne unattentetive hae na kai bache “
User Journey
We chose to do User Journey to understand the touchpoints of our users with the app. To be in the users' shoes and understanding each and every step helped us understand our user’s insights and their gaps and motivations wrt the app
Empathy mapping
We did Empathy mapping to know the user and their perspective. We synthesized our desk research and all the learnings from the interviews into EM. This exercise helped us in removing our own perspective and get into the shoes of the user and know their pain points. How they feel, think, say, and do with the product.
How Might We’s
We practiced the How Might We’s to turn challenges into design opportunities and make maximum possible HMW questions. Framing HMW’s helped us solving 30% of the problem in this process itself
Wireframes and UI Design
It took us approximately 10–12 hours to come with the UI and wireframes.
We were working on wireframes and UI simultaneously. As and when every wireframe got completed, we used to sit together to put our rationales as to why a particular wireframe should be approved and then worked for UI design.
All we wanted to make sure is connect our research (the Voice of Customers) to what we were doing in our wireframes and UI
Teach
So, we came with a new concept of Teach in the dashboard particularly because we didn't want to confuse the rest of the users’ flow of interacting with the app by adding the new features in the current flow.
“Mujhe nahi pta ki mai whatsapp kholu ya books kholu ya notes pakdu ys bacho ko padhayu. School mei lecture stand pe sab assani se rakh dete the . kabhi koi problem nahi hui ”
“Timetable ko yaad karne ke liye kitni baar whatsapp kholna padta hae ”
“How do we take note of the attendence . 40 mai se 10–15 minute yeh sab karte hee nikal jaate hae ”
- We came up introducing some much-required features like viewing the TimeTable, attendance reports, results, assignments; store and access notes, pdf’s, bookmarks, data, etc.
- We made some changes in the Channel section and made it more prominent and accessible. Channels will help to know the repository of the particular group the teacher is teaching to.
- We segregated the class, sections, and subject-wise content for easy and quick access.
Breakout Rooms
To link what our users and research said, we moved ahead to work on this particular feature of easy accessing of breakout rooms for teachers.
“Breakout room- bahut hee alag feature hae , uske set karne mai hee 10–15 minute lag jate hein”
“Dekho beta sidhi si baat hae , meri class mai 70 bache hae aur mai 3 sections ko padhata hu , Aap soch sakte ho mai har group mai ja ja kar same hee brief dunja toh meri kya halat ho gyi “
“Meri halat chordo , Time kitna waste hoga? “Jo maza bachon ko dekh kar padhane mai hae woh idhar kaha” “Par abhi koi baat nahi , bahut ache features bhi hae , kaam. toh chal hee jata hae “
- So addressing the major problem of going into every group and repeating the same instruction was a very difficult job. To get over this, we came up with the idea of Broadcast Voice.
Here in Broadcast Voice, the Teacher has the flexibility to unmute her mic and speak in all the groups. - Breakout rooms being an important feature was hidden in advanced features and required some more taps to start with. We bought this feature in the participants' section itself. This will help easy and quick access.
- Ok, so now with our research we also saw that viewing all groups together and spotlighting was a messy job. So to address that teachers can now View All Rooms altogether. We also made spotlighting a particular group while presenting easier. In this rest of the groups are muted and the spotlighted group along with the teacher has the advantage to mute-unmute any time. Also for the other groups to unmute, they have the flexibility of unmuting when the spotlight is removed.
- The drop-down menu will help teachers move easily between the groups or view all groups altogether.
Attendance
“my whole phone is filled with screenshots of zoom’s participants panel — Best way to show attendence to the cordinator
“areey , bahut se bache hein jo sirf shakal dikhane aate hein, kya pta kitna padhte hae woh log”
”Bache bahut pagal banate hae . Pehle toh class mai aa jayenge aur phir class ke khatam hone time sirf adhe hee bache hote hein “
- With this feature of attendance, teachers can any time push the attendance and students need to mark it in the given time itself. This can be done multiple times. (I cant say that whether the whole time issue of tracking the attention would be solved or not, but chances of students being attentive and having their gazes fixed on the screen will indeed increase xD )
- This feature is easily accessible in the participants' section so that teachers can quickly roll out the form anytime.
- The attendance report can be accessed anytime from the dashboard. This also addresses the problem of taking screenshots or handy notes of students present in the class.
Quiz
Scope : There were a lot of things we wanted to do but beacause it was a 48 hour long sprint, We couldn’t . Hopefully we will want to come up with better student-zoom interaction as well .
Hackathon Feedback
Result
THANK YOU !