Tag Archives: HTML5

Google Web Designer review – It’s the future?

Google Web Designer review

I’ve met today with the new Google Web Designer Beta – the new tool Google released for building adaptive, universally usable rich HTML based designes including ads.

The main purpose appears to be to provide a way to produce Adobe Flash-style animated in HTML5/CSS3 without using Flash.

“We think that Google Web Designer will be the key to making HTML5 accessible to people throughout the industry, getting us closer to the goal of ‘build once, run anywhere,’” Google engineer Sean Kranzberg posted

The Google Web Designer Youtube page is full of examples:

 

Google Web Designer

Starting Google Web Designer for the first time…

gwd-icon

Google Web Designer is available as a free (as in beer) download for Windows PC and Mac OS X, so at this stage, it won’t run on Linux, or Chromebooks.

Google Web Designer loading

Google Web Designer loading

Google Web Designer

Google Web Designer main screen

Product review

You have several presets to start from. You can start by creating a new Ad banner, or HTML / CSS / JS / XML as you can see:

gwb-presets

 

The UI is slick, and yet powerfull. You have great tools to work with creating your HTML file.

gwb-tools3D Object tools: You can move/rotate any object in 3D mode.

Text tool: You can write wherever you want in the document and not in HTML oriented direction (Position: absolute;)

Tag tool: Create blocks (DIV) of objects.

Pen tool: You can draw vectors. Just like Flash or Illustrator.

You can also find the Stroke tool and Fill tool as expected. also you can find the normal Zoom tool, Selection tool and Hand tool

One idea. Any screen.

Google Web Designer helps you create a responsive HTML. everything you create is accessible on any screen – desktop, tablet or mobile – without compatibility issues.

Amplify with code

If you’re feeling more hands-on, all the code behind your designs is hand-editable.

Two animation modes

In Quick mode, build your animations scene by scene and google web designer take care of the frames in between. In Advanced mode, animate individual elements using layers, easily changing the location of elements within the stack.

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.

 

 

Summary

Although other Hacker News users reckon the code that GWD generates compares unfavorably to Microsoft FrontPage 2000. I found the code to be somehow fine, if inspected and modified manually. This tool is great for creating HTML parts (widgets) that are cross browser responsible (like ads, menu, carousel, etc.).

I still gonna play with Google Web Designer for sometime, but I must admit I was never the ‘HTML generator’ guy.. I don’t think that tools like that will take the job for the great HTML/CSS designers out there… How write their code using decent IDE.

It’s worth noting that projects like Adobe Muse/Dreamweaver, Reflow and others include most of Web Designer’s features, too. But by making Web Designer available for free, Google is putting quite a bit of pressure on the competitors.

 

That’s it. What do you think about Google Web Designer?

HTML Secrets – Web Application Architecture Design Tips

html

Whatever site or web application you’re working on, you probrably going to use HTML.

These are the tips I’ve learned over time:

Continue reading