My First HTML Banner AD and its Source files
I decided to give +Google Web Designer the 'late night try'. This is either going to be very easy, or very difficult.
It was very easy—28 minutes of easy. I spent the majority of my time within Photoshop creating image assets. The animator/keyframer works as expected, and I would say it's easy to understand for those familiar with these toolsets.
I think some people may have some trouble looking for things like: 'Import picture file' 'Delete Layer'
After initially scanning the tools, I figured image files were drag + drop, and removing an item from the stage was as easy as selecting it and using the delete key on your keyboard.
My Immediate issues:
1. Most important: Once I published my banner ad, GWD would not open the source file and allow me to re-edit the code. It gave me an error twice. So, I modified my code in Coda.
2. Buttons should be easier to make. This includes over-states and animations that require rollovers. I gave up and simply added the link through Coda. If Google is going to be pushing this as a tool for making banner ads, I'd suggest making that process easier for the new user. Clients love their buttons...
3. The Scroll Bar for the layers/scrubber is on the far right, while the layers are on the far left. It's an idiosyncratic gripe, but it's a huge gesture to move left-to-right constantly ;)
4. a Initially, I presumed I could select/embed fonts from within GWD. But have since convinced myself I'd rather do this through a code editor. Type choices are limited to the typical and ubiquitous screen fonts. The down-side is that when you've created an ad with one typestyle, and then switch it after publishing, it changes alignment and design patterns.
4. b Type was converted to an image for animation. The type is not HTML, it's a graphic. I can think of a few reasons for doing this, but the best reason for not doing it is; Crisp type on screen, and lower file sizes. However, I cannot prove that file sizes increase without having actually placed this on an ad-server.
5. I centered my banner ad by hand. I could not easily find a way to do this. But remember, I spent a total of 28 making this.
6. Lots of code... I wanted to separate and create isolated files, but it looks like GWD has their own JS, so I left if for now. I don't need the bandwidth issues. :)
It's deceptively simple to use. Making websites will be a breeze for beginners, and I suspect a lot of people will fall in love with the ability to create their own web experiences with Google Web Designer. You can download the source files here, if you're interested in taking a look at the code base. More than I expected.
Thank you for sharing this information. The information was very helpful and saved a lot of my time.
ReplyDeleteWeb Design Rochester NY