Last edited by Travis Thurston 3 months ago

I have worked hard to create an interface that blends well with Canvas and is easy to use.

Here is an example of what it looks like to use the tools while editing a page. I have added everything in the "USU Tools" tab to facilitate course development.

You can look through the screenshots below or proceed to the Examples page to see what some of the added elements look like.

Interface-wholeWindow.png

Screenshots

Scroll down to see examples of each section.

 Section  User Interface Screenshot

Themes

  • Themes can be changed at any time.
  • New themes are easily added to the code.
 Wiki-Themes Interface

Sections

  • A variety of boilerplate sections (Check to add, uncheck to remove)
  • Ability to add new sections easily
  • Drag and drop to reorder sections
  • Use Bloom's Revised Taxonomy to customize objectives.
 Sections Interface

Accordions | Tabs 

  • Easily add accordion or tabbed panels
  • Drag and drop to reorder
 Accordion InterfaceTabs Interface

Advanced Lists 

  • Customize ordered or unordered lists
  • Create horizontal or vertical definition lists
  • Add icons to any list item
 Advanced Lists InterfaceDefinition Lists Interface

Borders and Spacing 

  • A variety of border, padding or margin options that can be applied to the parent paragraph/heading or to the parent div.
 Borders and Spacing Interface

Buttons

  • 8 button styles that can be applied to any existing link
  • 4 size options
  • Buttons can be customized further with icons
 Buttons User Interface

Highlights | Alerts | Emphasis 

  • Block alerts can be applied to existing paragraphs or DIV's
  • Inline Emphasis can be applied to selected text
 Block Highlights and Alerts User InterfaceInline Highlights and Alerts User Interface

Popup Content | Read More 

  • Easily add modal dialogs, tooltips and popovers
  • Select a long block of text and use the read more to collapse it until the reader clicks "Read More"
 Modal Dialog User InterfaceTooltips and Popovers User InterfaceRead More User Interface

Progress Bar

  • Easily add/update the percentage of progress through a course
  • 4 style options
  • 4 height options
  • Optional label
 Progress Bar User Interface

Tables

  • Create, edit or style a table
  • Add headings
  • Make a table sortable
  • Add/Remove columns or rows
  • Choose from 4 predefined styles
  • A choice of 4 emphasis colors to apply to a row
Create Table User InterfaceEdit Table User InterfaceStyle Table User Interface

Quick Check

  • Assess student understanding within a wiki-page
  • Ungraded
  • Provides feedback based on selected answer
  • Hides "Next" page link unless answered correctly
Quick Check User InterfaceQuick Check User Interface