the flimp platform (dc) dashboard can be accessed by pointing your web browser to

© Copyright 2009 FLIMP Media Inc. All rights reserved.1

FLIMP Platform - Digital Canvas Dashboard The Flimp Platform (DC) dashboard can be accessed by pointing your web browser to

http://flimp3.com/dashboard. Flash Player 9, the latest version, is required for creating flimps, viewing flimps, and administering user accounts. The flimp viewer and dashboard have logic for checking for the required version of flash.

The first screen presented in the dashboard is the login screen. Use the ID and password provided to login.


Upon successful login, the dashboard home page is presented.

Shows how many active flimps are on file for this account.

Return to this page

Go to the display of all users’

flimps. This is the

area where you

create your

flimps.

Go to distribute page for various

distribution channel options.

This is where flimps are

distributed.

Go to the flimp

reports section for

all analytical reporting.

Provides a summary report of total viewing

time for all flimps in account.

Provides a summary report on the most recent flimps viewed.


The Create and Edit Function

The Create and Edit function will display your list of non-deleted flimps. You can click this link at any point, even during editing, to return to your flimp list. It is a good way to “revert” should changes be made to your flimp that haven’t been saved but you want to undo. You can either choose action on an existing flimp or click create a new flimp.


The Create and Edit Function (continued)

Clicking Create a New Flimp is self-explanatory. After entering a flimp title and description, a new flimp is added to the active flimp list.

Click “Create a New Flimp” Enter flimp’s title and a short description.

The canvas for the new flimp will appear in the first position.



Moving the mouse cursor over a flimp expands the flimp and displays the options available for that flimp, as shown:


• Edit/Preview brings up the drag and drop FLIMP editor (explained on page 8 of this document).

• Clone allows a duplicate copy of a flimp to be created which can then be independently edited and saved. This function is helpful for multiple flimps in a campaign, etc.

• Delete removes the flimp and all of its properties from the flimp list. If a flimp is deleted, all instances of the flimp are removed, including any analytical reporting.



Blank canvas—drag user interface elements here to create a flimp

The Flimp Platform Editor


Creates a snapshot and saves the flimp. Must save for Preview function to be “current”

Single line text (label)

control

“Rich Media Text Box” - multiple line formatted text control

Image/graphic control

Video control

Button control

Preview button—save first, then preview flimp as user will see it. No tracking is recorded in preview mode

Precise placement controls

Layering controls

Insert Shapes

Change the description, background, Size, and Shape of your Flimp. Click to set the flimp size along with background color, any border, and a background image

To create on a flimp canvas, click on an icon, drag it into the blank canvas, populate the field and then move it to the desired location on the canvas.

Form Builder



Populating Image Library and Video Library


Import a New Image

There are two ways to add an image, the first way is to import from your hardrive - a three step process.

1) Select an image from your hard drive or network drive using the standard file upload dialog. Allowable formats are .png, .jpg, and .gif. To use an image from another website, right click the image, select “Save this picture”, save it to your hard drive, and import it into the FLIMP Platform from there.

2) Wait for the upload to be completed. Images must be uploaded to the flimp servers before they can be used in your flimps. The upload process will vary in time according to your connection speed and the size of the source image.

3) Upon upload completion, the image is displayed and reduced in size if the source image was larger than 1024x768. A thumbnail of the image is automatically created for display in the image library. Enter a title and description for the image. The image will then be available in the image library.


Image Library:

Helpful Hint: Once an image is imported into your library, it can be used either as a Background Image (when setting up a Canvas) or as an actual Image within your canvas.


The Create and Edit Function (continued

Image Library (continued):

Grab an ImageThe second way to use an image is to grab the image straight from a website using the image’s URL address.

1)Right click on the image you would like to use. 2)Click on “Properties.”3)Copy the URL address of the picture.4)Click the box next to “My image file is located under a specific URL. Grab it from there.” and paste the image URL address in the box below it. Click Grab.5)Upon upload completion, the image is displayed and reduced in size if the source image was larger than 1024x768. A thumbnail of the image is automatically created for display in the image library. Enter a title and description for the image. The image will then be available in the image library.


