Google Web Designer Application

google-web-designer#Google launched “Web Designer” Beta (in September), a free tool for Windows, Mac and Linux that makes it easy for anybody to build interactive HTML5 websites, web contents and ads.

Since then Google has updated the Web Designer with an Animation Tools, deeper AdWords and DoubleClick integrations.

Google AdWords service for advertisers now also supports HTML5 ad creatives from Web Designer. For the first time AdWords can handle HTML5 ads. Flash ads that are uploaded to Adwords will be automatically converted to HTML5 now.

Users will appreciate the addition of a number of new animation tools to Web Designer more. The animation timeline has been reworked in the tools to include features like animation scrubbing, timeline events and auto keyframing, which should make it quite a bit easier to build animations inside the tool. Added a few new 3D features, which should make the animations more interesting.

Other new features include an integration with Google Drive to easily share Web Designer files with others, as well as integration with the CodeMirror text editor.

It’s an easy tool to work with and thanks to its integrated code editor, you can always fine-tune the result by editing the CSS and JavaScript codes manually.


Create Animations

You can create animations in Google Web Designer in two modes, Quick mode and Advanced mode.

In Quick mode, you build your animation scene by scene: you add a new view of the entire page, change the elements you want to animate, and, optionally, modify your transition times and easings.

For more complex animation, Advanced mode lets you individually animate each of the the elements, optionally modifying transition times and easing as well. Advanced mode also shows layers, which let you change where each element is in the stack of elements.

Full 3D Authoring Environment

Create and manipulate 3D content utilizing an array of tools and the power of CSS3. Rotate objects and even 2D designs along any axis, visualizing 3D transformations and translations as you author.

Design View and Code View

Code view lets you view and edit your code in Google Web Designer’s built-in code editing tool. Code view lets you create CSS, JavaScript, and XML files. Code view uses code auto-completion which makes your code easier to write, with fewer errors.

For Ads and HTML files, you can switch between Code view and Design view, with the changes that you make to the code in Code view reflected in the Design view. This lets you immediately test how changes in your code will affect your designs.

You can also select objects with the selection tool and change the CSS styling for those objects in the CSS panel.

Illustration Tools

Import assets from any other creative suite or use the built-in illustration tools to create vector-style artwork keeping your designs light. To create new HTML tags in your designs, just draw them in with the Tag tool.

The CSS panel lets you edit current styles, as well as add new CSS rules.

Easy Ads Workflow

Google Web Designer makes it simple to publish ads through any platform. Choose from DoubleClick Studio or AdMob, or go for the Generic option to push content through any other ad network. No coding required.

For more information and download link, visit Google Web Designer site or subscribe to their YouTube channel to learn the basics on how to use the application.

Leave a Reply

Your email address will not be published. Required fields are marked *

Next Post

Free 300 Awesome Things From Awesome People

Tue Feb 17 , 2015
via. MEDIUM Business & Marketing A. FREE WEBSITE + LOGO + HOSTING + INVOICING HTML5 UP: Responsive HTML5 and CSS3 site templates. Bootswatch: Free themes for Bootstrap. Templated: A collection of 845 free CSS & HTML5 site templates. | Create your new website for free. Domain: One […]
free  awesome things from awesome people