Walkthru Slide Creation

Walkthru Slide Creation

The following are the steps necessary to generate a slide in the requirements walk-thru. There are three files involved in the slide creation process. For explanation purposes here, the slides will have the same root filename "X". The files are the following:

requirements/mockups/UID/X.html -- the hand-built HTML file that is the screen image to be shown in a slide
requirements/images/X.png -- the image captured from the mockup X.html file
requirements/walkthru/X.html -- the slide as it appears in the walkthru; this X.html has the navigation links, explanatory blurb, and links to the slide screen image in images/X.png

As of 17oct11, there is no consistent naming convention for these three files. The naming convention followed here is to use the same root file name for all of them.

Here are the specific steps to create these files:

Create or edit the HTML file in requirements/mockups/UID/X.html, where UID is your user id. By convention, mockup HTML files are stored in subdirectories named with user id. Again, "X" is the root name of the slide file we're creating or editing. X.html in the mockup directory is the raw HTML image content for a slide.
Goto the requirements/mockups/HTML\ Template directory.
Copy the entire Tempus\ Layout_files subdirectory and the Tempus\ Layout.html file to a working dir, and go to that working directory.
A quick way to "install" X.html into the Tempus Layout is to rename X.html to samplePage.html. The samplePage file is the name that is src included in Tempus\ Layout.html. Alternatively, the included file name in Tempus\ Layout.html can be changed to X.html.
Open Tempus\ Layout.html in a Chrome browser, ignoring the Web Toolkit error message. As of 17oct11, using Chrome is necessary since Firefox has problems with sizing, and Safari has problems with fonts in the template.
Capture the screen image displayed in the browser as a png and store in X.png. Copy or move X.png from your working directory into requirements/images.
To create the actual slide, copy requirements/walkthru/template.html into requirements/walkthru/X.html.
Edit the content of the slide file as follows:
1. Make the Next and Prev links point to the proper slides.
2. Link to the captured image in images/X.png.
3. Write the blurb.
4. Fix the title.