The Create and Edit Function (continued

Image Library (continued):

In addition to the “Image Library” link, images can also be added in the following areas:

1) In Flimp Settings>Properties – using the “Select an Image” link.2) Dragging in the “Image” icon and uploading a choosing the “Upload or Select an Image” link.

Flimp Settings>Flimp Properties Image icon upload



Video Library

Click link to upload a video to your library or select a video already in your library



Video Library (continued)

Videos are imported into your FLIMP Platform video library in the same way that images are uploaded into the Image Library. Video must be saved in a .flv format.


Uploading a video to the flimp servers is largely the same as the process to upload an image with an important exception — a thumbnail must be created for the video

Verify that the duration is filled in here. If it shows up as -1, it means the video was not encoded properly and the playhead thumb will not move during playback

The current thumbnail on file for existing videos or the thumbnail about to be saved for new videos

The thumbnail is sent to the flimp servers as a jpg along with the video title and description

The video plays at the full original size

Use the pause button to help with creating a

thumbnail so the video does not pass the point

you want to capture

Click this button when the frame is on the scene you want to represent your video in the video library and within the Flimp

Platform layout tool


Video Library (continued)

Helpful Hint: You can hit the green play arrow to replay the video to find the perfect thumbnail.


Creating a flimp should be done in the following steps:

1) Click “Flimp Settings” to set your flimp’s size and background attributes.

2) Drag the elements needed to create your flimp one by one to the canvas and set their attributes accordingly.

3) Save your flimp.

4) Preview your flimp. You must save your flimp before previewing it.

5) Modify any placed user interface elements as necessary.

Using the FLIMP Editor



Flimp Settings:


The Flimp Settings feature lets you set up the basic parameters of your flimp. This includes setting the size and shape, background/border features, and choosing to use an image either as a background image or a watermark. You can even change the Flimp’s title and description.

Helpful Hint: The Transparency setting can be used to give you more color palette options.

100% Color 50% Color

The background color partially transparent so

the background can show through or an

imported image can be p

Note: Once you select a background image, a link titled “Clear BG Image” will appear. Click this link if you would like to erase the background image.


The Create and Edit Function (continued)Canvas Settings (continued):

• The Flimp canvas defaults to 640x460 slate width and slate height. But you can change it to any size.

• Change Flimp Title and Description lets you rename the flimp.

• The Background and Boarder Colors dialog is used to change the canvas color from white with no boarder to any background color or any boarder.

• The Add a Shadow or Rounded Corners allows you to shadow your Flimp (making it look 3-D) or customize the shape of your Flimp. Please Note: Rounded corners do not work on a flimp videosite that has a full-sized background image.

• Show “Play” arrow places a graphic “play arrow” on top of your flimp. An example appears on page 20.

• The Select an Image button brings up your image library (shown on the following page). You can delete a background image by selecting Clear BG Image.

Helpful Hint: The Border can be made thicker (and more visible) by increase the boarder width.


• The Select an Image button brings up your image library, as shown. All images previously imported appear in the scrollable visual list.

• Click Selected an Image button to select an image to use as a watermark in your flimp. If you have created your flimp’s background design in Illustrator or Photoshop, this is how you will import your background.

• Clear BG Image removes the image and image thumbnail from your library and from the flimp servers.

• Note: It is important not to delete any images which are in use on distributed flimps as the images will not appear on these flimps after they are deleted.


Canvas Settings (continued):


• The Play Arrow visually prompts a viewer that the flimp contains a video.

• When a video completes or if a video is set to not play automatically, the video snapshot will appear along with the play arrow. You can click the entire arrow to play/pause the video. This is an automatic feature. You will only need to select the show play arrow option in “Flimp Settings” if you want the play arrow to appear with your flimp distributions.


Canvas Settings (continued):

Flimp Distribution Flimp Video Player


Adding User Interface Elements to a Flimp

