[Feature Request] Texture sheet/atlas compatible image component

118 views
Skip to first unread message

micsun-al

unread,
Jul 29, 2015, 3:33:44 PM7/29/15
to Google Web Designer beta
This is a feature request for a component that uses a texture sheet for images.

First option...
The existing image component can be modified, or a new texture sheet compatible image component can be created.
The component could read a texture atlas similar to one created from TexturePacker or something like Leshy SpriteSheet Tool (http://www.leshylabs.com/apps/sstool/).
It would be nice if the component would show a live preview while the user is working with the component on the stage.

Second option...
Optimally, the user would be able to import a texture sheet with associated texture atlas in to the Asset Library, and the user would be able to drag and drop the new assets from the Asset Library to the stage without breaking a sweat.  The images loaded from the texture atlas would be handled nearly identically as if it was a jpg or png.

Reason we need this...
We are getting requests from clients to create Enhanced Banners (https://support.google.com/dcm/partner/answer/4558694?hl=en).  One of the requirements is for the ad to contain at maximum ten files according to this line:

You must upload your HTML5 asset as a .zip or .adz containing a maximum of ten files, and including exactly one click tag.

If I ever get free time, maybe I'll start looking in to how to create a custom component, but instead it would be super useful to everyone that uses this program if GWD supported texture sheets natively.

Thanks!

micsun-al

unread,
Jul 29, 2015, 3:48:12 PM7/29/15
to Google Web Designer beta, mic...@avatarlabs.com
Third option...
Give the option to automatically create a sprite sheet from the images in the Asset Library, but keep the rest of the functionality the same.  All images would use the auto-generated sprite sheet in the background without the user having to do anything special (maybe a checkbox to enable/disable the image being on the texture sheet).

Jaz

unread,
Jul 29, 2015, 6:19:13 PM7/29/15
to Google Web Designer beta, mic...@avatarlabs.com
Thanks for this request, I've just passed this on to the super awesome team that helps create components for us.

Really appreciate all of the feedback, keep it coming!!

thx
jaz
Program Manager, GWD

micsun-al

unread,
Jul 29, 2015, 7:21:57 PM7/29/15
to Google Web Designer beta, gwd...@gmail.com
I did create a workaround to this, but it's a bit messy and awkward for designers to use (I would probably end up having to modify designer's works every time with this method).
  1. Create a spritesheet from http://www.leshylabs.com/apps/sstool/
  2. In "Sprite Map" select "CSS" as the output type and save that in to your project directory.
  3. Open the CSS file in a text editor and keep it on the side for reference.
  4. In your project, go to Code View and include the saved out css file.  Example:
    1. (close to the top of the file where all the other css files are...)
    2. <link href="sprites.css" rel="stylesheet">
  5. Change the img tag to div and remove the 'is="gwd-image"' and the 'source="assets/image_name.pngorjpg"' attributes.
  6. Add the appropriate class from the css file that was generated for that image to the class attribute.
I wonder if there's a better way to go about this?

cl...@avatarlabs.com

unread,
Mar 22, 2016, 10:08:51 PM3/22/16
to Google Web Designer beta, mic...@avatarlabs.com
That "third" option sounds useful. Lots of venders like to kick back based on file count. I don't really see this working as a "component" as images are not currently visible in GWD when incorporated with components. Seem like a great publish feature.
Reply all
Reply to author
Forward
0 new messages