DemoMate Blog: Create Tutorials and Software Demos

DemoMate Enhancements - June 2011

2011-06-23T10:47:00.000-07:00

The DemoMate Team is proud to announce that a new version has been released (Version 1.4) introducing a number of new features, including Fast Capture Mode, and a new design control called Step Delay! Take a look:

Fast Capture Mode: Now there is a convenient new way to capture demos! With the new Fast Capture Mode (available in the Options menu), the demo capture speed is accelerated, and DemoMate automatically captures hover states for you. With Fast Capture Mode, you no longer need to tap the Left Control button to capture the hover states that add realism to your demos. If and when you need extra precision, you can still tap Left Control to capture your own hover image.

Three Convenient Capture Modes: In the Options menu, you can now easily switch between Fast Capture Mode, Manual Capture Mode, and Custom Capture Mode. With the Custom Capture Mode, you can manually configure the Automatic Hover Capture and Capture Speed settings. Try out the different mix of settings that works best for you!

Step Delay: As requested by the community, this new control lets you slow down or speed up any step in your demo. For example, if a step contains a lot of text for your viewer to read, you might slow down the step by adding a second or two of delay. Conversely, if you want to create a simple animation – such as the rapid movement of a progress bar – you can accelerate the rate at which steps appear by choosing a value less than one second. You can adjust Step Delay settings down to tenths of a second.

Text Box Font Sizes: As requested by the community, we have now added support for 13-point fonts to the Text Entry Box.

Remove Hover Image: As requested by advanced users, you can now remove the hover image for a step by right-clicking on a step, and selecting the Remove Hover Image option.

General Maintenance: We’re also shipping numerous general performance enhancements including refinements to the Click Instruction Bubble scaling algorithm, support for carriage returns in the Click Instruction Bubble Text, refinements to how a demo can be advanced after pressing Pause, updates to the Options menu layout, updated help text, and general maintenance.

DemoMate Enhancements - March 2011

2011-03-11T13:53:00.000-08:00

The DemoMate Team is proud to announce that a new version has been released (Version 1.3) introducing a number of new features, including rich text formatting, a new look for talking points, and new ways to make collaboration easier! Take a look:

DemoMate Tutorial:

Rich Text Formatting

Rich Text Formatting: Now you can add Bold, Underline, and Italic formatting to the on-screen text in your demo! As you apply formatting to Click Instructions and Talking Points in the editor, the formatting changes are immediately reflected in the Click Instruction bubble.

Rich Text Formatting also displays elegantly in the Talking Points Pane within all DemoMate Players. The Client, Silverlight, Embeddable, and Auto-Run players have all been updated. All available Pane orientations have also been updated, including Floating, and Docked Right, Left, Top, or Bottom.

New Look for Talking Points: We’ve updated the look of the Talking Points when they appear on-screen – they match the glossy blue gradient look of the Click Instruction Bubble, creating a smooth, consistent experience.

Enhanced Collaboration: As requested by the community, multiple authors can now alternately collaborate on a DemoMate file without needing to package the file for distribution between users – even if the file is on a shared network. Simply select File=>Open from any licensed copy of DemoMate and Browse to the .demo file.

Longer Section Names: As requested by the community, section names no longer have a fixed character limit.

Presenter Mode Update: On steps with no click instruction, pressing TAB to display the click cue now displays a generic “Click Here” bubble.

General Maintenance: Client Player updates, New splash screen for Presenter Versions, revisions to Presenter Version features, updated help text, ongoing performance optimization.

DemoMate Enhancements - November 2010

2010-11-19T11:03:00.000-08:00

The DemoMate Team is proud to announce that a new version has been released (Version 1.2), introducing a number of new features, including a step fade effect, rotatable click bubbles, and a new splash screen. Take a look:

DemoMate Tutorial:

November 2010 New Feature Demo

New Splash Screen: The first thing you'll notice is the new DemoMate "Splash Screen." Now, the DemoMate application launches in a new way, with new options to choose from to help you save time, and delight your customers with your work.

WYSIWYG Editing Experience: Once inside DemoMate, you'll notice a new look and feel within the DemoMate editor. Based on feedback from the DemoMate Community, we've updated the shape and behavior of the Click Instruction bubble inside the editor, so it accurately reflects the experience your viewers will see, and gives you more design control at a greater level of detail. This size and color of the click bubble matches what customers see in play mode, and you can now freely rotate and move the click instruction bubble to place it exactly where you want it to appear.

Step Fade Transition: As requested by the DemoMate Community, you will notice a new step control is available in the Editor, called a Step Fade. By selecting this option, you can add a "Fade-In" effect to any step of your demo, allowing you to create a graceful transition between steps or sections.

Dramatic Performance Enhancements: When you're ready to package or publish your demos, you will certainly notice the dramatic new performance enhancements our technical team has delivered for you. Packaging speeds are literally ten times faster in this new release than they were previously ... with these time-saving enhancements, demos that once took minutes to package or share, now take seconds.

Event Logging for Scripting and Analytics: As requested by our more technical customers and partners, we've made available a complete set of Event Logging Options that can accommodate advanced Analytics and Scripting. For example, you can now track when a given demo begins and ends, enabling you to pull reports or create sequential events on your website. To view the documentation on this new capability, click here. Developers can also follow us on Twitter to receive alerts whenever new content is posted.

General Maintenance: New “Cue Type” selector in Options Menu, improved ESC and Left CTRL key performance in Windows 7 environments, increased font size in Click Instruction Bubble, updated Help Text, various other enhancements.

Implementing DemoMate Event Logging

2010-11-18T11:00:00.000-08:00

The DemoMate Silverlight Tutorial Player has support for reporting events to the host HTML page, allowing for dynamic, interactive pages based on the progress of the tutorial. This support is in beta form and is subject to change; please contact DemoMate support if you have any questions or concerns about the behavior of the Tutorial Player when Scripting Support has been enabled.

Packaging Your Tutorial

Before you can enable scripting support, you must first package your demo as a Tutorial. Both the “Multiple Files” and the “Single File” Output options support scripting. The “Single Executable” option is not Silverlight based, and thus cannot be used for scripting.

Writing Your Scripting Functions

The packaged Tutorial contains a simple sample HTML file that demonstrates how the XAP file should be embedded into a website. You can use this file as a starting point for your own design. Before you can enable Scripting Support, you must write two functions that will be used by the Silverlight Tutorial Player to report events to your host HTML page.

The <object> Tag

The tag in the sample HTML file places the Silverlight Tutorial Player on your web page. In order to register for Scripting Events, you’ll need to make two changes to the sample code as indicated:

The sections indicated in italics are the additional changes. There are two settings that are important in the next steps:

The id attribute: this can take any value, and is used to identify the Silverlight Tutorial Player when registering to receive events.
The value attribute of the onLoad parameter: This attribute can also take any value, and is used to tell the Silverlight Tutorial Player what function to invoke to allow your code to register for additional events.

Both of these attributes are used in the section “Registering to Receive Events”, below.

The Event Handler

The event handler function takes the form:

function trackTutorialEvent(tutorialPlayerObject, tutorialEvent)
{
var eventAction = tutorialEvent.EventName;
var tutorialName = tutorialEvent.TutorialName;
var tutorialId = tutorialEvent.TutorialId;
// Your event handling code:}
}

This event handler is later used in the section “Registering to Receive Events”, below.

The arguments to this event handler are:

tutorialPlayerObject: This is an opaque reference to the Tutorial Player Engine. At this time it has no supported attributes for inspection.
tutorialEvent: This object represents the event being emitted. Possible attributes are:
- EventName: The name of the event being emitted. The current supported values are “TutorialBegun” and “TutorialCompleted”. There may be other events emitted that are unsupported at this time.
- TutorialName: The name of the tutorial that generated the event.
- TutorialId: A unique Id for the tutorial.

Registering to Receive Events

Once you’ve written an event handler that does what you want, you can register your event handler with the Silverlight Tutorial Player. This function takes the form:

function tutorialLoaded()
{
var tutorialPlayer = document.getElementById("myTutorialPlayer").Content.TutorialPlayer;
tutorialPlayer.TutorialEvent = trackTutorialEvent;
}

This function loads the tutorial player object from the DOM and registers the TutorialEvent event handler that we previously wrote. Note:

The name of the function must match the value attribute of the onLoad parameter added to the object tag
The argument to getElementById must match the id attribute of the object tag.
The value assigned to TutorialEvent must be the name of the event handler function.

Questions

Contact DemoMate Support at support@demomate.com or your Impresys Corporation representative for further information regarding this feature.

Merge / Insert Demos Captured at Different Screen Resolutions

2010-11-18T10:37:00.000-08:00

We’ve heard from customers that the ability to merge demos is an important capability of DemoMate that allows them to append and combine demo assets that have been captured separately. In some cases, however, the demos in question were captured at different screen resolutions, and won’t combine.

