More Random Class List Tools Created with AI

Earlier this year, with the assistance of ChatGPT, I created a Random Name Picker using HTML and CSS.

Now, I know that random name pickers are nothing novel. I actually created my name picker after seeing another teacher share the name picker at www.flippity.net. To be fair, I still like the one at Flippity better (its got a spinner!) but by creation was more about seeing what I could learning using ChatGPT.

To continue exploring the possibilities, I made two new randomizers with the help of ChatGPT.

Pick Canvas User

The first one is a handy bookmarklet designed specifically for people who use Canvas for their Learning Management System. It works when you’re at the “People” section of Canvas. Click the bookmarklet to run the script and it will randomly select the first name of a student and display it in an alert box.

Here was my exchange with ChatGPT and below is the code I used for the final product:

javascript:(function() {  var elements = document.getElementsByClassName("roster_user_name student_context_card_trigger");  var firstWords = [];  for (var i = 0; i < elements.length; i++) {    firstWords.push(elements[i].innerText.split(/\s+/)[0]);  }  var randomFirstWord = firstWords[Math.floor(Math.random() * firstWords.length)];  alert("Random Name: " + randomFirstWord);})()

To install this bookmarklet, follow these steps:

  1. Start by creating a new bookmark in your browser.
  2. Give the bookmark any name you’d like. I used “Pick Canvas User” for mine.
  3. Paste the code listed above into the URL or “Location” field of the bookmark.

With this tool, you can effortlessly select a random name from your student roster, making the process of choosing an individual for a specific task or participation seamless and fair.

Create Random Groups

The second tool is a Random Student Grouping page that simplifies the task of distributing students into groups. (Again, Flippity can do this too, but I had fun making my own.) By simply entering a list of students and specifying the desired number of groups, this tool randomly organizes them, ensuring each group is balanced and unbiased.

Give it a try.

Okay, that’s enough random AI tinkering for now but here is one last thing I thought I’d share.

A few days ago, I was testing out Bard’s new image upload feature. The screenshot of my Random Student Grouping page was sitting on my desktop so I thought I’d give it a try and ask Bard to describe it.

Below is what I got:

Whoa!

Random Name Picker created in Minutes!

Last night I told ChatGPT, “I want to make a webpage that will pick a random name from a list.”

In seconds, it delivered this to my phone:


This morning I fed it the suggestions below until I got what I wanted:

Is there a way for me to submit a list of names into the website and then it pick a random name?

I’d like the selected name to be displayed larger and at the top of the page. Can you add some CSS to give the page more style?

Instead of each name being separated by a comma, can this page be changed so the user submits the names with one name on each line?

When the submit button is pressed, can the page first display a random half of the names quickly one right after another and then end on the final one?

Can you double the selected name’s size?

Is there a way that the submitted names could be saved so that the user still has the last set of names they submitted from a previous browsing session?

If there are no names loaded in localStorage, can the page load with ten names to demonstrate the page? I’d like the ten names to be the first names of famous scientists.

I’d like to change the button title to Select Name. Also, can you add instructions above the bottom that explain to the user that they can replace the names in the box with their own but that they need to put one name on each line?

Can you add 10 more names to the defaultNames?

Here is the final product for you to try.