Collab, enhancing communication between teachers and students

Context

Period

March to June 2020

Client

Our school (L'École de design Nantes Atlantique) as a client.

Software

Adobe XD, Miro, Notion, Zoom, Loom

Team

Jeanne Verstreate (also product design student)

Role

Product design

Brief

This project was in partnership with our own school, L'École de design Nantes Atlantique. The goal of the school through this partnership was to make us design new ways to take advantage of digital into our learning process. Here is a part of the brief that we focused on:

"L'École de design's intranet has been completely redesigned in 2018. This space can be a base for new reflections regarding the classes construction."

We started the project by doing a lot of research.

Process

Phase 1, Exploring/defining

To understand the context and its users but also to see in which direction we can go as digital designers, we did a lot of monitoring and several user interviews.

What stood out:

digital content allows more efficiency in the learning process but requires more self-discipline.

digital can help to participate more. for example thanks to quiz or video projects.
It is easy for a student to get loose in a course and to lack of involvement during the classes.

That's how we came up with our problematic:

"How to get school's actors more involved into the students learning process thanks to digital?"‍

To us it was important to design our product not only for the students but also for the other actors of the school. We had the idea that the more parts of the school we would involved, the more impact our service would have.

Phase 2, Ideation/structure

To answer our problematic, we needed more background. We did 5 other interviews to have a better understanding of the everyday life of our users.From those interviews we defined personas that allowed us to make experience maps and finally user journeys.

We finally kept 3 happy journeys imagined for 3 user types:

Student

Teacher
Business Service employee (in charge of making the link between our school and the professional world)

Selecting the product's features (card sorting)

The problem we were facing:

We had a lot of features that seemed interesting but we did not know how to make them live in a single one and sharp product.

Every feature seems to play an important role, yet, it was hard to make the links between all of our features. We didn't wanted to make a category per feature, it was crucial to us that our features could be used with the less friction possible..‍

The solution:

‍‍The school calendar as the center of all our features‍

Why ?

Because it's a tool that our user target already used everyday.
Because we had the intuition that the school's calendar could be a good base for all our features.

Phase 3, Production/iteration

The process we did follow for the phase 3:

Doing user tests with low-fidelity prototypes allowed us to refine easily our product before starting more engaging prototype work.‍

Result

We designed a responsive agenda that make class management easier for the teacher, the student but also the business service of the school (the service in charge of making the link between our school and the professional world).‍

How our project answers to the teacher's needs

Thanks to our system, he can understand how much workload students have and set a realistic deadline for his courses project.

One problem that teachers told us about is that it is hard for them to set a deadline because they have no visibility on the work quantity that their pupils have. They loose time rescheduling their deadline because they realize their students have to much work on a specific period.

Thanks to the 2 weeks view and the red tags for the delivery, he can easily view deliveries his students have already to do and consciously define a deadline.‍

He can also create quiz, launch them and see their results through any of the courses events.

Simplifying the process of doing questionnaires was crucial to us. It allows a better support of the pupils. Thanks to our Quiz feature, It's easier for the teacher to notice the students who have difficulties and on which part of the course.

He can also upload ressources directly on the agenda

Thanks to that feature, when the teacher sees that some of his pupils have difficulties with certain notion, he can easily share some resources to help them review the notions. By this way everyone stay involved.

We defined 3 categories of resources : "Classes" for the resources that have been shared in class, "To review notions" for resources that explain notions already seen in class and "to go further".‍‍

How our project answers to the student's needs

All the elements related to the course are reunited in a single place.

Through any event of the course, the student have access to the ressources, the quizz added by the teacher, the brief of the courses project, etc. It is easier for him to be up to date.

The student can easily communicate with his teacher

The student can ask a question to the teacher thanks to the chat area. The exchange will be then viewable by all the class so the teacher doesn't have to repeat himself.‍

How our project answers to the business services employee's needs

The business services employee is responsible for creating partnership between the school and external companies, to do so he needs to show what the students are able to produce to convince companies to pay the school so its students work on their challenges. Thanks to the filter panel at the top, the business services employee can see the deliveries of a specific students group.

Then, with the right panel, he can see the details of the project that will be delivered and estimates if it's interesting for him to assist to the delivery. He can also ask the students to deliver a synthesis pdf page so he can then have an overview of each project.

Technical aspect

We tried to make our style guide as simple as possible for more consistency and an easier development.

We made our user interface following a grid of 4. Each margin and size are a multiple of 4 : 4px, 8px, 12px, 16px, 20px, etc.

A responsive service, from computer to Iphone 5.

And even more responsiveness:

The Caldav Protocol is a protocol that allows a calendar to be sync with multiple calendar applications. It is thanks to this protocol that you can see your agenda no matter your calendar app (google, apple, fantastical calendar, etc.)

On the screenshot below, you can see that thanks to the Caldav protocol, the users can enjoy our service even in their personal calendar app (here, Apple Calendar).

Ulysse Ducamp - Developped with Plasmic - Last update in March 2022