DesignPLUS Sidebar Feature Comparison
User Guide DesignPLUS Sidebar Feature Comparison
The tables below show overall feature parity between the new DesignPLUS Sidebar and the legacy version of Design Tools. Features that are still pending are highlighted in red. Features with limited availability or additional usage notes are highlighted in yellow. View the Detailed Version Comparison tab for specific process and tool name/location differences between legacy Design Tools and the new DesignPLUS Sidebar.
General
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Institutional Customizations Managed By | Primary Canvas Course | Primary Canvas Course |
Customizations by Sub-Account | Extended Canvas Course | Extended Canvas Course |
Accessibility Features Built In | Yes | Yes (see details below) |
Tools Themselves are Accessible | Yes | Yes |
Template Pages | Unlimited | Unlimited |
Content Themes
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Prebuilt Themes | Yes | Yes |
Banner Text Update Controls | Yes | Yes |
Select Banner image from course files | Yes | Yes |
Institutional banner image support | Yes | Yes |
Boilerplate Content
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Boilerplate Content Blocks | from customizations courses | from customizations courses |
Selection to Block button | Yes | Yes |
Navigation Block | Unlimited | 1-8 links |
Module List | Yes | Yes |
Teacher and TA User Details | Yes | Yes |
Dynamic Elements
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Quick Checks | Yes | Yes |
Accordions | Yes | Yes |
Tabs | Yes | Yes |
Expander | Yes | Yes |
Modal Dialogs | Yes | Yes |
HTML Snippets (core) | Yes (note: some snippets (dividers, image w/ caption, callouts) have been separated into individual tools) | Yes |
HTML Snippets (custom) | Yes | Yes |
Tooltips | Yes | Yes |
Popovers | Yes | Yes |
Progress Bar | Yes | Yes |
Styles
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Advanced List styles | Yes | Yes |
Definition Lists | Yes | Yes |
Add/Change Border Styles | Yes - Advanced >> Style Editor tool | Yes |
Add/Change Padding | Yes - Advanced >> Style Editor tool | Yes |
Add/Change Margins | Yes - Advanced >> Style Editor tool | Yes |
Canvas Legacy Table Styles | Yes | Yes |
Canvas New UI Table Styles | Yes | Yes |
Add custom CSS to a course | Yes | Yes |
Color
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Color Picker | Yes | Yes |
Canvas Highlights and Emphasis Classes | Yes | Yes |
User customizable color palette | Yes | Yes |
Pull color palette from image | Yes | Yes |
Icons
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Canvas Icons | Yes | Yes |
Font Awesome Icons | Version 5.15.4 | Version 5.13.0 |
Objectives/Outcomes
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Bloom's Revised Taxonomy | Yes | Yes |
Institutional configured objectives/outcomes | Unlimited (Canvas content page) | Unlimited (Canvas content page) |
Sub-account level objectives/outcomes | Unlimited (Canvas content page) | Unlimited (Canvas content page) |
Rich Content Editor Views
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Labels | Pending | Yes |
Sections | Pending | Yes |
Browser | Yes - Accessibility Tools >> Preview Content | Yes |
App | Yes - Accessibility Tools >> Preview Content | Yes |
No Style | Pending | Yes |
Copy Existing Content
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
From current course | Yes | Yes |
By URL | Yes | Yes |
Institutional Templates | Yes | Yes |
In context help sections | Yes | Yes |
Images
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Fill content width | Yes | Yes |
Alt text input | Yes | Yes |
Float image left, right | Yes | Yes |
Center image | Yes | Yes |
Image Captions | Yes | Yes |
Links
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Add icon | Yes | Yes |
Canvas Button Styles | No | Yes |
Update Text and URL controls | Yes | Yes |
Accessibility Features
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
WCAG 2.0 Color contrast ratings | Yes - Accessibility >> Contrast Checker | Yes |
Heading structure check | Yes | Yes |
Image alt text | Yes | Yes |
Link check | Yes | Yes |
Math check | Yes | No |
Syllabus
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Institutional Policies | Yes, from customizations course | Yes, from customizations course |
Institutional configured objectives/outcomes | Yes, from customizations course | Yes, from customizations course |
Pull grade scheme from Canvas | Yes | Yes |
Support
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Integrated User Guide | Yes | Yes |
User feedback form | Yes | Yes |
Institutional support information | Yes | Yes |
Advanced HTML editor | Yes | Yes |
View the following accordions for detailed tool name and location differences.
Institutional Customizations
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
DesignPLUS configuration options | [Account Settings] page in primary customizations course | Customize account-level JS |
Institutional Customizations Managed By | Primary Customizations Course | |
Customizations by Sub-Account | Extended Customizations Course | |
Shared Customizations | Yes, enable in a customizations course | |
User-level Customizations | Yes, enable in User Favorites, Saved User Styles, and [Customizations] pages in current course | – |
Accessibility Features Built In | Yes | Yes (see details below) |
Tools Themselves are Accessible | Yes | |
Template Pages | Prepend [Template] to page title in customizations course | |
Institutional banner image support | Unlimited, from customizations course files or [Banner Images] page (external image hosting optional but no longer required) | Unlimited, from customizations course [Banner Images] page only |
Institutional Policies | Prepend [Policies] to page title in customizations course | |
Institutional configured objectives/outcomes | [Objectives] page in primary customizations course | |
Sub-account level objectives/outcomes | [Objectives] page in extended customizations course | |
Institutional HTML snippets | [HTML Snippets] page in primary customizations course | |
Create custom icon categories (note: this is NOT the ability to add custom icons) | [Icons] page in primary customizations course | – |
Institutional question stems | [Questions] primary customizations course | – |
Syllabus templates | Prepend [Syllabus][Template] to page title in customizations course | |
Create saved institutional styles | Yes, on [Quick Styles] page in primary customizations course | |
Default sidebar color palette | [Color Palette] page in primary customizations course | |
Custom tutorials to load in sidebar | Duplicate or import the Cidi Labs Tutorial Template and prepend [Tutorial] to the new page title in primary customizations course | |
Custom user guides to load in sidebar | Prepend [Guide] to page title in primary customizations course | |
Institutional content block templates | [Content Blocks] page in primary customizations course | |
Institutional custom themes | [Themes] page in primary customizations course | |
Live CSS editing | [CSS Preview] page in primary customizations course, or prepend [CSS Preview] to page title in any course | |
Customize support contact information | [Support] page in primary customizations course |
Create/Edit Content
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Content Blocks | Add tab >> Content Block | Add Content Blocks button |
Content Block Icons | Edit tab >> Text | Add/Rearrange Content Blocks area |
Convert content to Content Block | Yes, highlight content and select Content Block tool from Add tab | Yes, highlight content and click Selection to Block button |
Prebuilt Themes | Add tab >> Theme | Choose a Theme |
Banner Text Update Controls | Edit tab >> Banner Title | Customize Banner Text |
Select banner image from course files | Image >> Select Banner Images folder | Choose a Banner Image |
Add or update Navigation Block | Edit tab >> Link Grid or Link List | Add/Edit Navigation Block |
Course content links | Course Links; Content Shortcuts | Course Content Links |
Rearrange content | Overflow More menu >> Arrange Content | Add/Rearrange Content Blocks area |
Copy Existing Content
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
From current course | Template Content >> Course Content | Copy Existing Content >> All Course Pages |
By URL | Template Content >> Import by URL | Copy Existing Content >> Copy Content by URL |
Institutional Templates | Template Content >> Templates | Copy Existing Content >> Institution Templates |
Add Advanced Elements
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Module List | Module List | |
Teacher and TA User Details | User Details | Teacher & TA Details |
HTML Snippets (core) | Snippets | |
HTML Snippets (custom) | Snippets | |
Tooltips | Tooltip | Popup Content |
Popovers | Popover | Popup Content |
Module Progress Bar | Progress Indicator | Module Progress/Navigation |
Canvas Icons | Icon | Icons |
Font Awesome Icons | Icon | Icons |
Objectives/Outcomes | Objective | Objectives/Outcomes |
Objectives/Outcomes - Bloom's Revised Taxonomy verbs | – | Objectives/Outcomes |
Editor-only instructions | Action Item (7 tools, one for each Action Item type) | Key Action Items |
Ungraded quiz questions | Quick Check | |
Definition List | Description List | |
Embed content in editor | Embed | Embed Content |
Add custom CSS to a course | Advanced tab >> Custom CSS | Custom CSS |
Bootstrap callouts | Callout | HTML Snippets > Callout (various) |
Block alerts | Callout | HTML Snippets > Block Alert (various) |
Dividers | Divider | HTML Snippets > Divider (various) |
Insert columns | Table > Content panel - Table to Columns button | HTML Snippets > Column (various) |
Blockquote | Snippets | HTML Snippets > Blockquote |
Insert code | Snippets | HTML Snippets > Code (block) or Code (inline) |
Insert preformatted text | Snippets | HTML Snippets > Preformatted text |
Insert estimated content read time | Read Time | – |
Customize the Style
Feature | New DesignPLUS Sidebar |
Legacy Version |
---|---|---|
Advanced List styles | List: Ordered or List: Unordered > Advanced Style panel | Ordered/Unordered List |
Add/Change Border Styles | Advanced tab >> Style Editor tool | Current Element Style >> Borders |
Add/Change Padding | Advanced tab >> Style Editor tool | Current Element Style >> Spacing |
Add/Change Margins | Advanced tab >> Style Editor tool | Current Element Style >> Spacing |
Canvas Legacy Table Styles | Table > Style panel | Current Element Style >> Table Header/Footer/Style |
Canvas New UI Table Styles | Table > Style panel | Current Element Style >> Table Header/Footer/Style |
Color Picker | Advanced tab >> Style Editor > Colors | Colors - Basic or Colors - Advanced |
Canvas Highlights and Emphasis Classes | Text Highlight | Text Highlights/Emphasis |
User customizable color palette | Advanced tab >> Style Editor > Colors | Customize Color Palette |
Pull color palette from image | Advanced tab >> Style Editor > Colors | Customize Color Palette |
Advanced HTML Editor | Advanced tab >> Advanced Editor | Advanced HTML Editor |
Images
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Fill content width | Image > Style panel | Current Element Style >> Image Size/Position/Style |
Alt text input | Image > Content panel | Current Element Style >> Image Size/Position/Style |
Float image left, right | Image > Style panel | Current Element Style >> Image Size/Position/Style |
Center image | Image > Style panel | Current Element Style >> Image Size/Position/Style |
Image Captions | Image > Content panel or Image & Caption tool | HTML Snippets > Image with Caption (various) |
Image with link | Image > Content panel - Add Link button | Select image and use Canvas toolbar link tool |
Image border styles | Image > Style panel > Border Options panel | Current Element Style >> Image Size/Position/Style |
Change image | Image > Content panel > Change Image panel | Select image and use Canvas toolbar image tool |
Links
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Add icon | Link > Content panel - Icon picker button | Current Element Style >> Link/Button - Button/Link Icon |
Canvas Button Styles | Link > Style panel or Button tool | Current Element Style >> Link/Button |
Update Text and URL controls | Link > Content panel | Current Element Style >> Link/Button |
Accessibility Features
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
WCAG 2.0 Color contrast ratings | Accessibility / Usability tab >> Contrast Checker | Current Element Style >> Colors - Basic or Colors - Advanced |
Heading structure check | Accessibility / Usability tab >> Heading Checker | Check Accessibility >> Heading Outline |
Image alt text | Accessibility / Usability tab >> Image Alt Checker | Check Accessibility >> Image Checker |
Link check | Accessibility / Usability tab >> Link Checker | Check Accessibility >> Link Checker |
Math check | Accessibility / Usability tab >> Math Checker | – |
Usability Features
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Upgrade legacy content | Accessibility / Usability tab >> Upgrade | – |
Check/import external course assets | Accessibility / Usability tab >> External Assets | – |
Preview content | Accessibility / Usability tab >> Preview Content | View buttons (below Jump menu) |
Syllabus
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Pull grade scheme from Canvas | Grading Scheme | Create/Edit Syllabus Content > Canvas Grading Scheme |
Add institutional policies | Policy | Create/Edit Syllabus Content > Institutional Policies |
Syllabus template blocks | Content Block > Content panel > Syllabus Template Blocks panel | Create/Edit Syllabus Content > Add/Rearrange Syllabus Blocks |
Support
Feature | New DesignPLUS Sidebar | Legacy Version |
---|---|---|
Integrated User Guide | Help / Tutorials tab >> Cidi Labs User Guide | Get Help >> User Guide |
User feedback form | Help / Tutorials tab >> Cidi Labs Support | Get Help >> Comments/Suggestions/Bugs |
Institutional support information | Help / Tutorials tab >> Local Support | Get Help >> Support |
In context help sections | Yes, information button in tool heading | Yes, at bottom of each tool |
Tutorials | Help / Tutorials tab >> Local Tutorials or Cidi Labs Tutorials | – |
Tool Walkthroughs | Help / Tutorials tab >> Walkthroughs | – |
The following list shows the new features added in the new DesignPLUS Sidebar.
- Upgrade Legacy Content
- Content built using legacy Design Tools can be upgraded in a few clicks via the new Sidebar.
- Tutorials
- Build and insert tutorials from customizations courses.
- Course Level Customizations
- Any pages that can be defined in a customizations course can be added at a course level.
- Import Images
- View images in the Canvas files of customizations courses and import them into the current course. Also, any images on a page linked to other courses can be imported and updated with the External Assets tool.
- Import External Files
- Any files on a page that are sourced outside of the current course can be imported using the External Assets tool.
- Custom Button Styles
- Adjust size and color, including on different states like hover, using the Button tool.
- Questions
- Similar to Objective tool, host a list of pre-written questions that can be dropped into discussions instructions.
- Math Checker
- Suggests alt text for LaTeX and Canvas equation editor expressions
- Read Time
- Add an estimated read time at the top of the page for longer content pages.
- Canvas Shortcuts
- Insert buttons on pages. All: message teacher button; Group assignments/discussions: message group button, view group members; Graded, rubric discussion: view rubric button
- Separate Banner and Heading Styles
- Control the style of the top banner separately from the rest of the headings.
- User Level Styles
- Save styles to a user level.
- Set accordion/tab/expander heading level, styles
- Change to h2 through h6; adjust default, active, and hover colors.
- Import template page to top, bottom
- In addition to overwriting the page, you can also add template pages to the top or bottom of current content.
- Set heading level, position of content block
- You can choose to place content blocks at the top, bottom, or at cursor; heading levels h2 through h6.
- H1 option in banners
- You can now use an h1 heading in banners.
- Add images from folders, swap images
- Add images, select folders, courses; keep image styling but just change out source with Choose a Different Image button
- Link list styles
- Can select styles and place anywhere, not just in a navigation block.
- New editor action item types
- Additional types of key action items have been added.
- Create and save custom link grid
- Style link grid (nav block) and save to user level.
- Module list colors
- Adjust default, active, and hover colors.