When working with flash movies, it is common to create hyperlinks in the form of buttons that when clicked takes users to external websites. However, there are instances when you don’t want a button, but instead have any text item clickable. If you’re not already aware, Toufee lets you add buttons to your flash movies. Buttons add the interactivity element to your flash movies in the sense that you may jump to a specific section, have the flash movie pause/play at specific times, or eventually open a website link when clicked. This video tutorial (http://www.youtube.com/watch?v=zN_FqGlBduA) actually discusses in detail on how to work with buttons in the Flash Builder.
Buttons as Text Items
What some customers have requested is the ability to add hyperlinks to regular text items. If you look at the current text item option available in the Flash Builder, there isn’t a direct option to hyperlinks text items.
The way around the issue is to use the NoSkin skin-type for the button. This turns the flash button into a regular text item. This virtually creates a text item with the hyperlink features of a button. While internally this item is treated as a button, you may use the regular editor options to change the font, text style, etc on the “NoSkin” -type button.
Note that the instructions/screenshots provided above applies only to the Flash Builder. In the next article, we’ll discuss how to create hyperlinks for flash movies created using the Flash Apps like Flash Slideshow Maker, Flash Accordion Maker, etc.
First of all, wish all our Toufee customers and readers of this blog a very Happy and a Prosperous New Year 2012. As I start to think about the first blog entry for the new year, I decided to cover aspects of the Toufee Flash Builder as well as the Flash Apps that are often overlooked. The items discussed below are those that are frequently asked at the Support Desk but do not have any documentation elsewhere on the site. I hope this blog should add more clarity to customers for now.
Watch out for the filename
When saving your flash movie project, make sure you don’t use an existing project name to save a new project. Toufee simply overwrites any existing project file that exists by the same name without any warning. This applies to Flash Builder-type projects as well as any of the other Flash Apps. This does look awkward and we’re fully aware of this glitch. The technical team is working on putting a warning note very soon.
Popup Blocker message keeps popping up
If you happen to use hyperlinks in your flash movie, then you may noticed that every time that you click on the link, Toufee opens a popup blocker warning window. This happens even if you had turned off the popup blocker setting for your browser. Weird? Well Toufee actually displays this warning regardless of your popup blocker setting, i.e. Toufee displays the warning all times. However, many customers have reported that it doesn’t look any good on their flash movies. We’re coming up with a fix to this very soon.
Clicked the SWF or YouTube download option but no effect
When using the SWF download option, you may have noticed that clicking the SWF icon in the Publish Project window results in nothing happening…you don’t seem to get the SWF download prompt. The same may hold true when using the YouTube download option…absolutely nothing. The gotcha here is that Toufee happens to open a new browser window (that initiates the SWF file download or YouTube video queued message) and this new window gets opened in the background, i.e. you may notice this visually when you have multiple browser tabs or windows opens. So the next time this happens, please do check all open browser windows for the SWF download prompt or the Video Queued message.
No option to delete Image, Audio or Video?
This might be a bomber. The reason that this option was turned off is due to the fact that when you add an image or an audio to your flash movie, Toufee only maintains a reference to the uploaded content and does not embed the image or audio unless to export the flash movie as a SWF file. When we did have the option to delete the uploaded content, users started to delete images that were still in use with other projects and some users deleted the image after adding it to a project thinking it would be saved along with the project file. This resulted in many customer movies going and we had to temporarily turn off the delete option to avoid data loss.
Recently when working with a customer on a video file issue with the Flash Builder, I noticed something interesting that is worth a mention. When you drag an item on to the Toufee Flash Builder movie maker stage, Toufee adds a default Fade In and Fade Out effects to the item. This goes applies to any item – text, image or video. There is no Fade In/Fade Out effects for Sound items as its logical the flash effects are visual in nature. And one day, one of the customers reported that his video file was not getting started immediately and usually takes a few seconds to start in. I initially didn’t realize the Fade In effect myself and found that it could be causing the problem. The Fade In effect duration is nearly 2 seconds so this was the delay customer was referring to. Turning off the setting made the video look much better.
Removing the Fade In effect
To remove the Fade In effect, simply drag the slider for the Fade In such that it is zero. Earlier, we did have an option where one could directly adjust the slanted triangle-like marker (that denotes the effect duration) in the Timing section to modify the flash effect duration. However, this was retired as it was sometimes difficult to work with when the flash effect duration was particularly small (such as a 1 second effect).
You would notice that once the Fade In effect is removed there wouldn’t be the this slanted triangle before the Video label in the Timing bar. This is a visual indication that the Fade In effect does not exist on the item.
The same steps apply to removing the Fade In or the Fade Out flash effect on any item such as text or images.Remember that the Fade In effect property only controls the timing of the “Fade In”. The actual effect, or the effect type is determined by the In Effect dropdown list under the General Properties section. The In Effect property is used to select the effect that would be applied as Fade In.
I hope the last post on setting the Flipbook flash movie size helped to clarify on the most basic setting of a Flipbook flash movie. Continuing from where we left off, I’ll cover the most important settings of a Flipbook flash movie. These settings determine how your Flipbook functions as well as directly affects the look and feel of your Flipbook.
Page Properties
The first setting that we’ll look at is the Book Cover option. When you turn this on, you get a “closed” book, otherwise its a open flash flipbook. Pretty basic, but there is one gotcha that you might want to keep note of. When you happen to change only the width of your Flipbook flash movie with the Book Cover setting on, you may not notice the change visually until the Flipbook opens. To better illustrate, say the initial width is 300px and you increased your width to 600px. If you have a perfect 300px image on the cover, and because the flash movie background is transparent, you would have to wait till the book cover opens or manually flip the page to notice that the Flipbook indeed resized. This may not be a big deal as it sounds and you may very rarely run into such a situation but though I’d keep you posted on this as well.
Page Size and Page Background
The Page Size option lets you switch the page style between the conventional book style (where each side is a page) and using a single image per slide (not sure how better to put it). The Half Page setting puts your images on both the left and right sides. The Full Page setting puts just one image on the left page while leaving the right page blank. Below is a sample flash movie that illustrates this.
Since the Half Page setting is obvious I preferred to illustrate the Full Page setting. Note that when you set a Page Background color, the blank page takes the chosen background color. The Page Background color may not be of any use unless you use the Full Page setting. While we see most customers tend to use the Half Page setting, there maybe instances when the Full Page setting might actually come in handy. This was the reason we preferred to have it, as you may never know
Page Turning
This is a cute setting…If you would like to have the page turn just like how you’d do it when you’re holding a real book, then remove the checkbox on the Hard Pages option. Turning it on makes the turning of pages rigid, something that you’d want to have if you are trying to create an “album” style Flipbook flash movie.
Note that when you have the Book Cover setting turned on, the first and the last pages (typically the cover images) would always take a hard page turn even if you had turned off Hard Pages.
Automatic Page Flip
While the setting itself is obvious, if you set it to auto-flip the Flipbook continuous to loop the pages and when it reaches the end, it flips the book and then starts all over again. Also be prudent when setting the time interval based on the content that is displayed on each page. On most occasions, we’ve seen customers let it to manual flip as most would prefer to flip the page at their own convenience.
I hope that this article was useful and I hope it would help you when creating your next Flash Flipbook project.
The Flipbook is a very popular flash application widely used by customers and many flash web designers who use Toufee. We’ve seen many queries regarding the Flipbook and the intent of this blog article is to cover in detail the basic settings of the flash Flipbook.
Getting the Flipbook Size Right
The first setting that you must decide well before creating the Flipbook is its size. The Flipbook Size is the size when the Flipbook is in the open position, i.e with pages on both sides.
You will notice that there is no separate setting to set the size a Flipbook page. The width of a page is 1/2 of the overall width of a Flipbook. The height of a Flipbook page is the same as the height of the overall Flipbook flash movie size. So if your Flipbook Size is 640 (width) and 365 (height), then the size of your page would be exactly 320×365.
What should be the size of the images used for the individual pages? The recommendation is to use your images as your point of reference when setting the Flipbook size. If a majority of the images are say, 200×500, then we recommend setting your overall Flipbook Size to 400×500. It is easier to set the flash movie to the size of your images than resizing your images to suit your flash movie. This recommendation applies to all the Toufee Flash Apps – your images should always be your point of reference when deciding the overall flash movie size.
What if the images are not the same size? f you couldn’t manage the same size images, then try images that are proportionate in size. For example, if your images are 200×500, then the width to height ratio is 1:2.5. If one of your images is 300×750 then it should work as Toufee tries to automatically adjust the image to the Flipbook page size (which is 200×500). Using an image that is out of proportion from the rest will still render the Flipbook but only that it would look odd.
In this article, I’ll quickly walk through the steps involved in downloading your Toufee flash movie as a standalone SWF flash file. Though the process is straightforward, let me show you the various ways you could download the flash movie as a SWF file. Let’s begin right away.
SWF download process
To export your flash movie, select Publish -> Export to Flash (Standalone SWF) option from the main Toufee menu
The Downloading SWF file dialog box should open.This will be followed by an Open dialog box that should prompt you the location to save the SWF file. Browse the directory in your computer and click Save. That should complete the download process. However, if the Open dialog box does not appear then proceed to step 3.
If for any reason you do not get the Open dialog box, click Save As button found in the Downloading SWF file dialog window (shown above). This will initiate the download of the SWF file as a zip file.
You would now need to uncompress or unzip the zipped file. For this, you would require a free utility such as WinZip, WinRAR etc. If you have Windows XP or Vista, then there is a built-in feature that will extract zip files simply by right-clicking on it
Upon successfully extracting the zip file, you should see the SWF file in the same folder (if you extracted by selecting Extract Here option) or in the target folder that you extracted the flash movie SWF file.
Manual download of Toufee Flash Movie SWF file
If clicking the Save As in step 3 did not intiate download of the zipped file, then you could follow the manual approach to saving the SWF file of your flash movie. Here is how:
In the Downloading SWF File dialog window, click on Copy URL!. This will copy the URL of the SWF file in memory.
Open Firefox, and enter the URL in the browser address bar and press Enter key. This will then open the SWF file of the flash movie in the browser window. Select Save Page As option to save the SWF file.
If using Internet Explorer, then you would have to do the following. After pasting the URL in Internet Explorer’s address bar, select Tools -> Internet Options
Under Temporary Internet files section, click on Settings button
In the Settings dialog box, click on View Files button
The Temporary Internet Files folder on your local computer should open. Search for the SWF file, right-click it and select Copy
Paste the SWF file into any folder and you now have the SWF file of your Toufee flash movie ready. You can publish the SWF file to your webpage. For the HTML code to use embed the flash movie SWF file in your webpage refer the following KB article:
I recently came across an issue where Toufee users who use Microsoft Outlook did not find the “Save Target As” option when they right-click the AVI video download link in the email that they receive after their flash movie is converted to video. The reason being that the “Save Target As” option is only available if you access your email via a web client (typically via your browser). The workaround however is this:
Save the following code as a HTML file. Open Notepad, paste the code and select File -> Save As option and enter “AVI_download_script.html” (with quotes)
<!- AVI Download workaround ->
<HTML><HEAD><TITLE> AVI Download Script </TITLE>
<SCRIPT LANGUAGE="javascript">
<!--
function createPage(aviURL)
{
document.write("<html><head>");
document.write("<BR>Click the link to download the AVI file or right-click link and select 'Save Target As' or 'Save Link As' option <P>");
document.write("<A HREF='"+aviURL+"'>Download AVI file</A>");
Enter the download link from the email into the textbox and click Download button
You should see a new page generated with the link Download AVI file. Right-click this link and select Save Target As option (if using Internet Explorer) or Save Link As option (Firefox) and you should be able to download your flash video.
Hope the workaround was useful. Meet you in my next post!
We’re sometimes hit with questions from our users (many of them flash designers and advanced flash users themselves) that lead us to think how customers are using Toufee Flash Movie Maker to create complex flash movies that we never though of. This post is the result of a recent query from a customer who designs flash websites with Toufee. This customer had a specific requirement where he wanted to delay the start of background music that is added to the flash movie. Though there is no option that does this straightaway, Toufee Flash Movie Maker with its hundreds of features certainly provides workarounds that can come in handy.
The solution
I really didn’t know how to delay the start of the background music until one of my senior colleague told me the trick. The idea is to add the background music to an invisible text object instead of the entire flash movie. Once the background music is added to the text object, set it to show after x seconds (i.e. how many seconds you want to delay the background music) and set its timing so that it is “live” throughout the playing time of the whole flash movie.
Step-by-Step
So here is how you go about doing it:
Place an “empty” text object in the first frame of the flash movie. If you’re not able to leave it empty, then use input the period symbol (.) as the text and set the Font Size to 1 so it is visible the least.
Set the color of the text to match the background of the flash movie frame so it creates a near invisible effect.
Set the text object such that it loads along with the second frame but is played the entire length of the movie. To do this, click on the text object, switch to the Advanced tab on the Left Panel, expand Timing (Experts Only) option and make sure the settings look like below:Show It: 5 secs (the delay time before the background music starts to play) After: Frame1 shows Then Hide It: Custom… Hide After: Total Playing Time – Timing of First Frame (Assuming a total playing time of 32 seconds, and the timing of the first frame is 2 seconds, then you would enter 30 seconds)
Add the background music to the text object, i.e. Hold the SHIFT key, drag and drop the audio file over the text object. This adds the music to the object so that the music plays as long as the object is shown on screen.
Hope this is useful. Again, it is you, our customer, that really keep Toufee Flash Movie Maker kicking. It’s your queries on creating flash movies and about the various flash movie features in Toufee that makes us push up the bar everytime. And we only hope it keeps rising.
If you had used the Paused at Start option for your Toufee flash movies, and if you had tried to download this flash movie as SWF file to your PC and play it back, you’ll notice that the “Paused at Start” option does not work anymore – the SWF file of your flash movie would just start to play. Why is it so? This is by design. The reason being when you download a flash movie as SWF, then most often then not you would want to have the SWF play automatically. That makes perfect sense. But there are instances where you might want the “Paused at Start” option to stay with your SWF flash movies as well. Here is how you do it:
1) We’ll first create a copy of the original flash movie. We’ll be working with this newly created copy (and not the original project…nope!). Follow the below KB article to create a copy of a Toufee flash movie project:
2) Alright, looks we’re ready to roll. Open the newly created flash movie project in Toufee. Before doing anything else, turn off Random Effects. Refer the following article for instructions:
Toufee usually adds random flash effects to new flash movie objects. As we’ll be adding a flash button that will act as the Play button that will start the movie play, we do not want any kind of effect added to it by default.
3) Create a new frame by selecting Frames -> Add New Frame option. A blank frame would be added but we’ll need to move this frame to the beginning so that it is the first frame of the flash movie. To do this, select Frames -> Change Frame Order. Select the Frame that was newly added. Usually frames are numbered from Frame1 to FrameN, so most of the time, the newly created frame usually has the highest frame number. Select the appropriate frame and click Move Up. Do this until the new frame moves to the top of the list
4) Now here is an important step. What we’re now gonna do is mimic the original first frame of the flash movie. If you are using a common background for your flash movie, then the blank frame that you’ve just added will also take that background and no more action is required so you can directly jump to the next step. However, in scenarios where you are using flash movies where every individual frame is distinct (e.g. flash movie photo slides), then you need to create an exact replica of your second frame (the original first frame). To do this, select the second frame in your flash movie and select Publish -> Export Frame as JPG option. This will create a JPEG image of your frame which you can then upload to your Toufee account and add to the first frame thereby creating an exact replica.
5) Alright, what next. Two important things remain. We need to set the timing of the first frame to 1 second (yes no more than a second). To do this select the first frame, switch to the Advanced tab on the Left Panel, expand Timing (Experts Only) option. In the Frame Length field, enter 1 as the value. Also, make sure you enable the On Frame End Pause Movie option. This option is your workaround so don’t forget to enable it. Enabling this will cause your flash movie to Pause as soon as soon as the frame loads since we set the timing of the first frame to 1 second thereby creating a “Paused at Start” option effect.
6) Are we done? Nope, not yet. We paused the movie alright but show we not add the option to resume the movie. Well you could argue that you can use the Play control (just beneath your flash movie) to resume playback but generally, people do not prefer the flash movie player controls on the SWF so you wouldn’t find the Play button 9 out of 10 times. How do resume the playback then? Add a flash button and create a link to the second frame. Click on the Buttons option on the right panel, choose a flash button (I would prefer to choose one under the Glass category. We’ve found the “Glass” buttons go down nicely with most flash movies), and add it to the first frame. Double-click the button to change the text (to say “Play” or “Start” or whatever you feel like). While the button is still selected, switch to the Advanced tab on the Left Panel, expand Link To – Website / Email option. In the Link To dropdown list, select Frame as the value. in the Frame # field dropdown list, select the corresponding frame number of the second frame.
That is it. You can now download your flash movie as an SWF file and you would notice your SWF flash movie will pause when loaded. The flash movie automatically resumes when you click on the button in the first frame. Hope this was helpful. See you all in my next post.
Not many customers might know that Toufee support publishing of its flash movies on websites that use SSL. When you try to publish a Toufee movie HTML code, you might encounter the following warning message:
Though clicking Yes would still allow the browser to stream the flash movie over HTTP from our servers, if security is paramount and you don’t wish to compromise, then worry not as you’ll see below you can turn your Toufee flash movie to be securely streamed by simply changing a few lines in the flash movie HTML code that you get from the Publish window. However please note that this feature is only available to Business customers.
Let’s look at an example of a normal flash movie code below:
We’ll be doing a couple of changes to convert the above code so that it supports SSL hosting. Here is how:
Remove the <IMG> tag from the code.
Replace all occurrences of HTTP with HTTPS
Replace the line http://pro. with https://www. Please note that you will have to do this at two places in the code
If you are planning to host the Toufee flash movie SWF file on your own SSL website, then you don’t have to follow this process. The above steps are required only if you use the HTML code generated from Toufee in which case the flash movie that is streamed by default over HTTP from Toufee’s servers.
The way around the issue is to use the NoSkin skin-type for the button. This turns the flash button into a regular text item. This virtually creates a text item with the hyperlink features of a button. While internally this item is treated as a button, you may use the regular editor options to change the font, text style, etc on the “NoSkin” -type button.