What to do?

Here’s a quick solution.

Simply resize the screenshot images from one demo to match those of the other -- using an image resizing tool. Programs like SimpleSizer, available from FileBuzz, let you resize images in bulk so you can adjust all the screenshot images in one demo to match the size of those in another demo. For example, let’s say you have a demo with screens captured at 1280x1024 and another at 1024x768, and you want to merge the two. Use SimpleSizer to resize the 1280x1024 images down to 1024x768, and then merge the two demos. Please note that this process has limitations — resized screenshots will blur slightly and the relative size of objects on screen will be different for the two demos. However, for some purposes, the result may be sufficient and justified by the time and effort you’ll save by not having to recapture an entire demo.

SimpleSizer can be downloaded from http://www.filebuzz.com/fileinfo/30118/SimpleSizer.html. Simply point the application at the demo assets folder for the demo you want to resize (make sure to have it search subfolders) and specify the new size for your screenshot images. Once you have resized the images, merge the two demos by inserting one into the other.

DemoMate Enhancements - July 2010

2010-07-07T16:50:00.000-07:00

The DemoMate Team is proud to announce that the latest version has been released (Build 1078), introducing a number of new features, and a major new enhancement: “Video Boxes.” Take a look:

DemoMate Tutorial:

Video Boxes Demo

Video Boxes: Now you can add video to your demos! Video Boxes are a great way to add a “Wow Factor.” DemoMate Video Boxes let you embed any video created in the Windows Media format (.wmv). You can use Video Boxes to simulate streaming video in an application or through the web, conducting video chats, and more. You can also use Video Boxes to add animated intros to your demos, such as an exported 3-D effect. Other great uses are to embed a customer testimonial video, or a few words from a key executive. Video Boxes are flexible/resizable, and can be set to play automatically, or on demand.

Video Boxes Supported in all Playback Modes: Video Boxes are supported in all DemoMate playback modes, including Preview, Present, all embeddable Silverlight Players, the “Click-to-Run” .EXE Player, and the hosted Player on DemoMate.com.

Simulated “Drag and Drop”: We have updated Presentation mode so that when you click and drag the mouse cursor, a new cursor is displayed that increases realism.

Highlight Boxes on Demo Scripts: Highlight Boxes are now displayed on exported scripts, making it even easier to use your demo scripts as training materials in hands-on labs.

Turn Mouse Pointer On / Off: As requested by the community, you can now Turn Off the Mouse Pointer on any step. This is helpful when you are displaying presentation graphics or video.

Keyboard Shortcuts: As requested by the community, we have added keyboard shortcuts to DemoMate for many commonly used commands. Please check the DemoMate Help available in the client for a complete list of shortcuts.

Fewer times to “Make an Editable Copy”: As requested by the Community, DemoMate no longer locks demos for editing when you press “Present.” This will significantly reduce the number of situations where you will be prompted to “make an editable copy” of a demo you are creating.

Increased Tutorial Font Size: As requested by the Community, we have increased the font size in the script pane of the Tutorial Player to make on-screen scripts more readable.

Ongoing Optimization: The process of packaging stand-alone auto-play demos as .EXE files (from the Package Tutorial option) is now 400% faster. The packaging process for Installers has also been optimized.

General Maintenance: Various enhancements.

Set Silverlight Tutorials to 100%

2010-07-06T13:42:00.000-07:00

When working with DemoMate Silverlight Tutorials, you can set them to expand automatically to fill all available browser space by changing the Height and Width parameters in the OBJECT embed HTML that is generated by DemoMate as part of the packaging process. Simply change the default values for both Height and Width to 100%, and your tutorial will automatically expand when launched.

New DemoMate Shortcut Keys

2010-07-05T09:39:00.000-07:00

Here’s a quick summary of the new Shortcut Keys available in the newest DemoMate release (Build 1078):

CTRL + N: New Demo
CTRL + O: Open Demo
CTRL + W: Close Demo (also CTRL + F4)
CTRL + S: Save Demo
F1: Help
F4: Preview Demo
F5: Present Demo
F6: Play Demo
F9: Capture Demo
DELETE: Delete Step

DemoMate Enhancements - April 2010

2010-04-05T11:50:00.000-07:00

The DemoMate Team is proud to announce that the latest version has been released (Build 1020), introducing a number of new features, and a major new enhancement: “Guided Steps.” Take a look:

DemoMate Tutorial:

Guided Step Tutorial

Here are all the new and enhanced features in the latest release:

Guided Steps – Teach the world how to use your software! By adding Guided Steps to your demos, you can create interactive training sessions that combine both auto-play content with interactive steps where the user clicks the mouse or enters text to move forward.

Guided Labs - At events, you can now use DemoMate to create “Guided Labs,” offering a delightful experience to your customers and prospects, and a cost-effective compliment to traditional “Hands-On Labs.” Because you create these labs in DemoMate, the same content can be instantly available on-site, distributed as a take-away, or hosted online for those unable to attend. We created this “Guided Lab” logo you can use. To download, just click here, or on the logo below.

Guided Support on all DemoMate Players – You can easily deploy Guided Tutorials and Guided Labs to your training and support portals. Guided Steps are supported in all DemoMate Players, including all embeddable Silverlight players, the “Click-to-Run” .EXE player, and the hosted player on DemoMate.com.

Jump Boxes Active in all Tutorial Players – Now you can add user-directed navigation to your Guided Tutorials. Jump Boxes are now supported on all DemoMate Players, including all embeddable Silverlight players, the “Click-to-Run” .EXE player, and the hosted player on DemoMate.com. In addition to in-demo navigation, this enables users to link to external content, such as websites or hosted documents.

Hover States Display in all Tutorial Players – As requested by the community, "hover states" are now supported on all DemoMate Players, including all embeddable Silverlight players, the “Click-to-Run” .EXE player, and the hosted player on DemoMate.com. Just press Play and you will see the difference - providing maximum realism!

Highlight Boxes – As requested by the community, you can now place a Highlight Box (a rectangular red frame) on any step. This can be a great way to call attention to a potion of the screen that is discussed in your presenter script or audio track.

Open Asset Folder – As requested by the community, we’ve added a new right-click context item to the Step Menu that will open the asset folder for that step in Windows Explorer, making it easier to edit demo screenshots when necessary.

Informative Progress Bars – As requested by the community, new Progress Bars appear when packaging demos that include the estimated time remaining.

General Maintenance – Ongoing file-size optimization, performance optimization, refinement of the Control Bar pop-up in all tutorial players, Animated Click Beacon now displays elegantly in all tutorial players. IPL (1017, 1018)

Adding Text Boxes to Your Demo

2010-04-01T10:26:00.000-07:00

As part of our most recent release of DemoMate, we introduced text boxes, which allow you to simulate typing into text fields during your product demonstrations. In addition, text boxes will automatically animate typing text in during an auto-play demo, making your online tutorials more realistic.

Click below to learn how to work with text boxes in DemoMate:

DemoMate Tutorial:

Capturing and Creating Text Boxes

You can add a text box control to a demo step by clicking the Add Text Box button. Clicking this button will place a new text box (shaded orange) on the screenshot for the current step, which can then be dragged and resized to be positioned over the field where you want to simulate typing. You can then type whatever text you want to display directly into the text box field, and even adjust the font type and size. Each step can have a single text box control placed on it.

When you arrive at a step with a text box control while presenting your demo, you’ll be able to simulate typing on your keyboard, while the pre-defined text string types itself in with each key pressed. The actual text you type on your keyboard doesn’t matter, because the text that will be displayed has already been defined in the editor. Pressing SPACE on a step with a text box will automatically complete all the remaining text for that text box. Pressing ENTER on a step with a text box will automatically complete all the remaining text for that text box and automatically advance to the next step in the demo (after the text has finished typing in).

When a demo is displayed in auto-play mode (by clicking Play in the client or when watching a packaged Silverlight version of a demo), the text will automatically type itself in when a demo step with a text box is reached.

A text box control should be placed on a step in the demo where the text field is empty. Depending on what the next step in the demo is, you might then position the Click box to be either directly behind the text box, or on top of a Submit / OK button of some kind.

DemoMate Enhancements - February 2010

2010-02-23T14:10:00.000-08:00

The DemoMate Team is pleased to announce that the latest version has been released (Build 969), introducing a number of new features and enhancements. We’ll be adding numerous new tutorials over the next few days to give you a complete overview of the team’s great work. Check back often!

Scenario Branching: In this release, we’re proud to deliver one of the most-requested features from the DemoMate community, Scenario Branching. This enables you to create non-linear demonstrations driven by the interest of your audience, and opens a world of presenter-driven demonstration options. The new feature that enables branching is called a “Jump Box.” Check it out in this tutorial:

DemoMate Tutorial:

Scenario Branching

