Visual Screen Models is designed for creators who need high-quality, realistic displays for presenting their work. Mockups of devices like MacBooks, smartphones, tablets, and other digital products were crafted with maximum flexibility and realism in mind. Each mockup allows users to effortlessly upload their own designs or app visuals, enabling them to showcase their work in a professional context. This project aims to provide artists and businesses with a tool that helps them present digital products effectively and attractively.
MAD uses an internal platform called Campus Cloud to help volunteers in marking student attendance and maintain individual student records, helping track progress over time.A credit-based system is also followed to track volunteer engagement and contribution. More details will be further covered.
Substitution Call
If a volunteer is unable to take their class on the assigned day, they usually post a message in the NGO’s main WhatsApp group. The message includes class details and the reason for their unavailability. Other volunteers can then step in and take the class on their behalf.
Credit System Overview
Every volunteer starts with 3 credits.
Miss a class without a substitute: lose 1 credit.
Arrange a substitute: lose only 0.5 credit.
Take a class for someone else: earn 1 credit.
Maintaining a positive credit score is essential to receive a volunteer certificate.
Issue with spamming of messages
Volunteers currently copy and edit previous messages in the WhatsApp group when requesting or accepting substitutions, leading to clutter and spam. This repetitive process often buries important information, requiring admins to pin messages for visibility.
Take this screenshots for example
3rd March 2025
Message from a volunteer at the start of the week
16th March 2025
Message at the end of the week
It took 32 message iterations to reach the final update—making the process tedious and the chat cluttered.
Integrated a dedicated substitution feature into the existing Campus Cloud app to eliminate dependency on external platforms like WhatsApp. The redesign focused on simplifying a previously cluttered interface, enabling volunteers to easily mark attendance, apply for leave, and manage class credits—all from a streamlined, intuitive home screen. This enhancement not only improved user experience but also boosted operational efficiency for coordinators and volunteers alike.
Make A Difference (MAD) is a pan-India NGO. Each city it operates in is referred to as a Chapter (e.g., Pune Chapter).
Within each chapter, the specific teaching locations are called Shelters. These shelters are managed by local institutions, and MAD provides volunteers to teach underprivileged children there.
Volunteers are assigned fixed teaching days—Friday, Saturday, or Sunday—which they can choose after clearing the interview. Those who teach students from grades 6 to 10 are designated as Academic Support Volunteers (ASVs).
Each shelter-day combination (e.g., SASA Friday, STM Saturday) is led by a Fellow—a senior volunteer who guides both the students and the volunteers. With 4 shelters and 3 days, there are 12 Fellows in the chapter.
The overall lead of each chapter is the Chapter Organizer (CO), responsible for managing operations and communication across all shelters and volunteers.
I joined Make A Difference – Pune Chapter in August 2024 as an Academic Support Volunteer after a successful interview, inspired by a close friend who was a Fellow that year. I was placed at Saraswati Anath Shikshan Sanstha (SASA) in Dapodi, where I taught Mathematics to three students every Friday. Beyond academics, I focused on mentoring and emotionally supporting the children, helping build their confidence and guiding them toward a brighter future.
My tenure as an Academic Support Volunteer recently concluded
Streamline Substitution Process
Enable volunteers to raise a substitution request with just a single click—no group spamming or message confusion.
Improve Clarity & Tracking
Simplify how attendance and class records are marked and tracked, reducing manual effort and errors
Move Beyond WhatsApp
Transition the substitution system from cluttered WhatsApp messages to a centralized, easy-to-use app.
Hands-on UI/UX Learning
Use this real-world problem as an opportunity to apply and deepen my understanding of UI/UX design principles.
The following insights are taken from Google forms circulated on WhatsApp group on the initial Web App
Sample Size: 22
User Personas
Suggestions given by volunteers
Vaishnavi Bhalerao
STM Sunday
1)Exact location of shelter
2Time should be mentioned properly such as:-
Zero hour time
Class starting time
Class ending time
3) Students name
Pranav Sarmukaddam
SASA Friday
It should show all previous data like how many substitutions we took/requested etc. along with proper date.
Vaidehi Kumbhare
SSMJ Saturday
A good notification system so that substitutions may be notified on time
Amisha Vaishnav
STM Sunday
If there could be a little easier way to track substitution, it would be easier to manage and prioritize them
Pie-Charts
Volunteers insights on certain questions
Q. Does posting substitution calls on WhatsApp feel too spammy?
81% feels that posting substitution calls on WhatsApp feels spammy to them
Q. Do you find it tedious to copy-paste the substitution call message every time?
66.7% find it tedious to copy-paste the substitution call message.
Q. Would you prefer an alternative way to request substitutions?
90.5% would like if their is any alternative way to request substitution.
Q. Are you able to differentiate between important messages and substitution call messages in the WhatsApp group? Or does it feel cluttered?
71.4% find the main group cluttered with all kinds of messages
Q. When you request a substitution call, which device would you prefer the most?
100% use mobile devices while requesting substitution messages
How would you rate this new interface?
Overall rating of the purposed interface
(which is around 4)
Avoid multiple clicks for selecting shelter and day make it on one page
Notification feature for reminder of classes and if someone has putted the substitution call
Develop a dashboard which must include data of how many classes and substitution taken with proper date
For a volunteer which we have taking substitution we can make a card which includes:
Class assigned Zero hour time
Class starting and ending time
Students name under them
Reason
Tracking feature: Their must be segregation between those who had putted substitution call and those who have taken it could track it easily,
And who wants to take substitution could also track substitution easily
When a volunteer has taken the substitution remove the card of the volunteer who had putted the substitution
The following is the analysis where I look out for pain points in existing campus cloud app design
I usually do this on pen and paper, so here are some of the things I jot down during my process
Home Screen
Substitution Page
Notification
Dashboard
Hamburger Menu
More Screens
TYPOGRAPHY
COLOR PALETTE
Testing done on this prototype using Google forms
Sample Size: 10
Chandra
SASA Sunday
1. There should be a drop-down to choose a shelter instead of a list of buttons as the list of shelters can be long, that will also allow the user to choose only one shelter at a time and wont occupy much space.
2. If possible display contact number or have an option to have a chat (like a button that redirects to their whatsapp chat) with the volunteer whose substitute is being taken as we often need to talk to them to understand what needs to be taught in the class.
Snehal Jagtap
SSMJ Saturday
It's a well thought design and working is amazing. Just a one suggestion there are so many containers so, it just became so congested, if you can consider that once. I didn't find any flaw in it but beautiful design and All the best.
Prathivee
STM Saturday
Amazing efforts!!! It looks very effective and simple to understand.
However, some pointers I wanted to relay-
1. There must be an alarm of some sort or a reminder if the credits are below the threshold and provide to option to browse the substitution calls to make up for it.
2. As for kids attendance, I think a similar mechanism as 2nd pointer should be there to keep visual track of recording the attendance and ensure there is consistent data entry from the volunteer's end. (Just in case the volunteer did not enter the attendance, some kind of a monster threatening them to fill it or something) (monster is totally optional obviously)
3. I hope the attendance of the kids who would be entered by a substitute also reflects on the actual volunteers portal.
4. And I suggest putting the timings of the slots along with the date as displayed on Home screen. The volunteers might forget the timings as other shelters that they might substitute in.
But awesome work!!! Love the design!!!
How would you rate this new interface?
Overall rating of the purposed interface
(which is around 4.5)
Gamification for Engagement
As Prathivee suggested, a visual and interactive system for tracking kids' attendance can ensure consistent data entry — maybe even with a playful reminder like a monster (optional). Adding badges, streaks, and point-based rewards can further motivate volunteers and recognize their efforts (ex. Duolingo)
Volunteer Contact Integration
To ensure smooth coordination during substitution, it's helpful to communicate with the original volunteer about class details. As suggested by Chandra, adding the volunteer’s contact number or a quick chat option (such as a WhatsApp redirect button) can make this process easier and more effective.
Fellow-Specific Access & Dashboard
Fellows currently manage volunteer tracking manually using Excel sheets, which is inefficient and difficult to scale. Implementing a role-based login with a dedicated dashboard would allow fellows to monitor volunteer activities more effectively. Features like real-time data access, activity summaries, and downloadable reports can streamline oversight and reduce manual workload.
Integrated Calendar Sync
Allow volunteers to sync their classes with personal calendars (Google Calendar, Apple Calendar) for better time management
Incident Reporting System
Add a discrete feature for volunteers to report on-ground issues like safety concerns or logistical challenges directly through the app.
