Photoshop CS6 Download

Want to draw readers in, with animated and interactive content? While this used to be the domain of Flash – resulting in a lot of load time and potential compatibility issues – HTML5 has fast become the dominant method for creating animated and interactive web content.

Of course, not everyone has the time or skills to code HTML5 content; if you’re one of those people, maybe HTML5Maker is something you should try.

HTML5Maker is an online, cloud-hosted web application that can be used to very easily design animated and interactive HTML5 content. What’s more, HTML5Maker also helps you host your HTML5 content on the cloud, so you just need to focus on creating your interactive, animated slides. Let’s take a look at HTML5Maker.

Recommended Reading: HTML5 Website Showcase: 48 Potential Flash-Killing Demos

Getting Started with HTML5Maker

You can immediately start working on a HTML5 animation without registering (just click on Create Animation) but if you register, you get to save your animations.

Creating a new account is simple; just pick your pricing plan and then sign up with Facebook or Google, or create a new account. Once you’re registered, you’ll be taken to your dashboard, where you can manage your animations, change your subscription plan and password.

Adding Slides, Text And Images

To create a new animation, click on the big orange Create Animation button to go straight to the actual HTML5 creation interface.

Basically, your working canvas is a three-column interface: slides are on the left, the slide view is in the middle and the right column shows Image Properties, Text Properties or Canvas Properties (default) – the right column will switch to image or text properties when you’re adding or editing an image or text.

You can also manually switch between these three properties with the buttons above the slide display.

Adding Slides

If you have used PowerPoint before, HTML5Maker works the same way with slides. Click the Add New Slide button to add a new slide. You can also duplicate and delete slides, set the duration for each slide as well as set the overlap time in between slides.

Adding Images

Clicking on Add Image will bring up the add image interface. You can choose from a large variety of images, from beautiful photographs to design elements to icons, flags and backgrounds. And, if none of these fit the bill, you can also upload your own images.

Once you’ve found an image you like, mouse over it and click on Add. The image will be added to the slide, and you can then reposition and resize the image as you see fit.

To resize or rotate the image, you need to go to Image Properties, alongside other options like changing the opacity, replacing or modifying the image.

Clicking on Replace simply opens the image selection window again. Clicking on Modify will open HTML5Maker’s image editor.

In the Image Editor section, you can perform basic image editing such as cropping, blurring and adjusting contrast. You can also apply filters and overlays as well as add text and frames.

Lastly, you can choose the image’s Appear and Disappear effects. There are a number of different fade in and fade out styles to choose from, and you can even enable an Advanced Mode that lets you set the duration of these fades.

Adding Text

Click the Add Text button and a text box will appear on your slide. You can rotate and change the text directly from the slide, or check out more options in the Text Properties sidebar. Choose a font, font size or color, enable text background, tweak formatting options, set the size and text position, add drop or inner shadows or add in a text link to sites or slides here.

Canvas Properties, Previewing And Publishing

You can change the size of your canvas, from a number of presets or a custom canvas size. There are also a few options that you can enable or disable, such as Autoplay, Pause on MouseOver and Responsive animation.

Animation Controls opens up a new window where you can choose Slider Options for your animation. You can add controls to play, pause, move from one slide to the next, use a timer progress bar and more. Each type of slider or control has a number of options for you to tweak, including size, icon type, color, opacity and so on.

Previewing And Publishing

HTML5Maker has two preview options: you can either preview the current slide or preview your entire animation. Once you’re happy with things, click the big orange Publish button at the top right of the screen. Save your animation as HTML5 or Flash.

A saved animation can be accessed from the dashboard. You can also find more options there to embed or share your animation.

Conclusion

HTML5Maker has good number of pricing tiers to suit any budget. There is a free account, but you’re limited to only saving one animation with that, and you have to have an HTML5Maker watermark in your animation.

The paid plans range from $4.99 – $49.99 a month – the price increases with the animation limits (up to 100 for the $49.99/month plan) – and guarantee 99.9% uptime and give you access to premium professional templates.

All in all, HTML5Maker is a great tool if you don’t have the know-how to code HTML5 yourself, yet want to take advantage of interactive and responsive animations HTML5 can afford your website. While HTML5Maker probably isn’t geared for complex HTML5 content – like, for instance, music website Pitchfork’s Cover Stories series – it’s still a capable tool and should fulfill most users’ needs.

via hongkiat.com http://ift.tt/1gdAoeH