External Links: The new Jump Boxes can also be used to create links from your presenter-driven demonstrations to any URL or URI, so you can link to Videos, Websites, or Supporting Documents such as Worksheets, Quotes, Proposals, or Technical Specifications. To create an link, just add a Jump Box and select “Add New Address” from the drop-down menu.

Interactive Text Boxes: Need to simulate secure sign-in? Now you can. Text Boxes are another new feature in this release. With Text Boxes, you can simulate typing into a text field during your demonstration. Font and size options help you with match text or select “password” style (dots).

Animated Text Boxes: In all DemoMate Auto-Play modes, Text Boxes animate elegantly. This includes Auto-Play in the client, the hosted Silverlight Player on DemoMate.com, the embeddable Silverlight Players, and the “Click to Run” EXE.

Click-and-Drag Click Boxes: We’ve updated the Click Boxes (includes Jump Boxes and Text Boxes) so you can Click and Drag or Click and Resize.

Persistent Click Here Cue: As requested by the community, pressing Tab in Preview or Present modes displays the “Click Here” cue persistently as you move from step to step until you press Tab again to remove it.

Show/Hide Click Bubble (Editor): As requested by the community, you can now show or hide the Click Here bubble while working in the Editor.

Capture “Glossy” Overlays: DemoMate now supports capturing the newer “glossy” overlays, being used for pop-up windows, hover states, sidebars, and application menus in advanced applications such as Visual Studio 2010.

The Need for Speed: As mentioned in our January Twitter post, we’ve launched numerous client- and server-side enhancements to optimize launch times, bandwidth, and memory management.

IPL Release (969): General updates.

Thanks to the Community for all of your ideas and input. We’ve worked hard to bring you these enhancements and we’re already well on our way to the next release.

Go forth and demo!

Working with Jump Boxes and Click Boxes

2010-02-22T10:26:00.000-08:00

Each step in DemoMate requires you to have a Click Box in order to ensure that the user can click through the entire demo in a linear fashion. There are several ways you can approach having both click boxes and jump boxes on the same step:

You can have one of your buttons set as the “default” or preferred choice, and use the click box as the overlay on that button. Clicking on that button would then take the user to the next step or section in the demo. You can then place Jump Boxes on all the other buttons on that screenshot.
You can also simply minimize the size of the click box and drag it into a corner on the screenshot. You would still get a “Click Here” cue over the click box in this instance, so the first option might be the better choice if that is a concern. This approach is best when the sections you want to link to are further up or down in the demo navigation pane, and you don't necessarily want the demo presenter to advance to the very next step in the demo.

Introduction to Jump Boxes

2010-02-22T10:21:00.000-08:00

By adding a jump box control to a demo step, you can provide some additional flexibility in demo navigation by allowing you to “jump” or “branch” to a different section in the demo. For example, you might have an introductory screenshot that allows the demo presenter to click on one of several choices, each of which jumps to a different section in the demo. The same approach could be used at the end of a demo section, to allow the presenter to choose where to go next in the demo.

In addition, jump boxes can also be used to embed hyperlinks to external content in your demo. This can be used to create a “For More Information” link at the end of a demo, or perhaps to link to a series of related documents that are hosted on a publicly-accessible web server.

To add a jump box to a demo step, click on the Add Jump Box button on the step controls. This will place a new jump box control on the current demo step. Multiple jump box controls can be placed on a single step. To customize the location of a jump box, expand the “Jump To” menu and select the demo section you want that jump box to point to. With the Jump To: menu open, you can also click the “Add New Address” button to type in a URL for the jump box.

Currently, Jump Boxes are only active in the Present / Preview modes for a demo. They will not be displayed in auto-play mode.

DemoMate Enhancements - October 2009

2009-10-27T10:29:00.001-07:00

The DemoMate Team is pleased to announce that the latest version has been released (Build 873), introducing the ability to export and import your demo scripts.

You can export your demo script to the Microsoft Word .docx format, including screenshots for each step, click instructions and presenter script text. This provides a convenient way to review the entire demo script in one location, distribute it by e-mail, or include it as a project deliverable.

You can also re-import any edits you make to a demo script. Just make sure the script matches the demo (e.g., they both have the same number of Sections and Steps). All of the Click Instruction and Presenter Script text will be imported from the script back into your demo.

Here's a brief tutorial showing the process of exporting a script, making a few changes, and then importing those changes back into DemoMate:

DemoMate Tutorial:

Exporting and Importing Demo Scripts

From the Options menu, we've also added a new setting that lets you adjust the export script quality:

This setting determines the quality of the screenshots when you export a script to the .docx format. Higher quality will allow the images to be resized if desired and improve the overall quality by reducing the amount of image compression. Higher quality images will result in significantly larger file sizes, which could make it difficult to distribute the scripts via e-mail.

On behalf of the team that worked hard to bring you this new feature, we hope it’s a time-saver for you, and that it opens up new ways to share and collaborate with your team, partners, and customers.

Inserting a Step

2009-10-13T09:49:00.000-07:00

In our recent DemoMate release (Build 852), we added the ability to insert steps into a demo. This provides an easy way for you to add screenshots, PowerPoint slides, diagrams, or other content to your demos.

When inserting an image, it must be the same pixel size as the rest of the steps in that demo. For example, if your demo was captured at 1024x768, then the image you insert must also be 1024x768. Currently, the images must also be inserted in the .PNG image format.

Here's a brief tutorial showing you the process of inserting a step in a demo:

DemoMate Tutorial:

Inserting a Step Demo

DemoMate Enhancements - September 2009

2009-09-30T10:00:00.000-07:00

The DemoMate Team is pleased to announce that the latest version has been released (Build 852), introducing several exciting new features:

Insert Steps – Now you can quickly insert custom screenshots, graphics, or other .PNGs directly into your demo.

Publishing Tutorials with Audio – Our new Silverlight auto-run player has been implemented on DemoMate.com. Now you can invite viewers to watch your tutorials online, in full fidelity, as previews or leave-behinds.

Embeddable Silverlight Player Enhancements – Our industry-leading embeddable Silverlight player continues to improve, now with even faster load times and new bandwidth efficiencies.

Thanks to the Community
We’ve been working hard to deliver these features and we want to take a moment to say “Thank You” to everyone in the DemoMate community who has contributed their time and ideas to these powerful new capabilities. We love the success stories you tell us and we’re looking forward to seeing how you take advantage of these new capabilities.

Go forth and Demo!

Tips for Working with Audio in DemoMate

2009-08-19T11:08:00.000-07:00

Here is a collection of useful tips for incorporating sound bites in DemoMate:

Invest in a good microphone! We tested a variety of different recording devices, and microphone quality had the biggest impact on audio quality. Check the DemoMate Team Blog for suggestions.
Keep your sound bites short and sweet. You don’t need continuous dialog.
Experiment with adding sound to a Step or a Section. Select whichever approach works best for you.
Use the Presenter Script box to write notes about what you are going to say ahead of time.
Try using a free, professional audio recording program. We’re big fans of certain packages. Check the DemoMate Team Blog for suggestions.
If using a professional audio recording program, normalize the volume levels of the recordings. Also, trim out any dead space at the beginning and end of your audio clips, to tighten them up. If you don’t do this, you might notice a bit of “lag” at the beginning or end of a Step or Section.
Advanced: If needed, you can adjust the volume levels of your audio in tutorials by directly editing the following attributes in the OBJECT embed tag: ClickSoundVolume, SoundBiteVolume, and BackgroundSoundVolume. Valid values for these three parameters are between 0 (muted) and 1 (full volume).

Adding Sound Bites or Background Music to Your Demo

2009-08-17T09:07:00.000-07:00

There are two ways to add audio to your demo: you can record your own audio using the DemoMate Sound Recorder, or you can Attach pre-recorded audio files. DemoMate supports both .mp3 and Windows Media Audio (.wma) file formats.

The benefits of using the DemoMate Sound Recorder are that it is extremely simple, fast, and easy to use. The benefits of using professional audio software are that you have the opportunity to perform post-production functions not supported by the DemoMate Sound Recorder, such as normalizing volume levels, eliminating static, and editing out dead space. Check the DemoMate Team Blog for recommended audio packages. When using professional audio, you may still want to use the DemoMate Sound Recorder for the purposes of timing and “scratch tracks.”

Adding Audio to a Step or Section

To add an audio “sound bite” to a Step or Section, click on the Speaker Button next to the Step number or Section Name in the right navigation pane. This will launch the Sound Bite dialog box, with the following options:

Play – Preview an existing sound bite.

Stop – This button serves dual purposes, and will either stop playing a sound bite if one is playing, or stop a recording session.

Record – Begin recording a sound bite.

Attach File – Allows you to browse and select an existing file.

Delete – Deletes the existing sound bite.

Using the Mini Audio Control Panel

