Coding the Renaissance
You've been studying the Renaissance and reading Behind the Canvas, so your challenge with this project is to help others get behind the canvas of a Renaissance painting based on your research, insights and creative writing. Good luck!
Day 1: Create a Google Site
- Video Tutorial
- Home page will have image of painting with links to various facts embedded in it (that will be added later)
- Create a separate page for each annotation. Copy from google doc and paste into page. Separate pages will be created for each annotation. Add source if you have one. If source is a Youtube video, you can embed it.
- Once you have added all your content, try out different themes, fonts, colors.
- If you have time, create a logo using Piskel.
Day 2: Create an Image Map
Do one time:
Repeat for each annotation:
Final step:
Do one time:
- On the paper copy of your painting, figure out where you are going to link each of your annotations. Draw a circle/rectangle there with the annotation number inside.
- Go to The Paintings resource page:
- Find your painting and click on it to get to bigger version.
- Right-click and select Copy Image Location.
- Open the Image Map Generator.
- Select Load Image from Website button and paste in image location address.
- Open your google site & publish (site name should be your core number + canvas + your first name, eg 1canvaskim).
Repeat for each annotation:
- Select your first annotation.
NOTE: Be sure you are copying web address from your PUBLISHED site and not the version you are editing! - Copy web address.
- Go back to Image Map Generator.
- Highlight a portion of the image to link annotation to.
- Paste web address from your google site under Link.
- Click Add New Area button.
- Repeat steps for each of your annotations.
NOTE: There is no way to save this work if you are only part way through it. If you don't get done in class, be sure to leave the Image Map Generator tab open on your computer, so you can come back later to finish.
Final step:
- When done, select Show Me The Code! Button.
- Copy code.
- On your google site’s home page, select Insert and then <> Embed and paste code.
Days 3 & 4: Test & Launch
NOTE: If your image map is complete & published on your website, then do the following:
BONUS activities:
NOTE: If your image map is complete & published on your website, then do the following:
- Add an intro paragraph above your painting explaining how visitors to your website should interact with it. Make it engaging:)
- Hide all the annotation pages from navigation.
- Create an About page and write about why you chose to highlight the painting you chose.
- Publish & test website. This means making sure all the links work and there are no spelling/grammar errors.
- Ask friends to give you feedback and make updates as needed.
BONUS activities:
- Create a quiz for website visitors based on your annotations. You can use a google form to create a 3-5 question quiz. Check out this example. To turn a form into a quiz:
- Create a new form
- Go to Settings.
- Under GENERAL tab, uncheck Restrict users in St. Anne's-Belfield School.
- Under QUIZZES tab, turn on Make this a quiz option.
- Add a page for original writing created by you that was inspired by the painting, the Behind the Canvas book and/or the Renaissance period.
- Create custom header images with piskel.
NOTE: Do not use images from the web. You can either create your own or use images from the Gallery.
Permissions!
Google site:
Google form (if you did a quiz):
Google doc (if you embedded a story from a google doc):
Google site:
- Edit your google site
- To the left of the Publish button, there is a icon of a head with a plus sign next to it. Click it.
- Next to Published, select Change...
- Select Anyone can find and view the published version.
- Click Save button.
Google form (if you did a quiz):
- Edit your google form
- Go to Settings.
- Under GENERAL tab, uncheck Restrict users in St. Anne's-Belfield School.
- Select Save.
Google doc (if you embedded a story from a google doc):
- Edit your google doc
- Click Share button
- Click Get shareable link
- Select Anyone at St. Anne's-Belfield Sch...
- Select More...
- Select On - Anyone with the link
- Click Save button