Dashboard for in-class presentation

PresentFocus

The easy and simple dashboard design to motivate students to participate in giving feedback to their classmates, and giving the instructor a nice overview of what is happening within their class in one screen.

My roles
Designer
project focus
UI + UX, Dashboard Design
Project year
September - October, 2021

Project Brief

"Dashboards display information that is changing in real time."

"Dashboards can be interactive or non-interactive."

"Dashboards are designed to support real-time 'situation awareness.'"  

Overall Focus

This is a project designed with Kristine Kim and Michelle Zhu for the class 05392 Interaction Design Overview at Carnegie Mellon University. This interactive dashboard engages and meets the needs of multiple stakeholders (teachers and student presenters/listeners in a classroom setting).

The easy and simple dashboard design to motivate students to participate in giving feedback to their classmates and giving the instructor a nice overview of what is happening within their class in one screen.

User Analysis

Empathy Maps & Needs Analysis

For this project, we were provided with the design context and user needs. According to the information given, the team created three empathy maps: for the student presenter, student listener and instructor. By laying out information of our stakeholders, we were able to get a good understanding of the user goals the dashboard design should achieve.

Based on our empathy maps for each of the student presenter, student listener, and the instructor, we were able to create a needs analysis venn-diagram for what each stakeholder needs from the dashboard.

For this dashboard, all users will need real-time high quality feedback organized on a single platform.

Wireframes + Prototypes

Hand-drawn Wireframes

From the empathy map, needs analysis, and the given dataset, we created wireframe variations to allow instructor and the student listener to utilize the dashboard in real-time. These were the two sets of iterations we came up with.

One set restricts the student listener view to only focus on writing their own responses to the question list provided by the presenters. Instructor can monitor all the incoming student responses in a chatroom format.

The other set allows both student listener and professor to see all comments made in real-time. Student listeners and instructor can choose to upvote any comments that are perceived as extremely valuable.

Black and White Prototypes

In addition to 'typing comments' prototype, the 'note-taking' prototype idea also came up from the wireframes discussion. We decided to continue exploring with both ideas for the black/white prototypes.

After discussing these prototypes, we decided that our focus of the dashboard to be more than simply question-answering, it should foster idea discussions. We also wanted everything to be available on one page at a glance, without having lots of sub-pages or switching between views.

The final design structure we determined on is a structure that makes student listeners only see their own comments DURING the presentation, then display all student comments anonymously AFTER the presentation for upvoting time, and the most upvoted comment will be displayed at the top. Instructors will be able to monitor all incoming comments DURING and AFTER the presentation.

This speaks to the high-quality feedback desired by the users.

Color Prototyping

Experimenting with Color

After we built our black and white prototype,  we played about with a lot of different color themes and see which one suited our design the best. Our goal for this dashboard was to provide a simple and easy design for the users to use and minimize distraction for the student listeners.

We experimented with darker and lighter themes, bright and muted colors and after examining all of our prototypes, we decided that too much color would cause unnecessary distractions and darker background would be too overwhelming.

Therefore, we agreed upon a light gray background with one pop of color (purple) through all of our features. Purple is a strong, bold color that encourage creativity and creates a less formal impression of the dashboard interface, which helps with our concept of a commenting/discussion dashboard.

The dashboard design provides a simple real-time interface that motivates students and professor to provide/monitor feedback.

Final Prototype

We have put together an easy and simple dashboard design to motivate students to participate in giving feedback to their classmates, and giving the instructor a nice overview of what is happening within their class in one screen.

We met our intention of limiting distraction and helping the student listeners give high quality feedback, so we designed the student view to restrict them seeing only their own comments during the presentation, and dedicate an upvoting time where all student comments are available anonymously after the presentation. During upvoting time, dashboard background will change to light purple.

For the instructor, we really wanted them to have a good view over the class with statistics of class participation along with the comments. Additional features include access to all the comments made by their students (toggle view), focus on responses to specific questions and the ability to release comments for students to upvote.

For the instructor, we really wanted them to have a good view over the class with statistics of class participation along with the comments. They will also be able to provide audio feedback, which will be recorded for the student presenters to access later.

Additional features include access to all the comments made by their students (toggle view), focus on responses to specific questions and the ability to release comments for students to upvote.

Other Projects

All works