Knowsnack
Reimagining Learning
Knowsnack is an education non-profit reimagining joyful learning in public schools across Kerala. Knowsnack’s debut initiative, Summaries - fun and engaging digital flashcards for K-12 Science-, is a curriculum-based supplemental resource for teachers. Distributed for free via WhatsApp, Knowsnack’s content offers an immersive mobile experience. With a presence in over 40+ schools in Kerala, we've impacted over 5000+ students.
Connecting with the client
Knowsnack's main concern was addressing education inequality and bring joyful learning across multiple school districts throughout India. To be able to keep operations running smoothly as well as spread awareness to the public Knowsnack needed a comprehensive website with payment gateway integration for accepting donations and a WhatsApp-based chatbot for efficient content delivery. The final product is a user-friendly platform that enables seamless donation processing and effective content dissemination through the chatbot, helping to bridge the education gap.
In our initial discussions with Knowsnack's team we gained a clear understanding of the organization's background, mission, and project goals. The client emphasized the importance of addressing educational disparities in Kerala, India by providing accessible, curriculum-aligned learning resources to underserved students.
Empathy map, and competitive analysis was conducted to highlight user needs. I was able to take notes on what worked well for similar websites, especially the landing page.
Problem statement
How can Knowsnack raise awareness, and streamline operations with a donation gateway and a WhatsApp-based chatbot for content delivery?
Part 2
Problem definition & ideation
Our role was to design and develop a solution centered on the following priorities:
Background
Goal for the project
Our role was to design and develop a solution centered on the following priorities:
- WhatsApp Chatbot for Content Distribution: To expand their reach from thousands to millions of students, Knowsnack sought to implement a WhatsApp-based chatbot. This chatbot would serve as the primary content delivery tool, offering accessible and engaging educational materials directly to students’ mobile devices.
- Payment Gateway for Securing Donations: Sustainability was crucial, so the client requested a donation platform with seamless payment integration. This feature was vital for enabling continued content development and future initiatives like “Wonder,” aimed at fostering creativity in learning.
- Sleek UI with Tech Brand Appeal: The final solution needed a polished, user-friendly database and landing page that reflected Knowsnack’s brand and mission. Our focus was on creating an intuitive experience that would resonate with both donors and end-users.
- Key takeaways from our discussions included:
Understanding the diverse needs of students, teachers, and parents across different socio-economic backgrounds.Aligning on a user-first approach that integrates feedback from ongoing user research, usability testing, and surveys.Collaborating closely to design a product that is scalable, mobile-first, and impactful in delivering quality education.
User Task Flow
Defining Flow
We created a user task flow because there were processes depending on what the user wanted to do. We wanted to capture this visually.
Feature requirements
From defining goals and creating the user flows, we narrowed down the features to:
- User-first approach: Simplifying access through familiar platforms (e.g., WhatsApp).
- Bite-sized content: Highlighting content designed for quick revisions that fit into daily routines.
- Fun and engaging: Incorporating visuals and interactive elements to drive curiosity.
Site Map
Here is the final site map, where we sought to prioritize what the user wants to see through each flow:
Part 3
Wireframing, visual design & prototyping
This section demonstrates the designed solution, from low-fidelity wireframes to a high-fidelity prototype. Figma was used as the design tool.
Low-fidelity wireframes
We designed low-fidelity designs with the goal of prioritizing the landing page, and organizing information to be visually immersive for the user.
- WhatsApp API Integration for content distribution.
- Payment Gateway Integration to support fundraising.
- Responsive Web Design to ensure accessibility across devices.
Hi-fidelity Designs
After feedback from the client, I was able to flesh out designs. Collaborating with my team, I added ideas to the landing page such as a carousel, and call to action buttons to help contribute to the organization.
Priorities were to make getting in contact with Knowsnack easy for users, and highlight what the organization provides.
Mockups for desktop were designed first (in order to prioritize donors, that are more willing to make a payment on their computer device). From there, mobile mockups were created because the services of Knowsnack were primarily on phone.
The final designs
Database Design
Reflections
- Building off peer ideas - A lot of the design work that was finalized was collaboration work, where components were built off of one another to match the user and client needs the best. In ideation and feedback sessions, this was the most successful in helping make design decisions.
- Designing for a different culture in mind - Because this organization was based in India, the primary form of communication was through Whatsapp. That is why the project focused on a Whatsapp feature. Designing with a non US citizen in mind, required a lot of background research and was a fun learning experience.
- Designing for mobile users - This was my first professional work that involved both computer and mobile devices. As a result, I learned about design processes and transitioning designs from bigger devices into smaller devices.
