Design Tools Resources for UF Faculty and Staff

Welcome to Design Tools

Citilabs page header

Design Tools Resources for Faculty and Staff

Landing Image, a computer

Design Tools Tour

Welcome to Design Tools

Using Design PLUS will improve the quality, consistency and accessibility of your course content while enabling you to do more in less time. You will encounter tools such as the rich content editor tools, the Multi-tool, and the Upload/Embed Image Tool that will help you add functionality to your course quickly and with ease.

Watch the Introducing the Design Tools video to get to know the interface and learn about the additional functionality Design Tools allows in any Front, Content, Discussion, Assignment, and Syllabus page in Canvas

 

 

 

 

Launching Design Tools

Launching Design Tools

You can launch the Design Tools from content pages, assignments, discussions, announcements, or the course syllabus.

To launch the Design Tools, follow these steps:

    1. Open the Canvas course.
    2. Navigate to the content you wish to edit.
    3. Click Edit.

      Edit Content Button

    4. On the Edit page, in the top right corner, click the Launch Design Tools button or use the keyboard shortcut Alt+Shift+D.

      Launch Design Tools Button

 

 

What Design Tools Can Do

What design Tools can do

Using Design Tools, you can easily customize the content of Front, Content, Discussion, and Assignment pages. The following list describes some of the things you can do to customize your content:

  • Style content with predefined themes.
  • Insert boilerplate sections and content.
  • Duplicate existing content pages. 
  • Apply styles from the Canvas Style Guide including:
    • Accordions and Tabbed content.
    • Buttons.
    • Modal windows.
  • Adjust element colors, borders, margins and padding.
  • Add icons.
  • Customize links, headings and lists.
  • Write objectives and other content supported by Bloom's Revised Taxonomy.
  • Run an accessibility check on a course page.

 

The Design Tools Menu

The Design Tools menu displays the available tools in an accordion view.

Element Description
Jump Menu Tools jump menu
Shortcuts to jump to a specific section based on the currently selected element in the editor.
Editor View Tool view controls
Selects the Labels, Blocks, Browser, Mobile App or No Style view.
Create/Edit Content Create and theme basic content.
Customize the Style Adjust colors, borders, spacing and a variety of other visual aspects of your content.
Add Advanced Elements Includes a variety of elements like Accordions, Modal Dialogs, Objectives/Outcomes help, etc.
Check Accessibility Review heading structure, image alt text and links for accessibility concerns.
Get Help Find training and feedback resources.
Advanced HTML Editor

Advanced HTML Editor Button

Dig into the HTML for your content.

Ace HTML Editor

 

 

UF Footer