1) Decide which element to place. The choices are Single Line Text, Rich Text Box, Image, Video, Button, Form Builder, Shape, and SWF File. See the next page for a refresher on where to find each element.

2) Drag the element from the toolbar to the canvas.

3) A dialog box appropriate for the element is displayed.

4) Set up the element to suit your needs.

5) Drag the element within the canvas boundaries to where you want it placed.

6) Resize the element if necessary. Images, Rich Text Box, Buttons, Shapes and SWF Files can be resized by dragging the resize handles. Rich Text areas will automatically add a vertical scrollbar if needed.

7) Double-click an element to edit it.

8) Press the Delete key on a selected element to permanently remove it. On a Macintosh system, you will need to use the Function-Delete keys together.

9) Move an element using the arrow keys and manually type in the x, y, width, and height in the precise placement controls to accurately place an element.

10) Use the layering controls to layer elements on top of one another (pages 36-37).



Blank canvas—drag user interface elements here to create a flimp

The Flimp Platform Editor


Creates a snapshot and saves the flimp. Must save for Preview function to be “current”

Single line text (label)

control

“Rich Media Text Box” - multiple line formatted text control

Image/graphic control

Video control

Button control

Preview button—save first, then preview flimp as user will see it. No tracking is recorded in preview mode

Precise placement controls

Layering controls

Insert Shapes

Change the description, background, Size, and Shape of your Flimp. Click to set the flimp size along with background color, any border, and a background image

To create on a flimp canvas, click on an icon, drag it into the blank canvas, populate the field and then move it to the desired location on the canvas.

Form Builder


Dragging a single line text to the slate displays the following dialog. Note the annotations in the screen shot.

Letter spacing makes the characters your type closer or further apart

Text can be partially

transparent so the background

can show through

Similar dialog to what appears for the flimp canvas setting background

You can make your line text a link by clicking this button. A dialog box will open. See page 22.

As text is typed here it appears real-time in the preview window

The fonts in this list are almost guaranteed to be

on every Mac and Windows system


Adding User Interface Elements to a Flimp – Single Line Text (Label) Control

Helpful Hint: After you enter in the text, you can easily change the text style by selecting the feature you want to change. You do not need to highlight the text.



Adding User Interface Elements to a Flimp – Single Line Text (Label) Control (cont.)

Helpful Hint: Text can be repositioned on the page by clicking on the text line directly on the canvas. A light blue box will appear. You can move the text by dragging the box.


Links can be created from labels (single line text), images, or buttons. Links embedded in multi-line text elements (rich media text) do not use the dialog box below.

Notes about links:

1) Choose either a link to a URL, an email address, or a pre-fab form on file

2) Type the appropriate information if a URL or email address. For URLs, type a simple tracking identifier in the indicated box. This identifier will display in the reports every time the associated URL is clicked.

3) The “Email to a Friend” and “Response” forms can be selected as the target of a link.

The Create and Edit Function (continued)Adding User Interface Elements to a Flimp – Single Line Text (Label) Control (cont.)

Adding User Interface Elements to a Flimp – Creating a Link


Select “Email to a Friend” form to let viewers forward their flimp virally to other viewers.

Select “Response” form to collect viewer contact information.

The Create and Edit Function (continued)Adding User Interface Elements to a Flimp – Single Line Text (Label) Control (cont.)

Creating a Link (continued)

Example: Email to a Friend Example: Response


Formats, fonts, and other styles can be mixed in the same text area

Copy text in from other sources or type it here and format it in place

Select the text to be made into a hyperlink and type the link here. Add an underline or other formatting while the text is still selected to differentiate your links from the rest of the text.

All of these formatting options can be applied to selected text or newly typed text

This is the same background dialog as

used throughout the application


Adding User Interface Elements to a Flimp – Rich Text Box Control


• An image can be selected from the existing Image Library. This process is exactly the same as described earlier for the Canvas properties. Refer to pages 9 – 11 for instructions.

• Image features include Image Transparency, Add a Shadow or Rounded Corners, as well as the ability to make an image a Trackable Link.

