[ARCHIVED] Random images in quiz questions

[matthias_5]

Got one that has stumped me...

An instructor uses lots of images (plant pathology) in his lectures then also reuses the images in quiz questions. He has created several different versions of the images, typically two small blocks atop one large block, that have different viewpoints of the plant.

What he wants to be able to do is have a bank of images that, when a student takes one of his weekly quizzes and needs to retake the quiz (two attempts), the student "possibly" gets a different image of the same plant when getting the same question. The instructor is not randomizing questions; just wants to randomize the images within questions.

I've talked to the instructor about creating individual question banks for each plant that has the same question but each with a different view of the plant but the instructor doesn't want to go through the work of duplicating questions so that he can incorporate his 1k+ images (I don't blame him).

Has anyone found a way to be able to pull a random image into a quiz question? I've seen a few posts about setting up rotating header images or image blocks within a page, but nothing for quizzes.

Any help would be better than what I got!

[cholling]

@matthias_5 That sounds like a very interesting problem. I'm sure it could be solved with some programming (but have no idea how that would work), but know of no way within Canvas. I was leaning toward the same solution you came to -- individual banks for the plants, but agree that would really be time-intensive. Would love to hear your solution if you come up with one. I can see how that could be beneficial in our nursing field.

Cindy.

[matthias_5 · Accepted solution]

First, thanks @langlangcat for the suggestion of the Javascript. Unfortunately, that's out of the scope of what I have to work with at OSU. That being said, one of my video colleagues noted that they have used our blog site/application to host images and that this might be able to be accomplished using that. Due to the sheer number of images, it was impossible to host them in Canvas.

The process:

1. We uploaded images to folders named for the individual plants (image files do not contain the name of the plant) in the instructor's media library on the blog site.
2. We then created question banks in Canvas with the same names used in the media library.
3. We then created generic MC questions: What is this plant? The title of the question, of course, had the plant name and disease (this was a ton of work and many thanks went to the TAs that did the work). 
   • Each question needed html code to direct to a specific plant image living in a folder on the blog site:
     <p>
     <img src="https://u.osu.edu/matthias.5/files/2020/11/ladysthumb-Polygonum-persicaria-32-1.jpg" />
     </p>
4. The faculty then created quizzes with multiple attempts that included pulling a certain number of questions from each plant type he wanted in the quiz from the question banks that were created.

While this solution was not perfect with not having students get the same image twice across several attempts taking the quiz, due to the sheer number of images the instructor had for a given plant and plant disease, the odds of a student getting the same view of a plant across multiple attempts was very slim. 

Proposed solution accepted by the instructor. 

[langlangcat]

What I can think of as a solution is you host your graphics in your own server and design a random picture gallery with JavaScript then embed your java page with the gallery to the question with an iframe. 

Random picture display is very easy, it is just needs an array that contains all the faculty's collection, and you randomly calls the var.

var quizPix = new Array("images/maple.jpg", "images/oak.jpg", "images/elm.jpg"); etc....