Review: Flite Design Studio HTML5

By Nathan Segal

In this review we look at Flite Design Studio HTML5, a web-based program which is part of the Flite platform. Its purpose is to allow you to create and control advertising for desktops, tablets and mobile devices.

The default screen of Design Studio HTML5, with a starter video.

When I first launched the software I found I was unable to go beyond the first step because everything on my browser was grayed out (Google Chrome). I also tried to use the software on Firefox with the same result.

After getting in touch with tech support I was told that my popup blockers were preventing the software from working. I turned off the popup blockers in Firefox, but despite rebooting the browser I was unable to get the software to work. Ultimately, the solution was to uninstall Firefox, delete all my user settings, and reinstall it. Once I did so, the software worked.

In the case of Google Chrome, I uninstalled and reinstalled it. I made sure to disable most of my extensions and run a clean version of Chrome.

When I did so, Design Studio launched and the previously grayed out areas became available to me (as in the above screen shot. This was available when I clicked on Make New Item: HTML5 Ad.)

When you install Design Studio 5, you get access to a 2 minute quick start video which gives you an overview of what the software can do. After that, you have access to a help system for learning the program. This is where I encountered my first major disappointment. What I found were descriptions of the tools and their operation but no tutorials on how to build a project, save for the opening demo video.

The other thing I found frustrating was the reliance on text for many of the descriptions and few graphics.

In the absence of neither additional tutorial videos nor print tutorials, my only other option was to use the getting started video. Unfortunately, when you choose to use the software, you have to close the video and there's no obvious way to bring it back. My workaround was to open the software in another browser (Firefox), keep the video open there and use it as my guide to work through the program. If I made the mistake of closing the video, the only way I could bring it back was to close Firefox, launch it again and reopen Design Studio HTML5.

When I contacted technical support, this was their response: "Regarding the video, its display is managed through a cookie. If you were to login via "incognito mode"/"private window," then the video will display on login again. Alternatively, you can throw out the flite.comcookies."

The Inner Workings of Design Studio HTML5

There are four main sections to the program: Getting Started, Edit: Building Ads, Traffic: Trafficking Ads and Measure: Performance Metrics.

To get started, go to: Make New Item: HTML5 Ad.

This brings up the screen above. In this section you have several options. At the top you'll see: Starter Ads, Rising Stars, Mobile Rising Stars and Your Templates. As you mouse over each heading, you'll see different ad styles, all of which are available to you on the left side.

As an example, here's an example of an ad design under Mobile Rising Stars.

At the bottom of this screen, you have two options: New Blank Ad or Import Photoshop (.PSD).

When you click on New Blank Ad, it brings up the section above, which contains quite a few options for building ads. At this point, or in the panel above, you can import Photoshop (.PSD) files.

If you want to build an ad from scratch, the starting point is the Inspector. Here, you define the dimensions of your ad, the border (if there is one), the color of the border, border size, fill and fill color. You can also add layers to your layout as necessary.

Once you've defined the size of your ad you can start adding HTML5 components from the list on the far right.

Here's an example of some components added to an ad measuring 300x250 pixels.

On the far left of the ad is the Layers panel where you can stack and organize your layers and at the far right of the ad are controls for each HTML5 object. You can also add actions and animations to your ad here.

Directly above the layout are several icons. The one to the far left is Edit mode, which the default when you start to build a layout. The second button from the left allows you to interact with your design as an end user. The third button is the preview mode for the ad and the fourth button gives you some extra tools for the workspace, such as the use of rulers.

Once you're satisfied with your layout, you can publish the ad. This is where I had to stop.

The last two sections: Traffic: Trafficking Ads and Measure: Performance Metrics were aspects of the program I was unable to review, mostly because the ads would have to be deployed and tested over time. There would also be a cost factor involved in doing so, which is beyond the scope of this review.

Conclusion

Overall, Design Studio HTML5 seems to be a decent program, but the documentation issues made it challenging to learn. The other issue concerned the popup blockers problem. This is something that should be addressed up-front, before one installs the program.

As mentioned earlier, I had to uninstall and reinstall both Firefox and Google Chrome before the software would work.

 



Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
  •  
  •  
  •  
Thanks for your registration, follow us on our social networks to keep up-to-date