• Trackable links can be renamed in simple words, for easier reporting and analysis. Refer to pages 24-25 for instructions on creating a link.


Adding User Interface Elements to a Flimp – Image Control


Access your video library on the FLIMP servers

Information about the currently selected video. Use the original video size to help determine an appropriate player size below

Options for the flimp videosite the end users see

Select an appropriate video player size based on the original aspect ratio of the video and the overall size of the flimp


Adding User Interface Elements to a Flimp – Video Control

Importing a video functionality behaves in the same way that importing an image behaves. Refer to pages 12 – 14 for instructions.


• The button tool enables you to create buttons or boxes. These elements can be linked to a URL, email address, “Email to a Friend” form, or a “Contact Us” form. Refer to pages 36-37 for instructions on how to create a link.

• Experiment with the different settings in the button dialog until the button looks the way you want it. The gray slashes are displayed in the preview area to show the button’s level of transparency.


Adding User Interface Elements to a Flimp – Button Control


• The form builder tool enables you to custom forms for data collection. Custom forms, that appear as a set element on your flimp canvas, let you collect data that can be used to build your email lists, contact interested prospects, etc.

• Once a viewer fills out a form, the information appears in the flimp’s report if you have the “Send to Flimp Dashboard” option selected.


Adding User Interface Elements to a Flimp – Form Builder Control


To create a form:• Drag the “Form Builder icon” onto your canvas. • Name your form. Select a font/color/size for your form’s headline, form fields and a background

color for your custom form.• Select where you want the form data to be sent. Form data can be sent to another web page.• Provide an email address for a notification to be sent to after someone completes a form.• Select your form fields and chose if you want the form field to be required in order for someone to

complete the form.


Adding User Interface Elements to a Flimp – Form Builder Control (continue)




Fields to name form and select the form’s presentation style.

Fields to select where the data gets posted to and to provide an email when someone completes the form.

Create form fields here. Item Label: data that you are collecting (i.e., First Name, email, etc.). Once you enter the Item Label, select if you want to validate it against an attribute and then select “Accept.”

Once the form has been built select “OK.”

As elements are selected, they will appear in this visual editor. Items can be edited, deleted, moved up or moved down by placing your mouse into the form field and then selecting the desired action.




Example of a flimp with a form.

Note: a completed form can be placed anywhere on a flimp canvas.


Adding User Interface Elements to a Flimp – Adding Shapes


The Shape tool allows you to add shapes to your Flimp. You can add a line, rectangle, rounded rectangle, circle, ellipse, or triangle.

•Border and Fill Colors allows you to choose border thickness, color, and fill color of your shape.•Add a Shadow allows you to add a shadow to your shape making it look 3-D. You can choose the color and length of the shadow as well.•Shape Transparency lets you choose how transparent your shape is.•You can also change the direction of lines and triangles.


Adding User Interface Elements to a Flimp – Importing a SWF File


1)Find the SWF file you want to use.2)Click on “Properties.”3)Copy the URL address of the picture.4)Click the box next to My SWF file is located under a specific URL. Grab it from there and paste the image URL address in the box below it. Click Grab5)Upon upload completion, the SWF is displayed and reduced in size if the source image was larger than 1024x768. A thumbnail of the SWF is automatically created for display in the SWF library. Enter a title and description for the image. The SWF will then be available in the SWF library.


Bring to Front – click to move the selected element to be “on top” of all other

elements on the flimpSend to Back – click to

move the selected element to be “underneath” of all

other elements on the flimp

Send Backward – click to move the selected element

closer to the back of the display order

Bring Forward – click to move the selected element

closer to the front of the display order

With an element selected, type the width, height, left (distance from the left

side of the flimp), and top (distance from the top of the flimp) values in

pixels . The selected element will be resized and moved accordingly.

Layering Example:

A flimp with three button controls:


Adding User Interface Elements to a Flimp – Precise Placement and Layering of Elements


Select the button labeled 111 and click “Send Backward”:

Select the button labeled 333 and click “Bring To Front”:


Adding User Interface Elements to a Flimp – Precise Placement and Layering of Elements (continued)

