DesignPLUS, from Cidi Labs, helps you build Canvas pages that are organized, consistent, interactive, and easy for students to navigate, without any coding. It’s built into every Citadel Canvas course. The course template in every course shell, including the Start Here module, was built with DesignPLUS.
Why Visual Design Matters for Learning
How your course looks affects how well students learn from it. Students have limited working memory. When a page is cluttered or hard to navigate, students spend mental effort figuring out the page instead of learning the content (Sweller, 1988).
Research on multimedia learning points to three principles that good visual design supports (Mayer, 2020):
- Signaling: Students learn better when headings, labels, and visual cues highlight what’s most important and how ideas are organized.
- Segmenting: Students learn better when content is broken into manageable parts that they can work through at their own pace.
- Coherence: Students learn better when extra material that doesn’t support the learning goal is removed.
Navigation matters too. In one study, students rated an online course with easy-to-find materials as a better overall experience than the same course with hard-to-find materials (Robins et al., 2013). A clear, consistent design lets students spend their time on learning, not searching.
Best Practices for Visual Course Design
- Be consistent. Use the same layout, colors, and structure in every module so students always know where to look.
- Use real headings. Headings organize your content for every student, including those using screen readers.
- Chunk your content. Break long pages into shorter sections, or use tabs and accordions for supporting details.
- Keep essential information visible. Put instructions, due dates, and key steps on the page, not hidden in an accordion.
- Cut the clutter. Remove decorative images, extra colors, and content that doesn’t support the learning goal.
- Use images with purpose. Choose images that explain or reinforce content, and add alt text.
- Leave white space. Space between sections makes pages easier to scan and read.
- Check on a phone. Many students use the Canvas Student app, so preview your pages on a small screen.
Get Started
- There’s nothing to install or turn on. DesignPLUS is available in every Canvas course.
- Open the DesignPLUS Sidebar when you edit a page, assignment, discussion, or syllabus. It opens from the Rich Content Editor.
- Start with the template. Your course template already uses DesignPLUS styles. When you add new pages, use the same styles so your course looks consistent.
Using DesignPLUS
Organize and Style Your Course
- Apply consistent styles for headings, colors, and banners across your course.
- Build module overview pages that show students what to do, in what order, and when it’s due.
- Organize supporting content with accordions and tabs.
- Reuse content blocks you’ve already created, or copy content from templates and other courses.
- Style existing pages quickly, without rebuilding them.
Add Interactive Elements
DesignPLUS lets you turn content into short activities students complete right on the page. These elements are designed for practice and self-checks, not grades.
| Element | What students do | Use it to |
|---|---|---|
| Quick Check | Answer a few questions and get instant feedback | Check understanding after a reading or video |
| Flashcards | Flip cards to review terms and answers | Practice key vocabulary and concepts |
| Fill in the Blank | Type missing words to complete statements | Practice recalling important terms and facts |
| Match Items | Pair related items | Connect terms with definitions, examples, or images |
| Order Items | Put items in the correct sequence | Practice steps in a process or events in a timeline |
| Sort Items | Sort items into categories | Practice classifying examples |
| Select All | Choose every correct option | Check understanding of concepts with more than one right answer |
Connect to Active Learning
Interactive elements turn reading into doing, so students recall, apply, and organize information instead of only reading it.
- Build in retrieval practice. Add a Quick Check or Fill in the Blank after key content so students practice recalling it. See Evidence-Based Teaching Practices.
- Space practice over time. Add short review activities from earlier modules to later modules.
- Ask for more than recall. Pair an interactive element with a discussion or reflection prompt that asks students to explain, apply, or connect ideas. See Active Learning Techniques.
- Prepare students for class. Use interactive elements before class so students arrive ready to discuss and apply the content.
- Use Canvas quizzes for grades. For graded checks, use Canvas quizzes. Use DesignPLUS elements for low-stakes practice.
AI tools can help you draft practice questions, flashcard terms, or sorting examples from your course materials. Review everything for accuracy before you add it to your course.
Keep Your Pages Accessible
DesignPLUS includes built-in accessibility checks for headings, links, images, and color contrast. As you design:
- Keep headings in order, starting with Heading 2 on each page.
- Add alt text to banner images and other meaningful images.
- Check color contrast if you change theme colors.
- Give clear directions for each interactive element, and test it with a keyboard.
- Run UDOIT to check your whole course.
For more, see Accessible Canvas Content and Universal Design for Learning.
Get Help
- DesignPLUS training: CEITL offers training to help you design organized, interactive Canvas pages with DesignPLUS. Contact CEITL to learn about current offerings.
- Consultations: Schedule a course design and teaching consultation for one-on-one help designing your course pages.
- Cidi Labs resources: Visit the DesignPLUS Sidebar Resources page for the user guide, quick-start guides, and videos.
Sources
Mayer, R. E. (2020). Multimedia learning (3rd ed.). Cambridge University Press.
Robins, D., Simunich, B., & Kelly, V. (2013). The impact of findability on student perceptions of online course quality and experience. In J. Herrington, A. Couros, & V. Irvine (Eds.), Proceedings of EdMedia 2013: World Conference on Educational Media and Technology (pp. 1122–1129). Association for the Advancement of Computing in Education. https://www.learntechlib.org/primary/p/112100/
Sweller, J. (1988). Cognitive load during problem solving: Effects on learning. Cognitive Science, 12(2), 257–285.
Have a question? Contact CEITL by phone, email, or in person in Bond Hall, Room 363.