Project: Edtech Messaging Design Challenge
Services: UX/UI Design
Deliverables: Wireframes, High Fidelity Mockups
Timeframe: 1 week
I worked on a design challenge where I designed a messaging system for an edtech company that would allow teachers to communicate with their students.
Some of the final mockups
A subject practice and test prep edtech company that provides practice exams and practice questions is considering expanding their platform. Here is the design prompt:
"We have discovered that teachers would like alternative methods of communicating with their students. In order to facilitate proper communication, we want to build a proprietary messaging system in which teachers can make announcements to the entire class, message a single student, or message a group of students."
Objective (Project Goal): Design a messaging feature for teachers to communicate with students.
Benefits: Benefits include:
Business opportunities: There are existing teacher communication platforms out there. Why pay for two (the subject practice platform + the messaging platform) when they could just have one? More schools and teachers would opt to save money by just having one platform. Plus, additional features like a message option make the product more appealing to implement in the school system or classroom.
Some of the competitors that I looked at during my competitive analysis
I researched the current company and its product to better understand it so I could effectively design a new feature for the platform. I also looked at other messaging platforms utilized by teachers to better understand common edtech messaging UX/UI design patterns, including:
Primary User: Middle School & High School Teachers
Secondary Users: Middle & High School Students
Goals: Help students learn the subject matter and receive good grades; help students to pass the AP test; clearly communicate important information
Challenges: Communication gaps, especially in remote learning; students miss important announcements/updates; communication platforms disconnected from Albert
Ideas for the messaging platform:
Storyboards to better understand the main tasks and the user’s journey.
Sketches to explore the features, layout, and wireframes
Wireframes of the messaging feature
Through the edtech platform, teachers can send messages and announcements to their students:
Teacher's Inbox: The teacher’s inbox will be divided into conversations (direct messages) and announcements to meet the different message settings and needs. The direct messages will appear similar to prominent social apps (like FB Messenger), where users can communicate back-and-forth, and will feel familiar to the users.
Send messages to students or classes: When a teacher wants to send a new message, they can add one student, a group of students, one class, or multiple classes in the “To” line. They don't have to painstakingly add each student to classes. They then proceed to type out a message and can make text edits, add emojis, add attachments, and expand the screen.
Attaching assignments: When they press the "Add attachment" icon, they will see a pop up with different attachment options. They can add an assignment, an assessment, or student insight (such as recent grades) to their message, making it easier to share homework and results. The attachment will appear directly after their message when they send it. Whoever is in the group message can respond directly to the conversation and can access the attachments.
Choosing recipients and scheduling messages: After typing out their message (and adding pictures or attachments), they can then send it out to the recipients. They can choose to immediately send it or schedule the send for later (such as sending out an assignment reminder after school hours or for the next day), allowing teachers to get work done ahead of time.
Announcements: Announcements, unlike DMs, have names which appear on the subject line. They can be scheduled regularly (such as weekly extra credit reminders) to make it easier to send recurring announcements. Students can’t respond directly to these, but the teacher can see who has viewed the announcement.
Announcements' information: Announcements and conversations have additional options. When the Info icon is pressed, these options come out on a side panel. The user can see who the message was sent to and can make adjustments or edits.
Since this was a design challenge completed in a short timeframe, some additional steps could be taken to improve the deliverables and validate the solution:
Other Design Projects
Albert Academy CoursesVisual Design
Dribbble UI WorkUI & Visual Design
Automotive Design ChallengeUX/UI Design Case Study
350NHUX/UI Design Case Study
Amazon Raise-Up BuildathonUX/UI Design Case Study
Project Giving KidsUX/UI Design Case Study
DeveloperWeek 2020 HackathonUX/UI Design Case Study
The Cumin ClubUX/UI Design Case Study
Constellation BrandsBranding & UI Design Case Study