Create engaging, interactive HTML5-based designs and motion graphics that can run on any device
Google Web Designer is an advanced web application that's built with HTML5 which lets you design and build HTML5 advertisements and other web content using an integrated visual and code interface. Using Google Web Designer's design view you can create content using drawing tools, text, and 3D objects, and you can animate objects on a timeline. Once you're done creating your content, Google Web Designer outputs clean human-readable HTML5, CSS3, and Javascript.
When you create advertising creatives with Google Web Designer, you can use a library of components that lets you add image galleries, videos, ad network tools, and more.
Google Web Designer's Code view lets you create CSS, JavaScript, and XML files, using syntax highlighting and code autocompletion to make your code easier to write, with fewer errors.
New features in version 7.0.0.0923:
Code view improvements
- Text files, published Google Web Designer files, and HTML files that were created outside of Google Web Designer can now be opened and edited in Code view.
- You can open image files in Google Web Designer, as well as edit SVG files in Code view.
- A minimap overlay highlights the visible portion of text in Code view.
- The Files panel now includes a refresh button to let you load changes to the list of project files.
- Image thumbnails display when hovering over image files in the Files panel.
- New keyboard shortcuts have been added:
- Shift+Tab: Decreases the indentation of the current line or selected text.
- Ctrl+G (Windows) or ⌘+G (Mac): If the search panel is open, finds the next match.
- Shift+Ctrl+G (Windows) or Shift+⌘+G (Mac): If the search panel is open, finds the previous match.
- A new "restrict to selection" option in the search panel limits searches and replacements to the selected text.
- Additional preferences let you configure HTML formatting options. Learn more.
- Select your programming language in the Code view footer for the appropriate syntax coloring and code hints.
Guide layers
- Toggle elements as guide layers to keep them from showing up in the browser preview or published files.
- Guide layers act like regular elements while you're working on your document, making them useful for comments, blueprints, or prototypes.
- You can convert guide layers back to regular elements.
Masking
- Hide part of an element by using a mask.
- Clip path masks only show the part of the host element that fits inside a geometric shape.
- Image masks use the transparent regions of an image to determine what parts of the host element to hide.
- Gradient masks apply a gradient to fade out the host element.
Particle Effects component
- Add animation effects based on particle systems, including snow, rain, fire, steam, and smoke.
- Start with preset configurations, then customize the particles' appearance and behavior to make your own effects.
- You can add multiple effects to the same image or set of images.
Transition Gallery component
- Use this new gallery to display a series of images with transition animation between each image.
- Select from a range of transition types: Fade, Push, Wipe, Slice, Blinds, Rotate, and Zigzag.
Other notable changes
- The Ad Validator no longer displays warnings about the 500K size limit for Display & Video 360 ads.
- A keyboard shortcut for publishing has been added: Ctrl+Shift+P (Windows) or ⌘+Shift+P (Mac).
- Animation in media rules now works in Internet Explorer 11.
- The publishing path is now saved as a relative path to the author file so that Google Web Designer files can be moved to other computers without updating the publish location.
- Publishing is now blocked if there are missing assets.
Fixes and improvements in version 7.0.0.0923:
Code view
- Fixed issue with custom color swatches not refreshing when switching between documents in Code view.
- Zoom percentage is now remembered for code files.
Components & runtime
- Date Swap component properties are now localized.
- Tooltips for labels and values are now localized for UI components.
- The page events "Page activated" and "Page deactivated" are now translated.
- The Video component events "Play after pause" and "Seeked" are now translated.
Events
- Fixed issue with events not displaying in the Events panel when the column width was set to be less than the minimum.
- Fixed refresh issue in the Events panel when removing element IDs.
- Fixed issue where group event wasn't editable after exiting the group editing mode.
Interactive Video
- Renamed hotspots and cue points are now updated for existing events.
- Fixed issue with resizing hotspots using the control handles on the hotspot's right edge.
- Video timeline now scrolls to the hotspot track for the selected hotspot.
- Fixed issue where undo didn't work after moving a hotspot with the mouse.
- Fixed issue with "Type cue point id" label overlapping with the field in some languages.
- Newly created hotspots now have better default dimensions.
- Deleting hotspots or cue points now also deletes their events.
- Fixed issue where video could turn invisible when resizing the video timeline.
Library
- Fixed issue with incorrect use count for a group nested inside another group.
- [Library] Selected assets are now highlighted across the panel width.
- Fixed issue with asset count showing 0 when an element with a CSS asset reference is pasted across documents. [full release notes]
Download: Google Web Designer 7.0.0.0923 | 1.0 MB (Freeware)
Links: Google Web Designer Website | Screenshot | Changelog
Get alerted to all of our Software updates on Twitter at @NeowinSoftware