There is an additional way to add an audio Sound Bite to a Step. If you have an individual Step selected in the navigation pane, you can also use the Mini Audio Control Panel, embedded in the bottom panel, to preview, record, or attach sound bites. Finally, you can right click on a step (or section) in the navigation pane to bring up a context menu that allows you to perform certain actions.

Adding Demo Background Music

To add background music to your demo, click the Music button located directly above the Capture New Section button in the right editor pane.

Introduction to Audio in DemoMate

2009-08-13T15:36:00.000-07:00

DemoMate gives you the ability to add audio “sound bites” to individual Steps within a demo, or to Sections within a demo. You can hear the audio whenever you use one of the auto-play options in DemoMate. These options include: clicking the Play button from the DemoMate Editor, or selecting Package Tutorial on the Share tab.

When playing a demo back, audio “Sound Bites” associated with an individual Step will play first, then advance the demo, giving demo authors control and flexibility over how sound bites are used in the demo. Audio associated with a Section will keep playing as the demo progresses from Step to Step. If the audio file is longer than all the steps in the Section, then the mouse cursor will pause on the last step of the Section until the audio file has finished playing.

You can also add Background Music to your demo, which will play and loop in the background of your demo.

Note: Even in a DemoMate where audio has been added, the audio will not interfere with your use of any presenter-driven DemoMate formats, such as selecting Preview or Present from the DemoMate Editor, or selecting “Package for Distribution” or “Publish for Download” from the Share tab. In any of these cases, the recorded sound bites and background audio will simply not play when Presenting or Previewing. However, they will be included in any packaged file and available to the recipient for use in auto-play scenarios.

DemoMate Enhancements - July 2009

2009-07-22T09:57:00.001-07:00

The DemoMate Team is pleased to announce that the latest version has been released (Build 756), introducing 3 major new features that will help you save money, increase sales, and delight your customers:

Audio Support
We’re excited to release the most-requested feature the DemoMate community has been asking for – Audio Support.

Now you can attach sound bites to individual steps or entire sections of your demos, as well as add background music. By adding sound in "Bites," you maintain the ability to edit, re-order, or extend your demos as usual, without needed to re-record the audio or use complex editing software. That’s a big time-saver for you, and another industry first for the DemoMate Dev team!

Audio-enabled demos can be easily embedded into your websites, blogs, SharePoint portals, or applications, using the "Package Tutorial" button on the Share Tab. This is a great new way to enhance your solutions with "How To" content that accelerates your customers’ ROI, and sets you apart from your competition.

Speaking of embedded demos, click here to learn more about audio from the demo embedded in our blog (you can also click on the image below).

DemoMate Tutorial:

DemoMate Audio Introduction

Package Executables
We’ve introduced a new packaging option for your auto-run demos, called "Package Executable". This lets you package an auto-play tutorial in a single executable file, suitable for running at trade shows or kiosks, or burning onto CD/DVD resource kits.

Play Button
We’ve incorporated a new Play Button in the DemoMate client, letting you run your demos in auto-play mode without the need to package them. This is a great way to preview your work while you’re building a tutorial, and also lets you quickly auto-play a demo whenever you choose.

Go forth and Demo!

Save Time and Money: Hands-On Labs

2009-06-18T09:00:00.000-07:00

As the DemoMate Community continues to grow, we wanted to take a minute and share some examples of how DemoMate is being used to save time, save money, and generate new revenue opportunities. This is the last in a series of 5 short posts where we'll be sharing the latest from the community on the following topics: Sales Demos, Rapid Documentation, Paperless Training, Capturing IT Knowledge, and Hands-On Labs.

Hands-On Labs – Whether you’re training a group of users or preparing a self-guided training course, one traditional method is to create a series of hands-on labs that allow them to step through a process and interact with the software themselves. This kind of training can be extremely effective, since it gives the users a chance to interact with the software in a “hands-on” fashion. However, until now, companies had to pay $20,000 – $50,000 to develop these materials. With DemoMate, companies are creating same level of effective training experience in an inexpensive, light-weight fashion. Now, in a single process that doesn’t require technical development, customers are using DemoMate to rapidly create printed materials and interactive training experiences that customers can use prior to or in parallel with interacting with the target system. Customers are developing hands-on training in one-tenth the time, for one tenth-the expense. As discussed in a previous post, “Paperless Training” is a popular new trend. For more information on that, click here.

Save Time and Money: Capturing IT Knowledge

2009-06-02T09:27:00.000-07:00

As the DemoMate community continues to grow, we wanted to share some examples of how DemoMate is being used to save time, save money, and generate new revenue opportunities. This is the fourth in a series of 5 short posts where we'll be sharing the latest from the community on the following topics: Sales Demos, Rapid Documentation, Paperless Training, Capturing IT Knowledge, and Hands-On Labs.

Capturing IT Knowledge: Companies of all sizes have proprietary processes and procedures that are critical for their ongoing operations, and sometimes, this knowledge is poorly documented, or not documented at all – it’s walking around in the heads of a few key employees who may have places to go. It’s traditionally very expensive for a company to recreate that knowledge should it walk out the door.

Customers are using DemoMate to document and codify their own IT practices. Customers are using DemoMate to capture these processes, using the Publish for Tutorial feature. Once complete, customers can save these tutorials for future reference, using DemoMate’s password-protected My Demos page, or by saving the demo files locally or on a network.

Having these processes captured as Tutorials and Printed Scripts can be especially useful when employees need to be “shown” how to do something new, such as when a process was previous done by operating the controls of a machine, and is now done using a computer interface. As the CIO of a major industrial company put it, “I have 4 generations of employee in my company, from the Silent Generation to Gen Y, some want to read, some just want to “see” what they need to do. DemoMate gives me both.”

Embedding a Tutorial in a Blog

2009-05-28T12:08:00.000-07:00

With the new DemoMate embeddable tutorial player, you can now easily create content in DemoMate that can be embedded directly into blogs, providing you a new way to not just tell your users about your products and solutions, but show them as well. This new tutorial player is a great addition to blog posts whenever you need to walk your audience through a specific task or procedure, or simply want to demonstrate how to use a software application or web site.

What blog post on embedding tutorials in a blog would be complete without an embedded tutorial actually showing you how to embed a tutorial in a blog? Without further ado, here it is:

DemoMate Tutorial:

Embedding a Tutorial in a Blog

To embed a tutorial in a blog, first package the tutorial in the DemoMate client. Once your tutorial is ready, you’ll need to upload all the demo assets, including the .xap file and the assets folder, to a publicly available web server. This is necessary because most blogging services don’t provide a place to store media files, unless you’re hosting the blog on your own corporate web server already.

You might also need to configure your web server to support the x-silverlight-app MIME type for .xap files, since you will most likely be linking to the tutorial player across domains.

After you have uploaded your demo assets and configured your web server, you’re ready to create a blog post containing a tutorial. Sign in to your favorite blogging service and create a new post. Within the body of your post, you’ll want to paste in the entire OBJECT embed tag for the tutorial, which can be found in the sample .html file created when you first packaged the tutorial.

Two values will need to be modified in the OBJECT tag – the “source” value and the “AssetUrlPath” value. You should add the full URL path to where these assets are located on your web server. For example, “Sample Demo.xap” might become "http://www.demomate.com/Sample Demo.xap".

From trial and experience on our end with posting tutorials, we’ve also found that if line breaks are inserted in the opening OBJECT tag, the tutorial will not render on the page. Be sure to check and make sure that all line breaks are removed from this first tag. It’s still OK if the tag wraps onto multiple lines in the text editor box.

After you’ve modified the OBJECT tag with the correct URLs, you’re ready to finish your blog post and share your tutorial with the world.

Windows 7 Capture Issue Update

2009-05-26T15:48:00.000-07:00

Good news for all DemoMate users on the Windows 7 beta – we just heard from the Windows 7 Application Compatibility team, and they let us know the DemoMate capture issue is resolved as of Build 7133!

The issue prevented users from being able to press ‘ESC’ to end demo capture when capturing both demo clicks AND hover steps in a few locations in Windows 7. Since the issue is now resolved, anyone with special access to Build 7133 should see DemoMate behave as designed, and for those without special access, the issue will be eliminated when you install the RTM of Windows 7 upon its scheduled release in a few months.

In the meantime, our recommendation when creating a demo on Windows 7 is simply to either avoid capturing hover states, or to capture your demo in very short sections, if you have a need to capture the Control Panel or Task Manager.

On behalf of the DemoMate team, we want to pass along our kudos and a huge "Thank You" to the Win 7 Team for their great work in helping us resolve this issue. We’ve all heard the great things about Win 7 in the media, and having seen their work firsthand, we agree: Win 7 Rocks!

Save Time and Money: Paperless Training

2009-05-20T15:07:00.000-07:00

As the DemoMate community continues to grow, we wanted to share some examples of how DemoMate is being used to save time, save money, and generate new revenue opportunities. This is the third in a series of 5 short posts where we'll be sharing the latest from the community on the following topics: Sales Demos, Rapid Documentation, Paperless Training, Capturing IT Knowledge, and Hands-On Labs.

