(Floe) OER Commons authoring tool styling & interactions

Owned by Former user (Deleted)
Last updated: Dec 20, 2012Version comment

Also see:
> Final Designs
> Walkthrough
> Keyboard Interactions

bolded text indicates important

input fields

  • larger drop-down menus in Describe Step
  • instructions wrap in Abstract box, resizing text box disabled, text box resizes vertically automatically as end is reached
  • instructions inside learning goals input fields "Add a new learning goal", instructions inside keyword input fields "Add a new keyword"
    > new input field is added below when user starts typing

text styling

  • larger paragraph text 16pt (1.3em?)
  • sans serif subheading
  • text style naming consistency with TOC
    > header to heading
    > Sub-header to subheading

insert media

  • if user has not added a caption to the image, add a prompt saying "Please describe this image in a few words" that can be edited beside the image name
  • change checkmark image to a submit button

username

  • underline on hover

toolbar

  • text formatting buttons (bold, italicize, highlight..) should be active when nothing is selected, formatting is applied to new text following the cursor, or a word if the cursor is in the middle of a word

table of contents

  • new heading not be added until something is typed
    > Add Heading remains faded into the background until user begins typing

tab order - write step

  • OER Commons Logo
  • Click to edit title
    > when title is focused typing would begin editing the resource title
    > if there's already a title, text is inserted at the end
  • Save
  • Preview
  • username
    > after opening username menu, arrow keys allow scrolling through items
  • write, describe, submit
    > current step out of the tab-order
  • toolbar
    > arrow keys allow scrolling through buttons (side to side, in and out of a menu
    > open table menu skips squares, going straight to the input fields
    > add colours in in highlight and text-colour menus in tab order
    > pressing enter on link & footnote button, opens and put focus on menu
    > add insert media inputs to tab order
    > disabled buttons out of tab order
  • table of contents
    > cursor when heading is selected is at the end
    > when "Add Heading/Subheading" is focused, typing should begin adding the heading
  • content
    > selecting text in content area and focusing out, maintains selection
    > tabbing in and out of the content should go to the last place the cursor was on
  • next step
  • return to top

tab order - describe step

  • top order same
  • edit existing learning goals and keywords in tab order
  • deleting a learning goals, keywords, grade level, or material type, puts focus on next item
  • pressing enter on drop-down opens it
  • pressing enter on check-boxes checks/unchecks them
  • bottom order same

tab order - submit step

  • top order same
  • blue outline on focus styling of radio buttons
  • pressing enter on radio buttons selects/deselects them
  • add edit username menu in tab order
  • bottom order same

general

  • tabbing or clicking out of the menu close