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 autocompletion 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 ad 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.

What's New:

  • Fixed issue where Google Fonts failed to load when adding new fonts.
  • Fixed issue with text font, style, and color not setting when in text editing mode.
  • Fixed issue with font weight getting removed from the published files when the font is defined in an external stylesheet.
  • Fixed issue with "Regular", "Bold", and "Italic" font weights missing in the published files.
  • Fixed issue with font keys getting removed from the published files.
  • Fixed issue with zoom cursor activating when hovering over the stage scrollbars.
  • Fixed issue with incorrect property list displaying for a div in the dynamic bindings dialog if a binding already exists for a group.
  • Fixed issue where a gallery populated by a dynamic group (with a binding for the “Repeat for each item in collection” attribute) only displayed the first local image in the in-browser preview.
  • Fixed issue with previewing documents with dynamic fonts from Google Fonts.
  • Fixed issue with dynamic fonts from Google Fonts not loading when a document with dynamic bindings was loaded with sample data already selected.
  • Fixed issue with sample data editor not saving changes after the Dynamic panel was collapsed or closed.
  • Full release notes here.