Paperless Training – With any software solution, Customer Satisfaction and ROI are directly related to the rate of user adoption. Customers who sell and implement software are using DemoMate to create and deliver Custom, Interactive training materials at a fraction of traditional costs.

As discussed in previous posts, DemoMate’s Print Script functions are great for creating custom, rapid documentation for a wide range of purposes. However, as members of the DemoMate community (and their customers) “Go Green,” there is broad interest in “paperless training” techniques. Customers are using DemoMate’s “Tutorial” functionality to deliver this new value-added service.

During the implementation process, companies work with their clients to identify the top employee tasks by role. Then, they use DemoMate to capture step-by-step tutorials of each process, using the DemoMate Publish for Tutorial feature. Once complete, customers can invite the employees to view the tutorials and by doing so, take advantage of DemoMate’s ability to provision password-protected My Demos pages for each employee. Some customers are going one step beyond this – with the new “Package For Tutorial” feature introduced with the April release of DemoMate, customers can actually embed training demos or sales demos inside the application interface, such as on a Role page.

Embedded, “Paperless Training” has the opportunity to revolutionize software usability. We’re scheduling a number of specific webcasts on this topic. If you are interested in attending one of our upcoming webcasts, send e-mail to contact@demomate.com and put the words Paperless Training in the subject line.

Embedding a Tutorial in PowerPoint

2009-05-18T13:15:00.000-07:00

With the new DemoMate embeddable tutorial player, you can easily embed your self-running tutorials into your Microsoft PowerPoint presentations. This allows you to create seamless presentations, including slide content and tutorial content. This is especially helpful in trade show kiosks or internal displays when you need to show content in an offline environment.

In order to embed a tutorial, you first need to download a plug-in for PowerPoint that lets you add web content into a PowerPoint slide. We recommend the excellent LiveWeb for Microsoft PowerPoint plug-in, which can be downloaded here.

Once the plug-in is downloaded and installed, you can embed a DemoMate tutorial file into a PowerPoint slide. This tutorial can either be content stored locally on your hard drive, or hosted remotely on a website. In either case, you need to point the LiveWeb plug-in to the URL where the tutorial .html file is located.

Be aware that if you point to a local file on your hard disk, then if you move the PowerPoint deck to a different machine you'll also need to move the DemoMate tutorial files and ensure the embedded link is still valid. This is because the plug-in does not actually embed the tutorial itself into PowerPoint, but only a link to where the tutorial player is located.

For a complete, step-by-step demonstration of this entire process, please view the following tutorial:

DemoMate Tutorial:

Embedding a Tutorial in PowerPoint

One important thing to note is that this only allows you to embed the Silverlight auto-play tutorial format in PowerPoint. If you plan on actually presenting a click-by-click demonstration of DemoMate to your audience, you should still use the DemoMate client application. This allows you to take advantage of several important features, such as dual-screen presentation mode, viewing hover and down states for your demo, etc. In this case, you might consider doing the opposite of what is described in this blog post, and add your slide content directly into DemoMate.

This process is described in a separate blog post, located here. We feel there is a time and place for both scenarios.

Save Time and Money: Rapid Documentation

2009-05-15T08:59:00.000-07:00

As the DemoMate community continues to grow, we wanted to share some examples of how DemoMate is being used to save time, save money, and generate new revenue opportunities. This is the second in a series of 5 short posts where we'll be sharing the latest from the community on the following topics: Sales Demos, Rapid Documentation, Paperless Training, Capturing IT Knowledge, and Hands-On Labs.

Rapid Documentation – Customers who need to deliver “hard copy” instructions for different demos or tasks, such as for Sarbanes Oxley requirements, for training materials, or for customers in the Public Sector, are using DemoMate’s Print Script functions to save time creating these documents. DemoMate automatically generates click-by-click documentation in a 3 column format including screen shots, click pointers, optional click instruction text, and optional descriptive text. This saves 3-6 hours of work per deliverable, and makes it easier to deliver custom documentation more often.

Embedding a Tutorial in SharePoint

2009-05-14T13:42:00.000-07:00

With the new DemoMate embeddable player, you can easily add your self-running tutorials into a SharePoint web part page, allowing you to quickly and easily provide tutorials to anyone in your organization.

Here’s a short tutorial that walks you through the process:

DemoMate Tutorial:

Embedding a Tutorial in SharePoint

Adding a DemoMate tutorial to SharePoint is very straightforward. First, from DemoMate, select Package Tutorial. From the Packaged Tutorial Settings dialog, select the “Single File” option. DemoMate will now open a folder and display your Silverlight .xap and .html files.

Next, navigate to the document library where you want to publish your tutorial, and upload both the Silverlight .xap and the sample .html file. As soon as the upload has completed, copy the shortcut for the .html file associated with that tutorial. Now you can navigate to a SharePoint page, and embed the tutorial by adding a new Page Viewer Web Part to the page. You’ll need to customize the web part by specifying the URL for the .html file, which you copied in a previous step, and possibly adjusting the height and the width so that the Silverlight player fits perfectly.

Using this method, you can quickly build up an entire document library of useful demos, training materials, or process documentation to share with your colleagues, partners, and customers.

Using the DemoMate Silverlight Tutorial Player

2009-05-08T10:19:00.000-07:00

The new Silverlight tutorial player is designed to be as easy as possible for your viewers to enjoy. When the tutorial player has finished loading, the user will be presented by a large Play button in the center of the screen, encouraging them to engage with your content and watch the tutorial. Clicking this button (or the Play button on the toolbar) will start the tutorial playing to auto-play mode.

While the tutorial is playing, the viewer has the following options from the bottom toolbar:

Play / Pause: When the tutorial is paused, the auto-play mode will pause on the current step, allowing the viewer additional time to view the content, read the presenter script text, etc. While the tutorial is paused, the viewer can actually continue to advance one step at a time, instead of watching the demo in auto-play mode. If a viewer wants to navigate through a tutorial in this manner, it is recommended that the Click Instruction and / or Click Beacon option be enabled, to make it clear where to click next.

Next Step: Advances the tutorial to the next step.

Previous Step: Returns the tutorial to the previous step.

Progress Bar: Shows the current location in the tutorial. The play head on this bar can be dragged, allowing the viewer to quickly move to any point in the tutorial.

Audio Button: Enables / disables the click sound.

Full-Screen Button: Switches the player into full-screen mode. In this mode, the tutorial player takes over the viewer’s entire screen, breaking out of the browser window entirely. The screenshots in this mode will be scaled up to their maximum resolution, allowing for a much larger and clearer picture than might be possible in a small embedded player. While in this mode, the viewer can press the Restore button or ‘ESC’ to return to normal browser mode.

Options Menu: Allows the viewer to adjust many of the settings for the player, including:

Pointer Speed
Presenter Script Orientation
Show / Hide Click Instructions
Show / Hide Mouse Pointer
Show / Hide Click Beacon
Enable / Disable Looping

The following keyboard shortcuts are also available when viewing a tutorial:

LEFT ARROW – Previous step
RIGHT ARROW – Next step
SHIFT + LEFT ARROW – Previous section
SHIFT + RIGHT ARROW – Next section
TAB – Show / Hide Click Beacon

Save Time and Money: Sales Demos

2009-05-07T13:58:00.000-07:00

As the DemoMate community continues to grow, we wanted to take a minute and share some examples of how DemoMate is being used to save time, save money, and generate new revenue opportunities. This is the first in a series of 5 short posts where we'll be sharing the latest from the community on the following topics: Sales Demos, Rapid Documentation, Paperless Training, Capturing IT Knowledge, and Hands-On Labs.

First Up: Sales Demos.

Sales Demos – Customers are using DemoMate for sales demos to reduce sales costs and make it easier for sales teams and partners to give demos to more people. Demos which would normally require virtual machines, servers, or access to hosted environments are now portable and lightweight. One customer reported that his original demo was 65 GB, but the DemoMate version was only 19MB, and much easier for his partners in remote geographies to download, learn and present.

For example, in less than 6 months from its introduction into the Microsoft partner community, DemoMate use had spread to 90 countries around the world, bringing important sales content along with it. In trade show settings, DemoMate is being used to reduce costs – saving up to $1,000 per demo kiosk where demos would normally require CAT5 cabling for online access.

In the words of a DemoMate customer at a recent trade show, "What amazed me about DemoMate was how little there was to learn. I captured my entire on-stage demonstration in a single sitting, and it worked perfectly the very first time."

In other cases, customers are using DemoMate as an "insurance policy." Sometimes bandwidth or performance issues render a live demo impractical, or no one in the board room knows the WEP key for the wireless network – having a DemoMate version of your demo keeps your meeting moving. At a recent trade show, a group of employees missed their scheduled stage time due to airport delays, but because DemoMate copies of the on-stage presentations were available, it was possible for a different presenter to be successful in front of hundreds of people.

