YuleFrog Studios
Stay Curious
  • Home
  • Photography
  • Art of Beer
    • About Art of Beer
    • Supporting Cancer Research
    • Press Coverage
    • Press Releases
  • Instructional design
  • Technical writing
  • Video
  • Elizabeth Horn
    • Remembrance
    • Photo gallery
    • Eulogy
    • Photos for Ryan
  • Contact
  • Stay Curious

About IST 541: Multimedia Tools II: Interactive Media

From the course syllabus: "This course teaches the theory and practice of interactive media through the use of new technologies. Students will ... [complete] short exercises culminating in a final project. [They] learn how to use HTML5, CSS3, JavaScript, and jQuery in order to facilitate the design and development of effective instructional websites. Topics include embedding video and audio elements for media playback, new elements in HTML Forms and Form validation, image sliders, and local storage elements. By the end of this course [students] will be able to design and create interactive eLearning products that can be accessible from multiple devices, including tablets."

Labs

  • Lab 1: A web page that contains a procedural job aid
  • Lab 2: A procedural job aid using a jQuery accordion widget
  • Lab 4: Working with video, audio, and tables
  • Lab 5: Forms and local storage
  • Lab 6: Image maps, hotspots, and feedback using jQuery

Final project

My final project is a website that provides job aids and reference materials for technical writers. These materials are designed to assist writers as they complete tasks performed infrequently, such as adding page-level Help topics to a Help system or preparing content for publication. Techniques used in the website include:
  • Instructions with interactive elements, such as hover help and image swaps
  • Video and audio examples
  • Image maps with hotspots
  • jQuery elements, such as accordions and tabs
  • Menuing and navigational elements
Final project storyboard
Final project website
Powered by Create your own unique website with customizable templates.