Allowing Student Choice in Their Daily Schedule: a Technical How-To

This year, using Google Forms and two Add-Ons, I cobbled together a system that allows teachers to account for our 400 high school students during a relatively open 30-minute period of their day. When developing this system, I had two primary objectives:

  1. I wanted students to choose which class they go to for this 30-minutes.
  2. I didn't want to use passes or paper and pencil sign-ups.

I needed to know where students were at and whether or not they attended, but I didn't want students to have to go to one teacher's class for attendance just to leave (as is done in typical seminar-like structures I've seen elsewhere). I find this to be a waste of time and energy.

After some help from the internet and time to tinker, I came up with the following system:

1. Students Register for the Class They Want to Attend

We offer these 30-minute periods, called FIT (for Focused Instructional Time) every Tuesday and Thursday in the middle of the afternoon. Prior to the start of each FIT period, students navigate to this page on our website, click on the name of the teacher who's class they need to focus on, and complete a Google Form letting the teacher know they plan to attend.

For reasons that will become evident in the next step, each of the registration links on this page go to a separate Google Form specific to that teacher's class.

2. Registrations are Capped at Thirty Students Per Class

To prevent some classes from becoming overrun with students, I use the formLimiter add-on by New Visions Cloud Lab. While not perfect, this add-on looks at the spreadsheet where registrations are being recorded and turns off the form once registration levels hit a pre-determined level (in our case thirty students).

3. Students Receive an Automated Email Confirming Registration

Whenever a student successfully registers for a class, they see a message on the screen and receive an email confirming our expectation that they will attend. This email is sent using Google's own Form Notificaitons add-on. It becomes the fall-back receipt in the event of a registration getting lost.

4. Registrations are Captured in a Single Google Sheet

To ensure my entire staff can easily find any student during this 30-minute period, I have set the destination of each of the individual teacher's registration forms to the same Google Sheet. My entire staff needs to have edit rights to this spreadsheet, so I protected all of the cells they shouldn't edit to prevent errors from breaking everything.

5. Teachers Take Attendance Using Registrations

Every Tuesday and Thursday, during this 30-minute period, teachers open up the spreadsheet, navigate to their course tab, and take attendance using the list of students who have registered to be in their class during FIT. If a student who registered is absent, the teacher copies the registration information and pastes it into another tab labeled "Absent." My dean of students checks the absent tab for students who should be present while my instructional coach and a paraprofessional "sweep" the halls looking for students who may have forgotten to register.

6. Once Attendance is Taken, Teachers Delete the Registrations

Within the sheet is a tab containing formulas that count the registrations for each teacher. It is this tab that each registration form looks at to determine whether or not the class is at capacity (30) and the form needs to close. Deleting the day's registrations after attendance is taken resets the count tab value to zero for the course allowing another 30 students to register the next time around.

If a teacher forgets to delete their registrations after taking attendance, then only as many students as seats available will be able to register the next time around before the form automatically shuts itself off. For this reason, deleting student registrations after attendance is taken is a key behavior to ensuring this system works.

A Teenager's View on Social Media

Insightful article by "actual teen," Andrew Watts:

If I could break down a party for you in social media terms, here’s how it would pan out:

  • You post yourself getting ready for the party, going to the party, having fun at the party, leaving at the end of the party, and waking up the morning after the party on Snapchat.
  • On Facebook you post the cute, posed pictures you took with your friends at the party with a few candids (definitely no alcohol in these photos).
  • On Instagram you pick the cutest one of the bunch to post to your network.

Snapchat is where we can really be ourselves while being attached to our social identity. Without the constant social pressure of a follower count or Facebook friends, I am not constantly having these random people shoved in front of me. Instead, Snapchat is a somewhat intimate network of friends who I don't care if they see me at a party having fun.

Roll Your Own Digital Signage

Last fall, I was lucky to have an interesting problem: our newly renovated learning space included eight 42" monitors, each located above a "laptop touchdown station" where students could plug in to collaborate, practice presentations, etc. The challenge was deciding what to show on these screens when students were not plugged in.

Corridor at Niles New Tech in Niles, Michigan

After researching commercial digital signage solutions, we decided that there has to be a better (less expensive) way to do this on our own. This post will outline what we did to create a social and dynamic digital signage solution using HTML, CSS, and a bit of javascript. While I image that "what we did" will be pretty specific to our needs at the time, my hope is that some of the ideas shared in this post will be helpful to others down the road.

To start, let's talk about the hardware:

  • The monitor we went with was the NEC V422 because it had sound, accepted a variety of input types, and had scheduling capabilities to turn on and off automatically at specified times of day.
  • Behind each monitor was an electrical outlet, an ethernet port, and an HDMI port. The HDMI port worked simply as a local connection for students to plug into that station. It only ran one foot down the wall to a second input plate above the counter.
  • Connected to the back of each monitor via VGA was a simple NComputing L-Series virtual PC.  These boxes were connected to our network via the ethernet jack and were the necessary link to make our digital signage work.
  • On the other end of the network connection was obviously a server running the virtual PC installations.

That was about all the hardware we needed to make this thing work. The rest of the work was in the software. Here's what happened on each:

  • My network admin setup the NComputing devices to automatically restart, login to the network, and open Chrome in full-screen mode every night. Since I didn't do any of this work I can't provide much detail beyond telling you that it worked. Of course, there were times when a particular device lagged or didn't work properly but the fix was usually as easy as restarting the individual box manually.
  • We set http://sign.nilesnewtech.org as the homepage in Chrome for each of these setups so that it would always open to our signage webpage.
  • We then set the timer on each monitor to turn on at 7am and turn off at 4pm. Every morning, when the students came in, the signage would be on every screen. If students wanted to "take over" a monitor locally to use it as an external monitor, they simply changed inputs and plugged in their laptop via HDMI.

Screenshot of the Niles New Tech digital signage webpage.

Once we had monitors connected to virtual PCs that automatically opened a webpage every night, our next step was to design and code a webpage with some interesting content.

When designing the site, I knew that I didn't want to create anything that would require much future updating through the backend. In other words, if I had to go back through the HTML every time I wanted to make a change, I knew this solution would fail. I don't have time to spend my day in code.

With this in mind, I started looking for javascript solutions that would take advantage of APIs to pull content from other sources like GoogleDocs, Twitter, or Flickr. By taking advantage of these services, I was able to create a single webpage that dynamically pulls content from these services throughout the day. My teachers, students, their parents, and visitors can all easily post content right alongside our school calendar and announcements. 

Here are the resources I used:

  • The calendar is a simple Google Calendar embedded into the page. You can setup your parameters for this right within the Google Calendar embed interface.
  • Everything that follows requires the jQuery library.
  • The HTC Hero inspired digital clock / weather widget is called jDigiClock.
  • Both the News & Announcements and Shout-outs sections of the site pull content from Twitter and are powered by electronaut's LiveTwitter plugin.
  • The image slideshow that pulls recent images from the school's Flickr is powered by Flickrfeed.

Screenshot of index.html

Once I found all of the resources needed to make the signage work, I started coding. Attached is a zipped up copy of everything I have at http://sign.nilesnewtech.org. Your free to steal the design and everything I've done. I've simply pulled together resources from other places. 

Download the files here.

Other things you'll need to do and know:

  • The News & Announcements section pulls content from a specific Twitter account. I gave access to this Twitter account to my teachers and secretary so that they could post whenever they had something to share. A notable benefit of doing this is that you can share the Twitter account with parents and students through other places (like your website, on Twitter, etc.). It's not only useful for the sign. (Edited on line 50 of index.php)
  • The "Shout-outs section pulls content from tweets that include a specified phrase (like a hashtag). This allows anyone to get their words on the screen just by using that tag in their tweet. This is an important and powerful part of the sign - it keeps people looking. (Edited on line 51 of index.php)
  • You'll need a Flickr account to link up to the pictures. (Edited on line 7 of setup.js) We all installed Flickr uploader apps on our phones so that we could easily take a picture of student learning in the classroom and upload it right to our shared account. Then, the next time the sign refreshed, it would show the new pictures you just took.
  • There are refresh rate caps with Twitter. You may need to change the refresh rates on lines 50 and 51 of index.php if you have a lot of signs pulling from Twitter simultaneously.

That's about all I have to share. I realize that this is not a very good technical post for those of you without a coding background. I simply can't think of any way to explain much more without turning this into a coding tutorial. If you have questions or hang-ups, feel free to post questions as comments or you can find me on Twitter @ptrkmkl.