Hosting or Embedding an Online Tutorial

2009-05-06T14:59:00.000-07:00

Hosting your own tutorials is very straightforward. In order to host a tutorial on your web site, you’ll need only a working knowledge of HTML, and access to a web server that can be used to host the tutorial assets. If you are unsure how to host a tutorial on your website, please contact your IT department for assistance.

Once you have packaged your tutorial, navigate to the location where you saved your assets. Be sure to grab all of the files associated with that tutorial, including the .html reference file, Silverlight .xap file, and assets folder, if one was generated. All these files can be moved to the location where you want to host the demo, such as your corporate website, a SharePoint document library, etc.

The .html file is included for your reference purposes, and contains all the code you need to embed your tutorial in your own website. It is not necessary to use this entire file. The portions of the file you are interested in are everything in between (and including) the OBJECT embed tag. All of this code can be copied from the reference .html file and included in any of the pages on your web site. This will allow you to embed the tutorial in your own site, with your own corporate branding and site navigation.

If you need to modify any of the default parameters after you have already packaged your demo, you can do so by editing the values in the OBJECT tag. It is not necessary to repackage your tutorial unless you have made changes to the content itself. For further information on valid values for each of the parameters, please refer to the comments in the sample .html document.

Here's a brief tutorial showing how to edit the tutorial source code:

DemoMate Tutorial:

Editing Tutorial Source Code

If you plan on hosting the Silverlight asset files (the .xap and/or the assets folder) on a different web server from your main web server, then you might need to ensure that your media server is configured to support the x-silverlight-app MIME type. This is necessary to host Silverlight applications being served on a different domain.

You’ll notice a section at the end of the OBJECT embed tag that is displayed only if the Silverlight application could not load. The most common time this occurs is if a user does not have the Silverlight plug-in installed in their browser. You might want to consider modifying this code to customize the look-and-feel to better match the site it is embedded in. In addition, text that is stored in this section can be seen and indexed by search engines, so you might want to spend some time optimizing this with relevant keywords to your demo and product.

A special note on embedding tutorials into blogs: Many blogging services on the Internet do not allow you to upload assets directly to their services. You will need to host the Silverlight .xap file and demo assets folder on a public web server you have access to. You can then take the OBJECT embed code and add it to your blog post. In the OBJECT embed code, be sure to change the source value to point to the location where you are hosting your .xap file, and the AssetUrlPath, if necessary. You should also be careful that the OBJECT tag is all on one line of code – some blogging services will insert extra carriage returns if the tag spans multiple lines, which will prevent the Silverlight application from loading correctly.

Tips for Packaging Tutorials

2009-05-04T16:43:00.001-07:00

The all-new DemoMate Embeddable Player is here, and with it come new opportunities for you to increase revenues, decrease cost, and delight your customers. With the latest version of DemoMate (Build 690), you can now “package” your tutorials in a new Silverlight player that can be embedded in websites, blogs, and SharePoint portals. We worked hard to give you a great deal of flexibility and control of the first-run experience for your tutorials. You can view your options on the new Tutorial Settings screen:

Here are some useful tips for packaging your tutorials:

Title: The name of the tutorial as it will show up in the player. By default, this is simply the name of your DemoMate file, but can be changed if you desire. Generally speaking, short names work best. You can use the length of the Title field as guide for when your Title gets too long.

Output: There are two different output formats available:

Multiple Files - Creates one small Silverlight file (.xap) and a folder containing all tutorial assets. Best for online (streaming) scenarios.

Single File - Creates one large Silverlight file (.xap) containing all tutorial assets. Best for offline or high-bandwidth scenarios only.

Width: Determines the width of the demo player, in pixels. Changing this value to 0 will default the player to 100% of your browser width, and allow it to flex as the browser window is resized.

Height: Determines the height of the demo player, in pixels. Changing this value to 0 will default the player to 100% of your browser height, and allow it to flex as the browser window is resized.

Lock Aspect Ratio: If this box is checked, then when you change either the Height or Width, the other value will be automatically calculated based on your screen resolution to determine the best possible fit and reduce the amount of letterboxing in the player.

Pointer Speed: Determines how fast the mouse pointer moves between steps, and thus how fast the tutorial progresses.

Start Screen: Determines which player elements are shown when the player is first loaded. The options are to show the Play button and the Title, just show the Play button, or show neither. If both of the elements are not shown, then clicking anywhere on the first step will start the tutorial; this allows you to customize your Tutorial experience by using the first Step of your Tutorial as the Start Screen, branded however you like.

Show Presenter Script: Determines the default location for the presenter script pane in the tutorial player. Options are to dock it to one of the sides of the player, or have it as a floating box that can be dragged around the screen by the viewer. You can also choose not to display a presenter script pane at all by selecting Off. For demos that you intend to embed in small spaces, consider not using any presenter script text whatsoever, and having short descriptions of your actions contained just in the Click Instruction field.

Show Click Instructions: Determines if the Click Instruction bubble is displayed.

Show Mouse Pointer: Determines if the mouse pointer that moves between steps is displayed.

Play Click Sound: Determines if a subtle click sound is played before advancing to the next step.

Start Demo Automatically: Determines if the demo automatically starts playing as soon as it is loaded, or if the user must click a Play button.

Show Click Beacon: Determines if the click beacon is shown for each step. This beacon can be useful as an alternate method of indicating where to click to move to the next step in your tutorial.

Loop Demo: Determines if the tutorial will loop after it reaches the last step. You can also set a time, in seconds, that the player stays on the last step before starting to play the tutorial again.

All of the player control settings can be changed by your customers once they start viewing a tutorial, through the Options menu in the player. When you are through selecting your defaults, click the OK button to package your tutorial. By default, tutorials will be placed in a My Tutorials folder in your Documents folder (Note: this is different from your My Demos folder).

Take a few moments to familiarize yourself with the new Package Tutorial feature and let us know if you have any questions!

DemoMate Enhancements - May 2009

2009-05-01T09:19:00.000-07:00

You asked for it … you got it! The all-new DemoMate Embeddable Player is here, and with it come new opportunities for you to increase revenues, decrease cost, and delight customers.

In this release of DemoMate (Build 690), we’re proud to introduce a powerful new feature – requested by the DemoMate Community – that dramatically expands what you can do with your demos. Now, at the touch of a button, you can package your demo in an embeddable Silverlight player similar to a YouTube player. This new features is called “Package Tutorial.”

Once packaged, your demos can be hosted on a web site, run from your desktop, or even embedded in blogs, SharePoint portals, PowerPoint presentations, or other applications that support Silverlight.

To package a tutorial, simply create or open your demo, switch to the Share tab, and select Package Tutorial. Better yet, just press Play to watch this Tutorial below. Be sure and check out the full-screen mode to see how clear and easy-to-follow the demo screens are at their full size:

DemoMate Tutorial:

Packaging a Tutorial

Here's an example of how you can embed a tutorial in a SharePoint portal:

We’ve worked hard to bring you this new feature, and we’re looking forward to seeing the many different uses you find to showcase your demos, solutions, and training materials. Keep an eye on the Tips and Tricks section of this blog over the next couple weeks, as we’ll be publishing a series of articles on how to embed the new tutorial player in different kinds of content, such as SharePoint portals, PowerPoint presentations, and more.

Capturing Hover and Down States in DemoMate

2009-04-17T11:10:00.000-07:00

Did you know that you can capture both hover AND down states for buttons and other page elements when creating a demo? It’s easy and looks great. How does it work? For each step in your demo, you can also capture a hover state that displays when you mouse over the click region, and a down state for when you actually click the mouse button. This can be extremely useful for increasing the realism of your demo. To capture a hover state, tap the Left CTRL on your keyboard when the mouse is over the button you intend to click. Once you have pressed down the left mouse button to click, you can tap the left CTRL again to capture the down state of that button. Be sure to do this while you're still holding down the left mouse button, and not after you've released it. Once you’ve done this for a few steps, press Preview and check it out. Good selling!

DemoMate Twitter Feed

2009-04-03T10:06:00.000-07:00

Want the fastest notification of new DemoMate releases, blog posts, and other DemoMate news? We've added a new Twitter feed to keep the community up-to-date, which you can find here.

Hiding the Click Here Bubble in a Tutorial

2009-03-31T15:23:00.000-07:00

Sometimes, when you are building tutorials where you have inserted graphics or slide content from PowerPoint, you may find it helpful to “Hide” the “Click Here” bubble on certain screens, so it doesn’t interfere with your nice-looking graphics. To do this, simply delete the placeholder text from the Click Instruction box before publishing your tutorial. When you publish and view your tutorial, the Click Here bubble will not be displayed for the steps where there is no Click Instruction text.

