Ayoub J. - UX Designer - Professional Projects

About my role in this project and my global feeling

As the Principal UX Designer, I took charge of designing the Parent-Teacher Application, a nonprofit project aimed at streamlining communication between parents and teachers. This project was developed in my free time over 3 months in 2023, with continuous support for testing and feedback until today.

The application focuses on two user journeys:

Parents: Parents can view their children's homework, grades, attendance, and even sign documents electronically.
Teachers: Teachers can manage multiple students across different classes, input homework, grades, and attendance during class, ensuring all data is centralized and accessible.

This experience challenged me to adapt to a nonprofit context where the main constraints were limited time and resources. The application is now available on the App Store and Play Store, with testing ongoing for its full launch in September 2025. Hundreds of parents and at least 15 teachers are expected to benefit from this tool.

Problem Statement

Communication between parents and teachers often relies on outdated methods such as paper notebooks or scattered messaging platforms, leading to inefficiencies and missed information. The goal of this application was to centralize all key interactions into a single platform, reducing communication gaps and improving convenience for both parties.

Challenges and Context

This was a nonprofit project undertaken on our free time, which introduced unique constraints:

Time limitations: Team members balanced this project alongside their professional responsibilities, necessitating efficient workflows and rapid iterations.
Sustainability: Ensuring that the application was simple to maintain and would not require extensive ongoing support from a small team.

Despite these challenges, the project successfully progressed from conception to a functional application now ready for launch.

User Research and Needs Gathering

To design a tool that meets the needs of both parents and teachers, we conducted targeted research and gathered insights from key stakeholders.

Our User Research Approach

Research methods included:

✅ User Interviews: Conducted interviews with three parents and two teachers to understand their needs, frustrations, and expectations.
✅ Process Audit: Analyzed existing workflows in schools to identify inefficiencies and areas for improvement.

What We Learned

Key insights included:

✅ Parents’ Needs: Simplified access to homework, attendance, and grades in one place. Ability to sign documents digitally.
✅ Teachers’ Needs: A straightforward tool to input data for multiple students quickly, without duplicating effort.

User Personas

To better understand the different types of users, we created personas. These profiles allowed us to define the specific needs and goals of each user group and tailor the tool to their objectives.

Teacher

Parent

User Journey Mapping

Mamadou - Teacher

Phase: Logging in to manage classes

Emotions: 😊 Focused, 😌 Relieved
Pain points: Slow loading time, complex navigation on the dashboard.
Opportunities: ✅ Fast-loading dashboard with clear class summaries and tasks.

Phase: Adding homework for a specific class

Emotions: 😊 Productive, 😎 Confident
Pain points: Too many steps for adding assignments, difficulty attaching files.
Opportunities: ✅ Streamlined process with file attachment and intuitive due date picker.

Phase: Checking student attendance

Emotions: 😊 Organized, 😌 Relaxed
Pain points: Errors in marking attendance or crashes during updates.
Opportunities: ✅ Simple and error-free attendance marking with auto-save functionality.

Hamza - Parent

Phase: Viewing his child's homework

Emotions: 😊 Curious, 😌 Reassured
Pain points: Difficulty navigating to the homework section or identifying assignments.
Opportunities: ✅ Intuitive navigation and clear listing of upcoming and completed homework.

Phase: Signing a document for his child

Emotions: 😊 Efficient, 😎 Confident
Pain points: Complex or unreliable electronic signature process.
Opportunities: ✅ Seamless and secure signature flow, with confirmation upon submission.

Phase: Checking grades and attendance

Emotions: 😊 Informed, 😌 Satisfied
Pain points: Overwhelming or unclear data presentation.
Opportunities: ✅ Simplified and visually appealing grade and attendance summary.

Design Process

Teacher Path

This diagram illustrates the journey of the teacher using the features for his path.

Parent Path

This diagram illustrates the journey of the parent using the features for his path.

Solution & Features

The Parent-Teacher app bridges the gap between educators and families by providing a seamless, intuitive platform to manage and share essential student information in real time.

✅ Homework Management: Teachers can quickly assign homework to individual students or entire classes, while parents can view upcoming and completed assignments with ease.
✅ Attendance Tracking: Enables teachers to mark attendance for multiple classes in seconds, and allows parents to stay updated on their child’s presence or absences.
✅ Grade Viewing: Parents have access to a clear, organized view of their child’s academic progress, with detailed breakdowns of test scores and assignments.
✅ Digital Signature Integration: Simplifies the process of signing and submitting mandatory documents directly within the app, reducing administrative hassle for both parents and teachers.
✅ Multi-Class Management: Allows teachers to efficiently manage multiple classes and customize data entry for diverse student needs.
✅ Real-Time Notifications: Keeps parents informed of new homework, upcoming tests, and important announcements via instant alerts.

This solution enhances communication, reduces administrative overhead, and fosters collaboration between parents and teachers, making it a valuable tool for improving the overall education experience.

Prototypes & Mockups

Interactive Prototype

Explore the interactive prototype created with Figma, which simulates the full user journey for both teacher and parent.

Try the Figma prototype

UI Mockups

Below are the mockups of the key screens in the application, demonstrating how the user interface supports the workflows for both parent & teacher.

Prototypes & Mockups

UI Mockups

Below are the mockups of the key screens in the application, demonstrating how the user interface supports the workflows of offers' consultation.

Connection

Classroom - Teacher

Homework management - Teacher

Update attach - Teacher

Missing student - Teacher

Student list

Remarks - Teacher & Parents

Arabic Homework - Parent

Marks - Parents

Current homework - Parents

Test, Impact and Results

The Parent-Teacher Application successfully streamlined communication and created a centralized platform for interactions between parents and teachers. Testing and feedback have highlighted the following outcomes:

Test Methodology

Testing involved:

✅ Real-World Scenarios: Simulating daily tasks for both parents and teachers to ensure the application met their needs.
✅ Iterative Feedback: Regular feedback sessions with parents and teachers led to iterative improvements in the UI/UX.

User Feedback

Both parents and teachers praised the application’s user-friendly interface and practical features. Parents appreciated the convenience of having all relevant information about their children in one place, while teachers found the streamlined data entry process efficient.

Challenges

Some challenges encountered during testing included:

✅ Onboarding: Ensuring that less tech-savvy users could navigate the application easily.
✅ Compatibility: Adjusting the design for older devices used by some users.

Impact

✅ Improved communication between parents and teachers, reducing misunderstandings.
✅ Simplified management for teachers, saving time during class.
✅ Centralized platform reducing reliance on fragmented tools or paper-based methods.

Tools Used

✅ MakeMyPersona (Hubspot) for personas design.
✅ Photoshop for screen design and branding adherence.
✅ Figma for interactive prototyping and design.
✅ Trello for agile management.
✅ Microsoft tools for tests/reflection (Forms, Teams, Whiteboard).