Helpful Hint: For a flimp with a lot of separate images, you may have to select the Precise Placement and Layering Tool to enable your images to appear. Select this tool each time you add in a new image or text element.


When the Distribute feature is selected, you are brought to a window with several different channel options with which to distribute your flimp.

The Distribution Function

As you scroll through the distribution features, an overview of each distribution feature will appear to the right o the box.

A history of all the distributions

tied to the FLIMP Platform

account.

Helpful Hint: To easily locate a particular flimp, you can click on the headers of each of the “Your Existing Distribution” columns to sort through your flimps.

Click on button to generate a click

report related to the distributed flimp


The Distribution Function (continued)

Flimp Email

• Flimp Email is for one-to-one distributions. This option lets you email your videosite for free to small distribution lists of up to 250 emails.

• You can import and manage your email contact list and personalize your distribution message by name.

• Flimp Email is recommended for one to one communications, sales prospecting communications and small, targeted direct response campaigns.



Flimp Email (continued)

• The FlimpMail distribution has eight-steps in its set-up process.

1. Name the quick email distribution. The distribution is given a name so you can easily pull performance reports.




2. Select the flimp(s) you want to distribute. If you would like to send multiple flimps, click on the “CTRL” key on your keyboard and then select the flimps you want to send.




3. Type in Your Name, Your Email Address and the Email Subject.

4. Provide a short description of the flimp. Please note: Either include a short message OR delete the “Enter your flimp’s write-up here” text placeholder. If the placeholder text is not customized or deleted, it will appear with the emailed flimp.

Use the following simple HTML to format copy:• Name (pulled in from an email list ) – [~FirstName~]•Bold - WORD•Italic - WORD•Single Line Carriage Return - placed at the end of the line.•Double Line Carriage Return - placed at the end of the line.

This is how the copy might look:

Dear [~FirstName~], Here is my flimp. I hope you like it! Thank you. FLIMPMedia

And it would render like this:Dear John,

Here is my flimp. I hope you like it.

Thank you.FLIMP Media




5. Select the recipient(s) by selecting either the “Existing Contact List” button or Manual option.




6. For the “Existing Contacts,” you may either Add, Remove or Manage your contacts.

Select the “Add from Contact List” to add contacts. FlimpMail displays a count of all the recipients selected for the distribution.




6. For the Manual option, email addresses can be separated by either comma or semi-colon. Up to 50 emails can be listed for this option.

7. Incorporate a personalized message. The email can be personalized with a recipient’s name or company by incorporating either [first] (for first name) or [company] (for Company). Please note: Either include a short message OR delete the “Enter your flimp’s write-up here” text placeholder. If the placeholder text is not customized or deleted, it will appear with the emailed flimp.

Helpful Hint: Use if you need to have your message appear with formatted lines or spaces between lines of text.




8. Send the email.




Example of how the Flimp Email appears to the recipient.




Email Settings Option:•Flimp Email can be set up to be sent from your own email server. This means that the emails are delivered as if they were sent directly from your email client. •Add your outgoing mail server information, your email user ID and email password to set up the email settings.




Add your outgoing mail server information, your email user ID and email password to set up the email settings


Create a Unique URL Weblink

Create unique URL addresses and weblinks for your flimp microsite to use as landing pages for press releases, paid search, text ads, banner ads, or simply send a web link to others via an email or blog. Recipients can click the link to launch the flimp microsite landing page.



Create a Weblink (continued)

Select flimp to be distributed and click “continue.”



Create a Weblink (continued)

Follow the displayed instructions.



Send through your existing ESP


FLIMP Platform users can distribute flimps via a number of different email ESPs including:• Publicaster• Constant Contact• Exact Target• Vertical Response• Other Provider

To distribute flimps through Constant Contact, Exact Target or Vertical Response, you must have an email account with one of those providers.

Flimps distributed through Constant Contact, Exact Target, Publicaster, and Vertical Response will track at individual email address engagement within the Flimp Report.

Emails sent through other providers, at this time, cannot track at individual email address engagement.