DemoMate Enhancements – March 2009

2009-03-18T11:08:00.000-07:00

We’re happy to announce the March 2009 release of DemoMate! In this release (Build 660) we're proud to announce a powerful new feature – requested by the DemoMate community - that makes it easier than ever to present perfect demos to an audience: Dual-Screen Presentation mode.

From Dual-Screen Presentation mode, you can view all your click instructions and presenter script text on your primary display, while your audience sees only the demo on the secondary display or projector.

Here’s an example of what you see on each screen when presenting with two displays:

Primary Display

Secondary Display

To enable Dual-Screen Presentation mode, simply press the ‘HOME’ key while presenting or previewing a demo, which will activate Training Mode. From Training Mode, click the Dual-Screen button in the right pane to begin presenting your demo on both screens.

To make sure your computer is set up properly for use of a secondary display, check out our blog entry on the subject here.

Configuring a Secondary Display in Windows

2009-03-18T10:54:00.000-07:00

In order to take advantage of the dual-screen output mode in DemoMate, you first need to ensure that your Microsoft Windows computer is configured correctly.

For Windows Vista, follow these steps:

Connect the secondary display (projector, flat-screen TV, monitor, etc.) to your computer.
The following dialog box should appear once the display is connected:

Select the second option, to extend your desktop, and click OK. You’re done!

For Windows XP, follow these steps:

Right-click on the desktop and select Properties.
Switch to the Settings tab. You should see two monitors displayed here, labeled “1” and “2”.
Right-click on the monitor labeled “2” and ensure there is a check next to the Attached option.
In the main Display Settings pane, place a check in the box labeled “Extend the desktop onto this monitor”.
Click OK.

Now you’re ready to present your demos in dual-screen mode. To enable dual-screen presentation mode in DemoMate, simply press the ‘HOME’ key while presenting or previewing a demo. This will switch the demo to training mode. Here, click the Dual-Screen button in the right pane to begin presenting your demo on both screens.

Come See Us at the Convergence 2009 Conference in New Orleans

2009-03-05T14:01:00.000-08:00

We’re looking forward to seeing many of you at Convergence 2009, the premier conference for Microsoft Dynamics Partners and Customers, from March 9th through the 12th. You can find us at Booth #22 in the Microsoft Pavilion in the EXPO area. We’re looking forward to the meetings we have scheduled to discuss how the DemoMate platform is helping organizations reduce training costs, improve productivity, and increase customer satisfaction. We also have some great events planned on Monday and Tuesday evening, to enjoy New Orleans’ world-famous cuisine … come join us! If you do not already have a DemoMate meeting on your calendar, search for “DemoMate” in the Convergence Connect system to schedule a meeting, or send e-mail to contact@demomate.com and you’ll be put in touch with our representatives at the conference. See you there!

Working With DemoMate Files

2009-02-15T10:54:00.000-08:00

By default, DemoMate files are stored in a "My Demos" folder that is created inside your default Documents folder. You can save the demo files to another location by using the File->Save As option from within DemoMate. Here's an example of what you'll see in a typical My Demos folder: Each demo actually has two items associated with it in this folder: the .demo file that defines the demo structure, and the demo asset folder of the same name. If you decide to delete a demo, you can do so by deleting both of these items. If you wish to move a demo to another location on the same computer, be sure and copy both the .demo file and the asset folder. You can transfer a demo to another computer by packaging the demo using a licensed version of DemoMate, and then running the new packaged demo installer on the computer you wish to transfer the demo to. This installation process ensures that all demo assets are correctly installed on the new computer. When installing a packaged demo on a computer, the new demo will be deployed into an "Installed" directory under your My Demos folder. Here is what you might see in the Installed folder with three different demos installed:

Each of these folder names is a unique identifier for that demo, to ensure that a demo with the same name does not overwrite it. Installed demos are locked for editing - this guarantees that the original demo is unchanged when being used by demo presenters. Users with licensed versions of DemoMate can always make copies of Installed demos and make any changes they desire.

Optimizing Demo File Sizes

2009-02-10T15:27:00.000-08:00

When creating a DemoMate, it's useful to be aware of the factors that can influence the size of the demo file. This is especially important when creating a demo for use as an online tutorial, where download speeds can affect how long it takes your customers to load the demo. The following four factors can influence the size of your demos:

Screen Resolution - The higher your screen resolution, the larger your demo file will be. This is because DemoMate will be recording more pixels of information for each step. Reducing your screen resolution before capturing your demo will dramatically reduce the file size. This has the added benefit of making your demo viewable on a wider range of displays, and making text more readable when presenting your demo.
Color Depth - This refers to the maximum number of colors Windows can display on your desktop at any one time. Typically, this is set to 32-bit to ensure the highest fidelity when watching videos and viewing photos. Reducing this setting to 16-bit can help minimize DemoMate file size, and usually has only a minimal impact on the quality of the screenshots in your demo, because most business applications don't display enough colors on the screen at once to take advantage of 32-bit color.
Image Complexity - Capturing demo screenshots that contain highly complex images takes up considerably more disk space than screenshots with simpler images. When capturing demos, you might want to consider removing that fancy beach photo from your last vacation that's being used as your desktop background, and using a simpler, single-color background.
Number of Steps - Of course, the number of steps in your demo will also affect the size of the demo. It's always a good idea to review your demo and see if there are unnecessary click steps that can be removed to tighten up or shorten the demo.

Capturing Demos in Windows 7 Beta

2009-02-04T15:43:00.000-08:00

It has come to our attention that when capturing demos in Windows 7, there are certain situations where DemoMate will end up in a state where pressing 'ESC' to end demo capture does not work properly. The easiest workaround is to capture your demo in short sections, pressing 'ESC' frequently to end demo capture. After you are done capturing your demo, you can then use the Merge sections option in the DemoMate editor to organize your sections how you want them. Please don't hesitate to contact us with any other issues you might encounter while running DemoMate on Windows 7. We appreciate the feedback, and are working diligently to ensure we provide full compatability by the time it ships.

Presenting Demos in Windows 7 Beta

2009-02-04T15:41:00.000-08:00

We've been testing DemoMate with the public beta of Windows 7, and have observed an issue where clicking the Present button results in the first step of the demo being a completely white screen. We're currently investigating this issue, but the easy workaround for now is to simply click the Preview button instead of the Present button, which works just fine. Update: This issue has been resolved in DemoMate Build 660.

Editing Demos at Different DPI Scales

2009-02-04T15:22:00.000-08:00

We are currently tracking an issue where it is difficult to edit demos captured at different DPI scales than the Windows default of 96 DPI. Adjusting this setting is typically done (especially on laptops) to make text and icons larger and easier to read. The current workaround for this issue is to set your monitor back to 96 DPI before capturing or editing a demo. To do this, right-click on your desktop and select Properties. Select the Adjust Font Size (DPI) link, and set it back to 96 DPI. We anticipate having this issue resolved in the next release of DemoMate.

DemoMate Tip: Screen Resolutions for Demo Capture

2009-01-30T16:13:00.000-08:00

We were recently asked what monitor resolution would be best to capture a DemoMate demo in, and wanted to share our thoughts with the entire DemoMate community. In our experience, it’s best to capture and record a demo at a fairly low resolution, such as 1024x768, or the widescreen equivalent, which is 1280x720. Here are some reasons why it’s best to capture at a low resolution: 1. Capturing in the lowest common denominator guarantees that when you share your demo with other people, they’ll be able to present it without any problem on a wide variety of different displays. 2. A lot of people don’t realize how difficult it can be to read text in demos captured at high resolutions. For example, demos captured in 1280x1024 make it difficult to read text on a screen unless you’re just a couple feet away. Thus, capturing at a low resolution makes it easier for people to view your demo content from further away. This is especially important at large trade show events and when presenting in front of clients with a projector.

3. Capturing your demo in a lower resolution also reduces the overall size of your DemoMate demo files, makes it easier to distribute your final demo later.

DemoMate Enhancements - January 2009

2009-01-26T10:01:00.000-08:00

Happy New Year to the entire DemoMate community! To kick things off right, we've got a great new release that introduces a much-requested new feature - the ability to print a presenter script of your demo.

Printable Presenter Scripts

This new release (Build 580) allows you to print out a three column presenter script of your software demos, containing all the screen shots, click instructions, and presenter script text. This is a great way to review your entire demo at once, or for use as a quick-reference guide while you are practicing your demo. This can also be a time-saving tool for quickly using DemoMate to capture and output training materials for use in hands-on labs environments.

Here's an example of what a presenter script looks like when printed from DemoMate:

New Shortcut Keys for Rapid Demo Navigation

We've also added new shortcut keys in present / preview mode that allow you to rapidly advance through sections in your demo. SHIFT + RIGHT ARROW will advance to the next section, and SHIFT + LEFT ARROW will return to the start of the previous section. These new shortcuts make it possible to quickly navigate through your demo without having to enter training mode.

