Post

Student Dashboard (Visual Countdown)

Visual countdown of the school year.

What is it?

Inspiration

Although our school publishes important dates on a public Google Calendar, high school students do not typically use Google Calendar. Instead, they ask me for information like I am Siri. 💀 I created this dashboard to foster student independence and reduce my own cognitive load. 😌

What it does

This Student Dashboard (Visual Countdown) is the startup webpage for computers in my classroom. It features the information I think students need most:

  1. The current date, and day of the week.
  2. A visualization of all the days of the school year, separated into terms.
  3. Student holidays, such as teacher inservice days.
  4. Student activities, such as Picture Day or basketball games.
  5. Important dates, such as “Rosh Hashanah” or “Last Day of School”.
  6. Opportunities, such as free days at local museums.

Why it’s awesome

Easy for staff to contribute

  1. Retrieves events from multiple public Google Calendars and/or JSON.
  2. Links to specific Google slides (in a deck editable by teachers).

Easy for students to use

Desktop View

  1. QR code (in footer) for easy sharing to student mobile devices.
  2. Responsive design supports web or mobile clients.
  3. Includes a link library for online student resources.
  4. Built-in Google Translate widget for immediate translation.
  5. Built in Google Calendar (combined display) for additional info.

Easy for lab manager

  1. Automatically refreshes every midnight.
  2. Keeps computers awake with the WakeLock API.

Tech stack

  • JavaScript, jQuery, date-fns
  • Bootstrap
  • Google Calendar API
  • Google Translate
  • Google Slides
  • Bitly link shortener (QR code)
  • ChatGPT (for help)
This post is licensed under CC BY 4.0 by the author.