Creative Interfaces

[jkolsen]

I am teaching two graduate courses for teachers this summer.  Because teachers can use Canvas and other technologies with their own classes, I like to demonstrate creative things they can do.  The traditional listings are left on the side as well, to provide multiple forms of access to content. Each book and icon is linked to a page in Canvas. The bookshelf itself is hosted in Google Docs and is created in PowerPoint.  I have students from a wide geographic area, so they are able to map their locations using Google Maps and a google sheet. It helps create community.

I am interested in seeing what kinds of creative things other users do!

-----

--

[kona]

jkolsen​, would you mind sharing more about how you were able to create bookshelf with links to different parts of the course? I've been wanting to do something similar, but couldn't figure out a good way to do it!

Thanks!

[thomast]

Thanks for asking, Kona, I was just thinking the same thing

[jkolsen]

Here's what I did:

• I had read that Google Drive can be integrated with Canvas How do I connect to Google Drive as a web service in Canvas? | Canvas Instructor Guide | Canvas Guid... so I imported my PowerPoint to Google Drive.
  • This was also important information for creation of my interactive Google map.
• I found a bookshelf background in PowerPoint somewhere. Then I located a bunch of book images/clip-art. I initially put the bookshelf, and  few icons together in PowerPoint.  I don't really remember where I found the original ppt, but am willing to share if you would like. A google search on "PowerPoint Bookshelf Slide" should bring up a lot of options to start with.
• Once you've got it into Google, you will be able to really work with it.  Google changes the format from pptx to their own format  so once you've got it in Google, just add images/icons there. Each image/icon can be individually selected and linked to a Canvas page or assignment. After you get the proportions set up right you can confidently add books and other objects to link with copy/paste.
• To link the objects back to Canvas, select the page or assignment you want to link to from within Canvas. Right click it and "select link location"
• Go back to Google (I keep Google and Canvas open in two separate windows) and click on the icon you want to link.  At the top of the page under the menu you will see an icon that looks like chainlink, to connect the url. Click that.  Paste in the link.
• As you start to get it set up, you will want to publish it to Canvas.  From your PowerPoint in Google Drive, select File-->Publish to Web-->Embed.  Grab the code. (Copy)
• Go back to Canvas. Go to your home page. Click Edit
• Just above the edit box, click  the HTML Editor link.  Paste in the code from Google Drive. click back to Rich Content Editor to see how the slide will line up.  I recommend centering it. 
• Once you get it into canvas, you will see how you need to re-proportion the slide.  I customized mine to be more vertical  with dimensions 1056x1661.  if the dimensions are off you'll get a lot of black background around the bookshelf.
• You'll go back and forth a bit until you start to get it set up. As soon as you change something in Google it updates in Canvas. Very cool. Worst case is you might need to refresh your Canvas page.
• If any of this doesn't make sense I'll give it another go.

[crafte]

jkolsen​,

I love your idea of a bookshelf. We had used a similar approach using a flow diagram created in PowerPoint. The slide was captured using Snagit and we used Snagit's hotspot feature to add the course links. The resulting file was saved as a .swf file and embedded into a Canvas page. You would only be able to use it in courses that are not copied frequently since the links would need to be updated in Snagit.