Directions on Microsoft: "Every Demo Needs a DemoMate"

2008-12-23T12:58:00.000-08:00

We’d like to welcome Directions on Microsoft to the community and thank them for their kind words about DemoMate. Here’s what they had to say: “DemoMate gives us a way to leverage cloud computing to deliver our research to our subscribers. Every demo needs a DemoMate.” Jeff Parker, President, Directions on Microsoft

Directions on Microsoft is making a special offer to the DemoMate community! To receive a 20% discount off your own subscription to Directions on Microsoft, contact us for a special promotional code.

“Directions on Microsoft and DemoMate go great together -- you get broad Microsoft insight, and an effective way to demonstrate that value to customers.” – Rebecca Duffy, VP, Sales & Marketing

We are honored to be able to share this offer with you from the undisputed authority on Microsoft strategy. As many of you know – this is a great value for anyone in our industry.

DemoMate Enhancements - December 2008

2008-12-09T15:52:00.000-08:00

In this release of DemoMate (Build 517), we introduce new capabilities to edit your demos. These new editing tools allow you to:

Merge Sections
Split Sections
Copy Sections
Insert a Demo

With these enhancements, it’s now easier than ever to organize your demo. These tools also make it simpler to go back and recapture click steps later, and then merge the new steps into existing sections.

DemoMate Tip: Capturing Remote Desktops

2008-12-09T15:47:00.000-08:00

To capture a Remote Desktop application window, it is recommended that you do so with the Remote Desktop window in full-screen mode, so that no additional windows or content on your primary desktop are also captured. The DemoMate client and the Remote Desktop need to be set to exactly the same screen resolution. Assuming that you intend to capture your demo at 1024x768, you would follow these steps:

Adjust your primary desktop screen resolution to 1024x768.
Launch DemoMate.
From the File menu, select New Demo.
Open the Remote Desktop Connection application.
In the Computer box, type in the machine name or IP address of the machine you want to connect to.
Click the Options button.
Switch to the Display tab.
Drag the Remote Desktop Size slider all the way to the right, until it says “Full Screen”.
Click the Connect button.
Log in to your Remote Desktop session.
Unpin the yellow Remote Desktop bar at the top of the display, so it does not show up during your demo capture.
Minimize the Remote Desktop session, and return to the DemoMate client.
Click the Capture New Section button.
For your first click, select the Remote Desktop session on your taskbar. This will maximize the Remote Desktop again.
Proceed to capture your demo as normal, and press ESC when you are done capturing.
After your entire demo is captured, close the Remote Desktop session and return your primary desktop to its normal resolution.
Remove any captured steps from sections that involve maximizing the Remote Desktop connection window, since that isn’t a desired step in the demo.

Tutorial Auto-Looping

2008-12-09T15:44:00.001-08:00

In November, we released a new feature for Online Tutorials. Now, you can set your Tutorial to “Loop,” so when it reaches the end, it starts over again automatically. This feature is great for Trade Shows and Kiosks. Just select the circle icon from the control panel on the Tutorial player.

DemoMate.com Has a New Look

2008-12-09T15:40:00.000-08:00

This month we’re pleased to introduce the new DemoMate homepage. We’re thrilled with our new look, and think it does a great job of introducing the DemoMate experience to our users around the world. Be sure and check it out when you get a chance! As part of our new website redesign, we have partnered with Amazon.com to provide a simple, fast method of purchasing DemoMate licenses online. You can now go to the ‘Buy Now’ link in our top navigation to purchase 1-month, 3-month, and 12-month licenses.

DemoMate Enhancements - November 2008

2008-12-09T15:31:00.000-08:00

Several great new enhancements have been introduced in this latest DemoMate build (Build 496). First up, we’ve added a completely new installer experience, which does a better job of detecting and installing the .NET Framework 3.0 on WinXP systems. This new installer also installs packaged demos in a more user-friendly manner. Anyone distributing packaged demos to customers can take advantage of these enhancements by updating to this new build, and then packaging their own demos!

Second, based on customer feedback, we’ve added a second Cue Type for showing presenters where to click during a demo. This new animated beacon is a bit more subtle than the Click Here bubble – great for when you need a quick reminder during those customer presentations! You can switch between Cue Types from the Options menu (located in the File menu).

DemoMate Now Includes Online Tutorials

2008-12-09T15:29:00.000-08:00

We are excited to announce the launch of DemoMate Online Tutorials. Now, using the same demo capture process, you can publish an auto-play version of your demo that animates the click steps. Just Open any DemoMate file, go to the “Share” tab, and click “Publish for Online Tutorial.” That’s it! You can invite others to view your tutorial using any Silverlight-enabled web browser.

DemoMate Tip: Including Slides in Your Demo

2008-12-09T15:20:00.000-08:00

Did you know that you can insert graphical slides into your DemoMates? For professional-looking intros, transitions, or conclusions, simply prepare the graphics in an application such as PowerPoint, and then “Capture” them as DemoMate Sections. This process allows you to move seamlessly between slide content and demo content.

Customer Quote: “Effective and Foolproof”

2008-12-09T15:19:00.000-08:00

We want to send a special “thank you” to Libby at c360 Solutions, a Microsoft Dynamics Partner, for sending us this quote about her success with DemoMate: “DemoMate is a very effective and foolproof tool for presenting software. The product works especially well for trade shows and seminars because it allows you to concentrate on your audience and content - not the keyboard. Great training tool …”

Introduction to the DemoMate Platform

2008-12-09T15:07:00.000-08:00

DemoMate is a new way to create, share, and present software demos. DemoMate is a “software plus service” platform built using Microsoft technologies.

About DemoMate

The design philosophy behind DemoMate was to build a platform that helps business professionals save time, reduce cost, and increase sales. DemoMate accomplishes this by making it possible for anyone to create, share, and present interactive software demos without the need for expensive hardware, complex technical development tools, or scripting languages such as Adobe Flash.

Creating Demos

The DemoMate application lets users create demos by capturing “click steps” in a WYSIWYG environment. No development skills are required.

Presenting Demos

Once created, the user is able to present the DemoMate demo in a click-through style that simulates the experience of interacting with live software. These presentations can be used for sales purposes or for training purposes, when live software is either unavailable or impractical due to technical overhead. Users can also include slide content, such as slides created in Microsoft PowerPoint, to create seamless, integrated presentations that alternate between slide content and interactive demo samples.

In addition to Presentation Mode, DemoMate includes a Training Mode, where click instructions and presenter script are overlaid in a heads up display, enabling the user to learn and practice each demo with click-by-click instructions visible on the screen. These features dramatically reduce the time and cost involved in creating and distributing interactive training materials.

Packaging Demos

DemoMate demos can be packaged and distributed as free, self-extracting Presenter Versions. Presenter Versions can be used and distributed freely, on an “as-is” basis, in an unlimited fashion. Packaged Presenter Versions can be distributed on media (such as a USB Drive) or by downloading from DemoMate.com via invitation from a licensed user.

Online Capabilities

Via the DemoMate.com portal, DemoMate demos can be published in 3 formats:

Demo for Review – The demo creator can invite others to review the demo online and provide feedback using the Preview Pane.

Demo for Download – Using this method, the demo creator can upload Presenter Versions for download and send invitations to colleagues (this reduces e-mail size).

Online Tutorial – This is an auto-play format, built using Microsoft Silverlight. In this format, a viewer can watch the demo in “Auto Run” format using any browser with the Silverlight plug-in installed. As with the other online demo formats, the demo creator can invite others to view the tutorial.

Presenter Version vs. Licensed Version

With the presenter version of DemoMate, users are able to play back demos installed by a DemoMate packaged demo installer.

The licensed version of DemoMate allows users to create, package, and publish an unlimited number of demos.

Evaluation Version

A free, 30-day evaluation of the licensed version of DemoMate can be downloaded and activated from DemoMate.com.

System Requirements

The following system requirements are needed to run DemoMate:

Windows XP, Windows Server 2003, Windows Vista, or Windows Server 2008 operating system
Microsoft .NET Framework 3.0
1 GHz 32-bit (x86) or 64-bit (x64) processor
512 MB of system memory
20 MB available hard drive space
Internet access required for product activation (fees may apply)

In addition, the online features require:

Internet access (fees may apply)
Supported web browsers include Microsoft Internet Explorer 6.0, 7.0, or 8.0; Mozilla Firefox 2.0 or 3.0
Microsoft Silverlight 1.0

Welcome to the DemoMate Team Blog

2008-12-09T15:05:00.000-08:00

DemoMate has entered the blogosphere! On this DemoMate Team Blog, we’ll provide updates on new client and website features as they’re released, tips on how to capture and build your demos, and news on other DemoMate activities. Thanks for taking the time to check us out. Contribute to the community! Send questions or feedback to: contact@demomate.com.