Sie sind auf Seite 1von 61

CANVAS DESIGNER GUIDE

Table of Contents
Resources for Designers................................................................................................................4
The Designer Role........................................................................................................................................5
Sample Courses ...........................................................................................................................................6
Canvas Orientation Courses.........................................................................................................................6
Improving the Accessibility of Your Course ..................................................................................................7
Assignments...................................................................................................................................9
Assignments: Grouping By Assignment Type.............................................................................................10
Calendar .......................................................................................................................................11
Calendar: Adding Lectures as Events.........................................................................................................12
Course Home Page......................................................................................................................16
Pages: Building the Course Front Page......................................................................................................17
Discussions ..................................................................................................................................22
Discussion: Posting and Responding to Discussion Topics .......................................................................23
Files..............................................................................................................................................27
Files: Sharing Files with Students...............................................................................................................28
Mobile...........................................................................................................................................30
Designing Course Content for Mobile Devices ...........................................................................................31
Modules........................................................................................................................................32
Modules: Organizing Course Content in Modules ......................................................................................33
Outcomes .....................................................................................................................................40
Outcomes: Writing Course-Level Learning Outcomes................................................................................41
Pages ...........................................................................................................................................42
Canvas Designer Guide
Pages: Using Pages ...................................................................................................................................43
Pages: Previewing Documents in a Page...................................................................................................45
Quizzes.........................................................................................................................................46
Quiz: Using Quizzes and Polls....................................................................................................................47
Rubrics .........................................................................................................................................55
Rubrics: Using Rubrics to Evaluate Student Submissions..........................................................................56
Syllabus........................................................................................................................................57
Syllabus: Example Syllabi ..........................................................................................................................58
Canvas Designer Guide
Resources for Designers
Canvas Designer Guide
Page 4 Canvas Designer Guide Updated 4/12/14
The Designer Role
The Canvas Designer Guide is a growing collection of best practices in Canvas course design. Do you
have any ideas or courses you would like to share? If so, please send your public course URL to
training@instructure.com.
Role Permissions
The Designer Role is a course-level role, akin to the Student, Instructor, and TA roles in Canvas. By default, the
Designer does not edit grades, add/remove other users, or have access to the faculty journal. They can edit course
content, however, even after the course has started.
Canvas Designer Guide
Page 5 Canvas Designer Guide Updated 4/12/14
Generally speaking, the Designer Role is best suited for the instructional designers or curriculum writers who write
and manage course content, while the Instructor Role is for teachers and faculty charged with facilitating meaningful
learning interactions with their students.
Sample Courses
Here are a few examples of publicly available courses in Canvas. Some of these courses are "in
progress" or Canvas Network courses.
Note: The resources on this page will be moving to our new Canvas Course Collection 1 (CCC1) manual
in 2014.
Public Canvas Courses
1. Social Media (Canvas Network Course)
2. MOOC MOOC January 2013 (Canvas Network Course, Hybrid Pedagogy)
3. Art Appreciation (Canvas Network Course, Open Course Library)
4. History of Ancient Civilization (Canvas Network Course, Saylor.org)
5. Game Design Concepts (Canvas Network Course)
6. Introduction to Openness in Education (Canvas Network Course, Lumen Learning)
7. International Health Systems (Canvas Network Course, University of Central Florida)
8. English Composition I (Canvas Network Course, Lumen Learning)
9. Algebra+ (Canvas Network Course, Peninsula College)
10. U.S. History 2 (Canvas Network Course, Seattle Central Community College)
Note: FFT stands for Free-For-Teachers. Click here to get a free account. Click here to view courses about Canvas.
Canvas Orientation Courses
Do you have a Canvas training course that you would like to share? If so, please email
training@instructure.com and we'll add yours to the list.
Note: The resources on this page will be moving to our new Canvas Course Collection 1 (CCC1) manual
in 2014.
Canvas Training for Students
1. Wright Career College New Student Orientation
2. Howard Community College Canvas Training for Students
3. Bucks County Community College Canvas Basics for Students
4. Rider University Canvas Student Center
5. Edison State College Student Orientation
Canvas Designer Guide
Page 6 Canvas Designer Guide Updated 4/12/14
6. University of Central Florida, Center for Distributed Learning click-thru Student Canvas Tour
Canvas Training for Instructors
1. Brown University Intro to Canvas
2. Utah State University Canvas for Bb Vista Users
3. Weber State University Faculty Orientation to Canvas
4. Howard Community College Canvas Training for Faculty
5. Massasoit Community College Faculty Resource Site
6. Snow College Online Canvas Orientation
7. Rider University Canvas Faculty Center
8. Samuel Merritt University Faculty Online Training Course
9. University of Central Florida, Center for Distributed Learning click-thru Faculty Canvas Tour
10. Auburn University, The Beginner's Guide to Canvas for Instructors
11. University of St. Francis, Canvas Overview Video
Other Canvas Resources
1. Calvin Theological Seminary Canvas Central
2. New Mexico State University Instructor Resources
3. Bucks County Community College Canvas Logbook
4. Edison State College LMS Selection Process
5. Edison State College Canvas Resources & Rubric Examples
6. University of South Florida How to Teach Online (in Canvas)
Improving the Accessibility of Your Course
Various state and federal laws have requirements aimed at making education accessible to as many
people as possible. For instance, making sure that classrooms are wheelchair accessible would be an
effort to comply with these laws and policies. Online classes need to be accessible as well. Here are
some best practices to use in Canvas. If you have additional suggestions, please contact
training@instructure.com.
Design
Keep the design simple, clean, and uncluttered.
Use alternate text tags for images. For example, you can add alternate text when you embed an image
from the web or from Flickr creative commons. If you have an image in your course file you want to use,
you can add an alt tag by switching to HTML view. Doing this will mean that people who use a screen
reader to read aloud the contents of a web page will hear an auditory description of the image.
Rather than pasting in raw URLs, link to words that describe the link destination. Again, this will help
people using a screen reader understand where the link will take them.
Canvas Designer Guide
Page 7 Canvas Designer Guide Updated 4/12/14
Use other formatting besides color (bold words, different size font) to distinguish between important items
in your course. Changing the font size rather than using different colors will benefit those people who
cannot differentiate colors.
Learn to use CTRL+ and CTRL- or CMD+ and CMD- to resize the text in the course for the visually
impaired.
Video
Caption YouTube Videos.
Use the link icon in the Rich Content Editor to embed a YouTube video. It will auto-embed the video and
link to the title of the video. Visit How do I link to a YouTube Video? in the Canvas Guides for more
information.
Screen Reader Programs
Macintosh: VoiceOver (the latest version for Safari)
PC: JAWS (latest version for Internet Explorer 9 &10 and Firefox)
There is no screen reader support for Canvas in Chrome
Resources
Creating Accessible Electronic Content
Canvas Voluntary Product Accessibility Template (VPAT)
Enabling Keyboard Navigation in Mac OS X Web Browsers
Tips & Tricks
By pressing the comma key, a pop-up window with keyboard shortcuts will appear for keyboard navigation on the
following pages in Canvas:
Assignments Index Page
Calendar
Course Settings: Navigation Tab
Discussion Threads
Gradebook
Modules Index Page
SpeedGrader
Canvas Designer Guide
Page 8 Canvas Designer Guide Updated 4/12/14
Assignments
Canvas Designer Guide
Page 9 Canvas Designer Guide Updated 4/12/14
Assignments: Grouping By Assignment Type
John Goodman of Bridgerland ATC has organized assignments in his Digital Media course into six groups:
Readings, Video Viewings, Quizzes, Tests, Projects, and Video Critiques. Students can see this same view if they
click on the 'Group Assignments by Type' button in the right-hand Sidebar.
Canvas Designer Guide
Page 10 Canvas Designer Guide Updated 4/12/14
Calendar
Canvas Designer Guide
Page 11 Canvas Designer Guide Updated 4/12/14
Calendar: Adding Lectures as Events
One of the easiest ways to begin using Canvas is to add assignments and lecture notes to the Calendar.
Just adding the titles along with their respective due dates does a great service for students, as they see
those reminders on their Dashboard and in their own Calendar. They will also receive automatic
notifications via their preferred communication channels, such as text messaging, Facebook, Twitter, or
personal email addresses.
MATH 214 Elementary Differential Equations
Bong-Sik Kim uses a simple formula to help his students stay on track in his face-to-face courses. First he adds
Assignment names to his Calendar. You can see from the drop down that he typically creates two kinds of
assignment groups: groups for his tests and final exam and another group for homework. He doesn't grade his
homework in Canvas; he just uses Canvas as a course communication tool for students in his face-to-face
classroom.
Canvas Designer Guide
Page 12 Canvas Designer Guide Updated 4/12/14
After adding assignment shells, he adds calendar events for each of his lectures.
Canvas Designer Guide
Page 13 Canvas Designer Guide Updated 4/12/14
He chooses to edit the Full Details of his Calendar events. This takes him to the Rich Content Editor, where he can
add a PDF of his lecture slides as well as details about the homework assignment that will follow that lecture.
Canvas Designer Guide
Page 14 Canvas Designer Guide Updated 4/12/14
The end result is a calendar that looks like this. Notice that there are calendar events for lectures [1] and calendar
assignments for homework and tests [2, 3].
The student sees the Syllabus as the Course Home Page, which contains a short description of the course at the
topic of the page and a chronological course schedule on the home page, which Bong-Sik Kim has set to the
Syllabus page. The students can also quickly access course announcements and course files from the navigation
on the left hand side. Finally, Bong-Sik Kim uses Pages to share helpful links with his students and to link out to
detailed story problems that the students must solve. The end result for the student is a very simple but effective
Canvas course that complements what he is doing in the classroom and helps the students stay on track.
Canvas Designer Guide
Page 15 Canvas Designer Guide Updated 4/12/14
Course Home Page
Canvas Designer Guide
Page 16 Canvas Designer Guide Updated 4/12/14
Pages: Building the Course Front Page
Intro to Skateboarding
Jared Stein of UVU has developed a simple course home page using the table layout feature in the Rich Content
Editor. Each of the five weeks in this course addresses a different skateboarding technique. Each week, students
are required to submit demo videos of their skating skills.
Canvas Designer Guide
Page 17 Canvas Designer Guide Updated 4/12/14
Math 7
Laurie Baker of Sweetwater Union High School District has created a colorful Course Home Page in a two column
layout with yellow- and blue-highlighted headings. This simple page effectively leads students to key resources,
projects, and how-to videos for Canvas.
Canvas Designer Guide
Page 18 Canvas Designer Guide Updated 4/12/14
Anatomy & Physiology II
Bill Hanna of Massassoit Community College designed his Course Home Page to link out to other content pages
that will help orient his students to how the course works, policies, outside resources, and help.
Canvas Designer Guide
Page 19 Canvas Designer Guide Updated 4/12/14
Leadership for School Problem Solving
John Nash, from the Department of Educational Leadership Studies, in the College of Education at the University of
Kentucky, has linked to a public Google chat gadget on his Course Home Page so that his students can reach him
at any time. He has also embedded a short video explaining how the Conversations feature works in Canvas.
Canvas Designer Guide
Page 20 Canvas Designer Guide Updated 4/12/14
Digital Media
John Goodman of Bridgerland ATC uses HTML and images to create a clean-looking and informational Course
Home Page. He clearly lays out the objectives of the course as well as the Assignment pass-off sheet. This is a very
effective way of sharing with students what they will be asked to perform in the class.
Canvas Designer Guide
Page 21 Canvas Designer Guide Updated 4/12/14
Discussions
Canvas Designer Guide
Page 22 Canvas Designer Guide Updated 4/12/14
Discussion: Posting and Responding to Discussion Topics
Pre-Class Reading & Response
Gideon Burton of Brigham Young University posts discussion topics to guide students through pre-class readings.
Notice that he has linked directly to readings and assignments.
Canvas Designer Guide
Page 23 Canvas Designer Guide Updated 4/12/14
Burton reinforces good student participation in the class discussions by pointing out when and how they have
fulfilled course outcomes.
Canvas Designer Guide
Page 24 Canvas Designer Guide Updated 4/12/14
English 102
In this unit-by-unit course, Sam McCool of Nevada State College posts two-part discussion topics. Students are
required to answer five questions in their post and then rate the post of a group mate out of five points with a
detailed response justifying their response.
Canvas Designer Guide
Page 25 Canvas Designer Guide Updated 4/12/14
English A1 (12th Grade)
Denise Crlenjak provides several good examples of interesting discussion prompts for her 12th grade English class.
She uses colored text and embedded videos to make the posts more interesting. She also asks students to submit
essays via the Discussion forum, so that the entire class can read, evaluate, and discuss.
Canvas Designer Guide
Page 26 Canvas Designer Guide Updated 4/12/14
Files
Canvas Designer Guide
Page 27 Canvas Designer Guide Updated 4/12/14
Files: Sharing Files with Students
For help with Files, please view the Files lessons.
Sharing and hiding files from students
Dr. Ulrich of Wharton University uses Canvas to supplement an engaging, hands-on class about becoming better
innovators, problem solvers, and designers. He shares multiple files with his students to assist them as they
complete projects and assignments but he chooses to keep his lecture slides in a private folder that he can access
during classes.
Canvas Designer Guide
Page 28 Canvas Designer Guide Updated 4/12/14
Sharing PowerPoint slides
Sally Coleman teaches a course on Northern Renaissance Art and uses Files to share all of her PowerPoint slides
and images with students. Clicking the "Fullscreen" option in Files makes it possible to preview presentations
without opening Microsoft PowerPoint on a computer.
Canvas Designer Guide
Page 29 Canvas Designer Guide Updated 4/12/14
Mobile
Canvas Designer Guide
Page 30 Canvas Designer Guide Updated 4/12/14
Designing Course Content for Mobile Devices
Canvas is built on open web standards and uses minimal instances of Flash, so most features are
supported on mobile devices. With the growing use of mobile devices, courses should be built with best
practices for mobile in mind.
Mobile Browsers
Canvas can be viewed on any mobile browser. However, the Canvas interface is optimized for desktop
displays, so using small form factors such as phones may not be a pleasant experience in using Canvas.
We recommend trying our mobile apps.
Mobile Applications
Instructure provides two native mobile applications for Canvas users:
Canvas by Instructure. This app is free and supports both iOS and Android devices.
Depending on the device, not all Canvas features may be available on the app at this time.
SpeedGrader App. This app is specifically designed for instructors and allows them to grade
student submissions on the go. This app is also free and is currently only available for iOS
tablets.
Learn more about how Canvas features appear on the mobile apps via the Canvas Mobile App Guides:
Canvas by Instructure iOS Phone Guide
Canvas by Instructure iOS Tablet Guide
Canvas Mobile Phone Student Guide (Android)
Canvas Mobile Phone Instructor Guide (Android)
SpeedGrader iOS Tablet Guide
Canvas Designer Guide
Page 31 Canvas Designer Guide Updated 4/12/14
Modules
Canvas Designer Guide
Page 32 Canvas Designer Guide Updated 4/12/14
Modules: Organizing Course Content in Modules
There are several different ways to organize a module so that it is easy for students to navigate. The
following lesson contains several examples.
Engage, Explore, Apply, Review
Calvin Theological Seminary has chosen to organize their module with four text headers: Engage, Explore, Apply,
and Review. Each of these sections contain readings, assignments, and quizzes that give student the opportunity to
review and reflect on different materials. This particular site features a snippet of javascript in the branding file that
auto-links to scripture passages on http://bible.org.
Canvas Designer Guide
Page 33 Canvas Designer Guide Updated 4/12/14
Lab & Lecture Notes
Bill Hanna of Massasoit Community College uses Canvas to post his lab and lecture notes. He posts materials as
the semester progresses.
Canvas Designer Guide
Page 34 Canvas Designer Guide Updated 4/12/14
Topic by topic
This AP Human Geography course contains modules organized by topic. Each topic is divided into introductory
notes, vocabulary, case studies, a focused response question, resources, and a quiz.
Modules for Blended Oceanography Course
Canvas Designer Guide
Page 35 Canvas Designer Guide Updated 4/12/14
Jared Stein of UVU has put together a blended learning experience. Students read and watch introductory material
and take a quiz before the class. Videos are posted for in-class use, followed by assignments, discussions, or lab
materials.
Prerequisites in Modules
This Introduction to Pastoring course is laid out sequentially, so that students have to finish one module before
completing another.
Canvas Designer Guide
Page 36 Canvas Designer Guide Updated 4/12/14
Quiz Completion
In this training course about Canvas, Weber State University organized their modules with quizzes at the end.
Canvas Designer Guide
Page 37 Canvas Designer Guide Updated 4/12/14
Assessment-based Modules
John Goodman of Bridgerland ATC uses the Modules page to organize assessments (readings, video critiques,
quizzes, and tests). This is an effective strategy that puts the emphasis on students doing work as much as they are
consuming new information.
Canvas Designer Guide
Page 38 Canvas Designer Guide Updated 4/12/14
Modules for self-study courses
Pages, Discussions, Videos, and Self-check Quizzes work together to keep this Italian Cuisine course fun and
engaging. Most of the module items in this course are set in strict sequential order, so that learners absorb and
digest the information step by step.
Canvas Designer Guide
Page 39 Canvas Designer Guide Updated 4/12/14
Outcomes
Canvas Designer Guide
Page 40 Canvas Designer Guide Updated 4/12/14
Outcomes: Writing Course-Level Learning Outcomes
English 291 Learning Outcomes
Gideon Burton of Brigham Young University created four Outcomes for his Early British Literary History course,
along with detailed bullet points further defining what types of behaviors he is looking for.
Canvas Designer Guide
Page 41 Canvas Designer Guide Updated 4/12/14
Pages
Canvas Designer Guide
Page 42 Canvas Designer Guide Updated 4/12/14
Pages: Using Pages
Canvas allows flexibility in building courses through Pages. You can create multiple pages within your
course and use Modules to organize them.
Academic writing wiki
Mr. Nathan Kelber of University of Maryland uses the Pages feature in Canvas to create a course wiki that follows
the outline of the two required texts for his Rhetoric and Composition course. The wiki is a shell where students can
share their notes and reflections as they complete their required readings.
Canvas Designer Guide
Page 43 Canvas Designer Guide Updated 4/12/14
A resource page that students can edit
For his 12th grade Economics class at the International of School of Panama, Mr. McGlothlin created a simple wiki
page editable by students. Students contributed links to YouTube videos and web pages that helped them to study
course material.
Canvas Designer Guide
Page 44 Canvas Designer Guide Updated 4/12/14
Pages: Previewing Documents in a Page
English 1010
For her English 1010 course, Sarah Orme of Utah State University uploaded the Assignment handouts she normally
prints out and gives to her students. Now her students can go to one page and read or print any of the assignment
descriptions.
Canvas Designer Guide
Page 45 Canvas Designer Guide Updated 4/12/14
Quizzes
Canvas Designer Guide
Page 46 Canvas Designer Guide Updated 4/12/14
Quiz: Using Quizzes and Polls
Medical Mission Service Training
The Christian Health Service Corps has designed a simple Multiple Choice and True/False quiz for students to take
at the end of each module.
Canvas Designer Guide
Page 47 Canvas Designer Guide Updated 4/12/14
Quiz on Course Policies
Dr. Ulrich of the Wharton School of the University of Pennsylvania created a quiz around course policies that
reminds students of their obligations during the course.
Canvas Designer Guide
Page 48 Canvas Designer Guide Updated 4/12/14
Find-out Polls
In this course, Public Health and the Educated Citizen, the designer has included short polls that students can
answer during or before class.
5 Minute "Entrance" or "Exit" Quiz
Canvas Designer Guide
Page 49 Canvas Designer Guide Updated 4/12/14
5 Minute Quiz with Access Code
In this course on Public Health and Education, Mike Caulfield of Keene State College created a 5-minute quiz with
an access code. This quiz could be administered at the beginning or end of a class based on an assigned reading.
Students
1) answered it individually first, then
2) talked to one another about their answers, then
3) answered it a second time.
Canvas Designer Guide
Page 50 Canvas Designer Guide Updated 4/12/14
This allowed the instructor to:
a) see immediately which students did not get it
b) see how many students improved with instruction
c) call on students who selected the right answer to explain their thinking to the class
d) respond to common misunderstandings
Example of Voluntary Poll
Another example of a voluntary poll.
Canvas Designer Guide
Page 51 Canvas Designer Guide Updated 4/12/14
English A1 (12th Grade)
Denise Crlenjak creates a fill-in-the-blank quiz to test her student's understanding of literary terms.
Canvas Designer Guide
Page 52 Canvas Designer Guide Updated 4/12/14
Quiz to "Rate My Answer"
For his 12th grade Economics class at the International of School of Panama, Mr. McGlothlin created a quiz where
students had to evaluate his answers based on a grading scheme he provided. The five quiz questions (listed
below) require students to assign points and justify their answers.
Canvas Designer Guide
Page 53 Canvas Designer Guide Updated 4/12/14
Another Example
Canvas Designer Guide
Page 54 Canvas Designer Guide Updated 4/12/14
Rubrics
Canvas Designer Guide
Page 55 Canvas Designer Guide Updated 4/12/14
Rubrics: Using Rubrics to Evaluate Student Submissions
Sam McCool of Nevada State University uses letter-grade rating levels for each of the writing assignments required
for his English 102 course. His evaluation is divided equally between Content, Organization, Mechanics, and
Grammar.
Canvas Designer Guide
Page 56 Canvas Designer Guide Updated 4/12/14
Syllabus
Canvas Designer Guide
Page 57 Canvas Designer Guide Updated 4/12/14
Syllabus: Example Syllabi
Introduction to Research Using Off-Campus Library Services
Julie LaDell-Thomas has chosen to edit her Syllabus description with a short bio, course description, course goals,
technical requirements, textbook info, expectations, and a short description of communication methods. She also
summarizes course contents with a week-by-week outline and schedule. Finally, she pastes in the course grading
policy and grading scale.
Canvas Designer Guide
Page 58 Canvas Designer Guide Updated 4/12/14
Leadership for School Problem Solving
John Nash of the University of Kentucky has chosen to build an extensive Syllabus description for his Education
leadership course, which includes:
contact info,
course description,
textbook info,
course policies,
accommodation info,
grading scale,
bibliography, and
course calendar outlining each week's activities.
Canvas Designer Guide
Page 59 Canvas Designer Guide Updated 4/12/14
English 1010
Sarah Orme of Utah State University has built a Canvas course that will supplement face-to-face instruction in her
English 1010 course. One of the fastest ways to get started in Canvas is to upload your syllabus file and link to it on
the Syllabus page. Students can then use the Scribd preview to see the Syllabus in 'Fullscreen' mode or to 'Print' it.
Canvas Designer Guide
Page 60 Canvas Designer Guide Updated 4/12/14
Intro to Psychology (11th Grade)
Ms. Urroz from the International School of Panama uses the Syllabus page to lay out the topics for each of her class
sessions as well as homework. CW (Class Work), HW (Homework), Quizzes, Tests, Projects, and Presentations are
all clearly listed in chronological order. All of these items were added as Assignments in Canvas, though several of
them are empty and require no student submission.
Canvas Designer Guide
Page 61 Canvas Designer Guide Updated 4/12/14