Send through your existing ESP (continued)

Send through your existing ESP• Select this option for distributing flimps to a mass audience.• Enables you to send flimps through any ESP or email platform that you hold an account for.




• After clicking the “Create” button, select the desired distribution option and then click continue. • You must have either a Constant Contact, Exact Target, Publicaster, or Vertical Response

account in order to distribute a flimp via one of those ESP services.• Follow the multi-step process for preparing your flimp for distribution. • In the future, other email ESPs will be available as an option.




Publicaster Email

• Requires a Flimp Media-Publicaster license.

• Use to distribute to an unlimited number of recipients.

• Instructions for Publicaster distribution are included in the Publicaster Addendum User Guide.



Create HTML Thumbnail Link

Generate the HTML code needed to add a link or graphic snapshot of the flimp player to your website or blog. The snapshot will launch the flimp when a user clicks it.



Create HTML Thumbnail Link (continued)Select the flimp microsite you want to generate the HTML code for.



Create HTML Thumbnail Link (continued)• Generating Website HTML code is a five-step process.

1. Track the source of your flimp views by naming this HTML source.



Create HTML Thumbnail Link (continued)2. Either delete the placeholder copy or enter in text (if you want text to appear with your

thumbnail).



Create HTML Thumbnail Link (continued)3. Select your layout style.



Create HTML Thumbnail Link (continued)4. Select color customization features.



Create HTML Thumbnail Link (continued)5. Follow instructions.



Embed as Flash into a Webpage

Generate the HTML code needed to add a link or graphic snapshot of the flimp player to your website or blog. The snapshot will launch the flimp when a user clicks it.



Embed as Flash into a Webpage (continued)Follow instructions.



Optimize for Search Engine Marketing


Embed into your Website with SEO feature:• Generates the flash code needed to embed your flimp into a webpage or blog so that it

plays automatically when the webpage/blog is visited.• Also includes the ability to put Search Engine Optimization (SEO) text within your embed

code so that your flimp can be searched and found by search engines.• Use this option if you intend on using your flimp as a landing page or as part of your

website.• The Flimp.net homepage uses this same exact technique for generating SEO behind our

homepage flimp.


Optimize for Search Engine Marketing (continue)


• Optimize for Search Engine Marketing (SEM) is a four-step process.

1. Track the source of your flimp views by naming your SEM distribution.




2. Select your flimp




3. Enter in text/keywords you want the search engines to index.




4. Follow instructions.


Distribution Details• A report based on the distribution features can be generated directly within the “Distribute” view.

• Reports are available for any distribution that has received 1 or more views.

• This report view can be used to analyze the results generated via a specific distribution. Full reports, detailing the overall performance of the flimp, are available in the “Report” section of Flimp Platform.

• Access the report view by clicking on “See Details” button.



Distribution Details (continued)A sample of the “Distribution Details” report.



Distribution Details (continued)By clicking on the “Export This Data” button, the report will populate into a Notepad.



The Report Function

Selecting Reports brings you to the Flimp and Date Selection window in which you can select which flimp to be reported on. Flimps are shown by title and date last modified.


Upon selecting the flimp(s) to be reported on, a reporting window shows a Campaign Traffic Monitor, Key Performance Indicators, and Message Engagement Indicators.

Allows you to narrow in on specific dates or time periods

during for the duration that the flimp was live

Allows you to select other flimps to report on

Identifies key statistics for the live flimp during the given time period

Shows break down of which links were clicked on the live flimp

Allow for resizing of each sector for better viewing

The Report Function (continued)

Refresh for up to the minute data

Displays email addresses for any individual activity. Click on the activity (such as a graph bar in the Campaign Traffic Monitor or the a section of the Message Engagement Indicator) to generate the individual activity report.

Select data to be exported to a tab delimited file for importing into

spreadsheets for additional analysis


Data and graphics automatically adjust when the viewing period is changed




To obtain more performance information, click on the titles of the Key Performance Indicator links.

the flimp platform (dc) dashboard can be accessed by pointing your web browser to

Documents