Animate Marketing Visuals with Visme

by 1 04/21/2014

If you’re looking for a way to bring visual content to life, then Visme could be the answer. Formerly known as Easy Web Content Presenter, the free browser-based tool allows marketers to easily create a range of visuals, including:

1 EWC  Visme home page

  • Web and mobile animations
  • Presentations
  • Infographics
  • Banner ads
  • Graphs and charts
  • Product demos

In open beta for just over a year, Visme is based on HTML5, which means all content works well on mobile devices too. The developers say it is “so easy your grandmother could use it,” while having enough depth for experienced designers. I consider my skill level somewhere between the two and took the tool for a spin.

2 EWC Dashboard

Before getting started, I watched the brief tutorial video to get an overview of how Visme works. This was time well spent and I found the help file useful too.

First Steps

3 EWC create project

There’s nothing to set up with Visme; just login to the web dashboard.

At the start, you get a number of colorful icons representing the different project types: custom, presentation, banner ad and infographic (product demo was greyed out, so maybe that’s coming later). Hovering the mouse over each icon brings up a longer description of each. Since infographics and visual content are so hugely important to marketers, I made this the focus of my first trial.

Getting Started with Infographics in Visme

4 EWC project types

5 EWC infographic themes

Clicking on the infographics icon brings up a carousel of infographic templates. Click to rotate through the templates, choose one, then click on the “use this theme” button to select your choice.

The full-size theme will appear in the center of an editing window. The editing window has save, preview and publish buttons at the top, a timeline view button and objects list in the sub-navigation menu (this gives a list of every object used in the infographic), and other tools and zoom buttons to the left of the screen.

It’s worth noting that the objects list lets you lock items in place, toggle visibility (useful if you’re not sure whether a particular graphic element works or not) or delete items.

Editing with Visme: Background, Text and Shapes

6 EWC infographic editing

Each item on the sample infographic is editable and clicking on an item brings up a variable sub-menu of additional options.

For example, when you double click on a text area, you get a floating menu which allows you to change text color and position, add special effects (such as the drop shadow added in the screenshot below) and links or get rid of the item altogether. Another floating menu has formatting tools, allowing users to change color, font, weight, size, alignment and bullets.

7 EWC infographic 2

The toolbar to the left of the screen includes seven icons. The top one, which is slightly separated from the rest, gives dozens of different backgrounds (plain, textured and more)—just click one to change the background to your infographic.

The bottom toolbar gives you the option to undo if you don’t like the changes, but be warned that you only get one level of undo, so use it wisely.

8 EWC infographic text options

The next icon (a capital T) provides access to text choices. This allows you to select title, sub-title and body text and to choose one-, two- or three-column layouts. The lower part of the sub-menu has three types of animated text (one of which reminded me a bit of WordArt, but better).

The shapes icon has some exciting choices. Click on it and you get access to basic, vintage, silhouette and—the most exciting—eye candy groups of images. Click on an item at the top to see a drop-down list of sub-categories, such as banners, food, gestures and more. The drop-down list varies depending on which icon collection you have selected.

Editing with Visme: Images, Charts and Media

9 EWC infographic add charts

The image icon gives the option to upload your own image to the “stage” which is what Visme calls the canvas containing the infographic, or to do a keyword search for Flickr Creative Commons images. (It’s not clear how these are attributed, which marketers must be cautious about.)

Most images are huge and need to be resized, which could make an image-heavy infographic a large file. I would have liked to see an option to replace an existing image with a new one, but it wasn’t clear how to do that.

Next to eye candy, my favorite part of the toolbar was the charts and graphs section, which had a range of animated, customizable widgets which provide one of the easiest ways I’ve ever seen to illustrate data. For each object, you can change the source data and you can also decide whether you want them to animate. This is a new feature, scheduled for release soon.

The last two buttons are for video and audio, which you need to insert from a URL.

Publishing with Visme

One thing to note is that it’s so easy to add items to Visme with a single click that you can accidentally add items you don’t actually want. Whenever you click on an item, it transfers to your page, so it’s worth using the preview function to check that your final graphic matches your expectations. You can preview and publish at any stage.

10 EWC infographic preview

It’s also worth noting that clicking on the publish button publishes your infographic automatically, so don’t do it till you’re ready to go public with it.

When you publish your work, there are several options. You can download it as a JPG image, a PDF or an HTML page. You can also publish it to your Slideshare account or embed the infographic on your site or blog. There are the usual social sharing buttons too.

11 EWC infographic publish

Creating Presentations and Banners

12. EWC presentation choices

Infographic test complete, I decided to try creating a presentation. That meant returning to the dashboard and choosing one of the seven available backgrounds.

The editing tools are the same, making it easy to include interesting animations and photos on presentations. There’s a slide sorter on the right of the screen which lets you add, delete and rearrange slides. Hover over a slide in the slide browser and a gear icon gives you the option to hide, duplicate or delete.

As before, it was easy to create a visually interesting presentation.

13 EWC presentation edit

Moving to banners, I found that in addition to the usual editing tools, the banners interface had a timeline at the top to allow users to animate the different items.

A special timeline menu lets you add items to the banners and you can keep track of how long the animation lasts with an onscreen clock. There’s an advanced mode for animation that allows you more control over the product, and which works similarly to After Effects or Flash, say the developers.

14 EWC banners

 

15 EWC banners 2

What’s Next for Visme?

The developers are constantly updating Visme. In recent weeks they have added layers, and the next version of the web app will include auto-save so that users won’t lose their work if they forget to save.

More upgrades are on the horizon, including new templates, widgets and themes, a brand new audio engine and a premium plan with unlimited projects and more media assets. However, there will always be a free level, says Easy Web Content founder, Payman Taei.

The Verdict

vismeo - placeit thumbnailPayman Taei adds that marketers will find Visme useful for:

  • Creating rich graphics and animations to support content marketing
  • Making attractive presentations and infographics
  • Data visualization of all types.

I think it’s an exciting tool that’s easy to use. The fact that there’s no coding required makes it worth a test-drive, in my opinion.

Enjoy other Crazy Egg articles by Sharon Hurley Hall.

Image source: Placeit.net

About 

Sharon Hurley Hall is a professional writer and blogger. Her career has spanned more than 20 years, including stints as a journalist, academic writer and ghost writer. Connect with Sharon on her website.

Get our Daily Newsletter

Get conversion optimization, design and copywriting articles delivered to your inbox FREE

1 COMMENT


Leave comment

Some HTML allowed

Get conversion optimization & A/B testing articles FREE >>>