A common UI Flash-based framework that integrates single source XML content files and screen animation files to render a web browser deployed product tour.
Original Publication Date: 2009-Dec-14
Included in the Prior Art Database: 2009-Dec-14
Users want visually rich, interactive information. This is especially true when users are learning a product or a solution for the first time and need to obtain a conceptual overview of it, prior to using the product or solution. In another case, the user may want to use interactive tutorials to guide them through the steps of some installation scenarios and requirements, instead of text based heavy help documentation lacking effective and supporting visuals. At present, there is no simple or easy way for writers to provide such visually rich, interactive tours or tutorials, while also addressing accessibility and globalization requirements. Macromedia Flash is one tool that offers the capability to create visually rich, interactive information. However, few writers have access to Flash and/or the time and skills required. Even if writers use Flash they will face a significant learning curve. Arguably, writers should be free to focus on the content and not the tools. The Product Tour Template is a system of Flash and XML based templates that information development professionals can use to create interactive tutorials, product tours or overviews without knowledge of, or access to, Macromedia Flash. The templates produce tours that can be launched independently from a web page, and/or can be run within a window of an application such as online help systems. The Product tour/overview Flash (SWF) and XML templates will: allow writers to specify the content of the tour/overview by editing an XML file, use XML to provide a menu to navigate to various sections, support localizable content, support accessibility standards by invoking screen readers, support both text and non-text information (eg. static or animated concept diagrams, screen animations, and screen captures) in the content area, support voiceover content, support self-running and user controlled interaction, support elapsed time and total time, address the trend to product componentization by allowing the writer to easily combine multiple tours/overviews into a larger tour/overview, and significantly reduce the time and resources required to build tours/overviews.
A common UI Flash-based framework that integrates single source XML content files and screen animation files to render a web browser deployed product tour .
The Tour Container and Package:
The tour container is programmed to gather information and content from a set of external files and then load, index and assemble them at run time. It is these external files that are edited by the content author. The external files consists of text based files and media assets such screen animations. The text based files can be either XML and HTML which the author can edit using any standard XML or HTML editor. The screen animations can be captured and edited using a wide range of tools such as Camtasia and ViewletBuilder. The files that the tour author can edit and modify are:
tour.html - the file that launches the tour and holds some tour specific values.
country codes for supported languages
tour.css - the file that specifies the style classes used in the container (can be optionally edited).
multiple (14 in the example below) different language version folders (V2.1 tour templates supports all
Group 1 and some Group 2 languages). Each language folder contains: tour
controls.xml - the files used to customize user controls and translate navigation control hover help
compNN.xml files - the source files that contain all the text that defines the tour. compNN.swf files - the tour author's animated screen recording files
XML files for use by screen readers for the visually impaired.
This diagram illustrates the relationships between all the files and the final product tour interface elements:
The User (content author):
To assemble a product tour the user will do the following:
Unzip the embedded
Delete any language folders they don't intend to support in the file structure and remove them from
the language list in the tour
Also in the tour
toc.xml - the file that determines the range of components to be include, and contains the list of
_name.html - sample accessibility file
kit.zip - files used to generate an HTML version of the product tour
_toc.xml file, edit the media poin...