Google Web Designer (2013)

https://www.google.com/webdesigner/

by chenster • 10 years ago

437 150 10 years ago

Is this any relation to Pixate (which they sadly closed)?

politician• 10 years ago

It looks like they are positioning this as an efficient way to create ad units, not entire websites. Maybe it should be called Google Ad Designer?

linkmotif• 10 years ago

That was my first thought. If so, maybe this will make those ads suck less?

ourcat2• 10 years ago

there is no way on earth a full page interstitial/popup could suck less.

stewartjarod• 10 years ago

This isn't new. Was there a significant update?

stevebmark• 10 years ago

Adobe Edge has already tried the HTML5 tooling route http://www.adobe.com/products/edge-animate.html. I don't think they got much traction and essentially abandoned it. Curious if this offers anything different.

rl32• 10 years ago

This appears to have more (or at least different) features than Edge, though I can't help but feel it's basically tracing the same path.

j453• 10 years ago

I wonder why Edge didn't uptake. Possibly licensing costs, or maybe the timing of it was a little earlier than where we are starting to build more immersive experiences with HTML5/JS and are starting to desire the use of tooling to making it easier.

symlinkk• 10 years ago

what GUI toolkit is this made in?

rublev• 10 years ago

Flash.

keyle• 10 years ago

Interesting product. There is a huge demand for it and I'm not sure what Adobe ended up doing and if it works well. Interesting these products that come so late to the party, to fix the gap left by Flash (it had timeline animations etc. like so) for html5.

sandGorgon• 10 years ago

+1000 Cross platform including Linux. I hope this tool gets traction and goes beyond html5 to mobile design as well.

fbreduc• 10 years ago

the day google became microsoft for real this time... webdesigner aka frontpage

helb• 10 years ago

They first released it over 3 years ago. And it seems to be something like "HTML5 ad-centric Flash" rather than the new Frontpage.

johnhenry• 10 years ago

Just wanted to point out that this has been out for quite some time with little updates. If you click "Download Web Designer Beta", in the top-right corner, you'll see a note saying that the page hasn't been modified since April, 2014. Nonetheless, it could be a cool product -- if only Google decides to move forward with it.

kyrra• 10 years ago

That's the date of the TOS. It looks like this product has been around a while. The latest build is dated Nov 16, 2016 as far as I can tell (they don't date the release notes). The first release goes back to Oct 1, 2013.

release notes: https://support.google.com/webdesigner/answer/7218073?hl=en&...

HN post when it launched: https://news.ycombinator.com/item?id=6470426

aeharding• 10 years ago

(2013)

themodelplumber• 10 years ago

I just checked out the included templates. At least the first 20-30 are all ad templates, one of which is a full-screen mobile interstitial! That's the same element that just got an SEO finger wag from the Google Webmaster Central Blog[0].

_Just_ as the list of templates started getting interesting with some Youtube slider-thing integration, it came to an end. So yeah, this seems to be aimed at folks who need to build ads quickly and don't want to have to be HTML5 pros.

With that said, there's a "my templates" feature so maybe you can use it to maintain your Star Trek fan website, or business portfolio website, too. I'd just hesitate to recommend that in general, as my experience with GUI HTML5 builders has been that they aren't the best IDEs or text editors and I really quickly start to need one in order to be efficient.

[0] https://webmasters.googleblog.com/2016/08/helping-users-easi...

elmigranto• 10 years ago

That's the same element that just got an SEO finger wag

They are not going to wag themselves, so it only makes sense to include Google's ad template into Google's editor for creating Google Ads :)

(I guess half of this comment that's not a joke is it looks like internal tool gone public for mostly PR opportunity.)

FussyZeus4• 10 years ago

Reminds me of how the Google Mobile checker thing from way back would actually flag Google's home page has having too much crap stuffed in it.

Do as we say, not as we do, always a credible way to run a business.

ozaark• 10 years ago

Google encourages mobile full page ads through Adsense. Seriously, it's just called 'Page-level ads/Vignette ads' - "Mobile full-screen ads that appear between page loads on your site and can be easily dismissed by your users."[1]

Certainly don't want anyone else getting better ad positioning than Google, no sir. That's a penalty.

[1] https://support.google.com/adsense/answer/6245304?hl=en

lstamour• 10 years ago

This tool was announced in 2013 by a different part of the company: https://doubleclick-advertisers.googleblog.com/2013/09/googl...

webtechgal• 10 years ago

Yes, even the TOS before downloading the package says:

Last modified: April 14, 2014

username2233• 10 years ago

Wow, that link is a truly amazing advertiser buzzword salad; it even has an on-brand "up and to the right" graph. It makes me long for the days when disabling Flash and pop-ups got rid of most web annoyances.

NKCSS• 10 years ago

The sub-text under 'USE TEMPLATE' is 'Use a pre-built ad template', to it's right there what this is ment to do.

HlessClaudesman2• 10 years ago

Yeah, it is ad-centric but can be reconfigured.

One advantage over other HTML IDE's is that GWD's output is generally readable code, which can be extended, rather than obfuscated proprietary (adobe) bullcrap.

avecfromage• 10 years ago

Looks interesting! From the website, it is difficult to say how this software is different to existing solutions like for example rocketcake. I guess it is more useful for creating HTML ads?

Also, what if google decides to shut this down suddenly someday? Will it be easy to switch a project to a different software then?

vcool07• 10 years ago

Could any expert shed any information on why we lack a professional front-end WYSIWYG kind of editor for the web ? I remember tools like dreamweaver/frontpage existed a long time ago, but don't hear about them anymore. Is it something that's too hard to make or is it just that the market doesn't exist ?

boxcardavin• 10 years ago

I'd also love an informed answer about this.

proyb22• 10 years ago

Namo Webeditor was popular along with many tools, only backend services need lot of effort to maintain. Thee is one professional web design editor who patented it.

devoply• 10 years ago

My thinking is that they were replaced by dynamic sites based on PHP like WordPress, which initially people were doing template conversions for but eventually they switched to using themes... then we have had a bit of a redux with static site generators, but those are all hobbyist efforts. Dreamweaver still exists, it's just that no one makes those sorts of sites on Dreamweaver any more. There is no market for it.

All the developers that might do static frontends code by hand or use a library like Bootstrap or a theme like a WordPress theme. So there is not really much room for a tool like Dreamweaver in the landscape of web design. It's all about modifying existing things to make them fit the problem.

HlessClaudesman2• 10 years ago

Yeah, also being able to inspect live code in the browser drank dreamweaver's milkshake.

udkl• 10 years ago

There is https://pinegrow.com/ & to some extent Adobe Muse .... but I agree with the sentiment of there not being more options of WYSIWYG editors to choose from.

samuell2• 10 years ago

Ah, didn't know this one ... and even has a linux version, great. Thought macaw was the only option there (light app to be ran on wine), apart from adobe (which are getting too heavy, and thus way too problematic to run on wine).

caryhartline• 10 years ago

They do exist in different forms. If you're on the level that's just above making a Facebook page then you might go with Squarespace or Wix which have WYSIWYG editors. Surprisingly, Dreamweaver is still a product that is updated(?) and used by many.

When it comes to the high-end, there are Mac apps such as Hype and Sparkle which are used especially for developers who want to create animated websites.

It's also the case that creating a webpage isn't the most important thing anymore. Many businesses only exist on Etsy and Facebook. The time when knowing what html is and knowing how Dreamweaver works meant you could make a living off of anyone who wanted to be "on the Internet" is kinda over.

JonathonW• 10 years ago

Dreamweaver's still around (and just got a big update as part of the Adobe CC 2017 wave of apps), but Adobe seems to be positioning Muse more as the code-free WYSIWYG HTML editor now-- modern Dreamweaver's very code-focused.

maxmcd• 10 years ago

In my limited experience the market asking for and building sites on dreamweaver has completely shifted to squarespace, wix, etc.

intrasight• 10 years ago

The underlying JS and HTML5 frameworks change too quickly for that to work. Companies that tried have presumably lost their shirts. But I'd say that's a good thing in that now web development is a "fill the area under the demand curve" type of undertaking. You can spend between $10^1 and $10^7 on a web site.

pcr02• 10 years ago

A bunch of reasons, including lack of market, complexity of today's web.

They aren't entirely gone though, this was posted to HN a while ago: https://preview.webflow.com/preview/flexbox-game?preview=d1a... It's a game in their editor that teaches you flexbox.

tluyben2• 10 years ago

Complexity? Web apps are often complex yes but web pages? Even the Webflow homepage/marketing pages look identical to every web site posted here. So the lack of market yes; people take a template/code and change the content. Not sure if web apps were ever a good fit for tools like this as that is more like a full IDE as it would need coding as well to make sense. At least allow to specify data structures as in and out for the components you are designing.

tribby3• 10 years ago

Could any expert shed any information on why we lack a professional front-end WYSIWYG kind of editor for the web ?

we don't. webflow[0] is the best I've seen. there's an OSS clone called grapejs[1], but it's still very alpha. one reason we don't see greater adoption is that WYSIWYG editors for the web occupy a sort of middle ground between template-based hosts like squarespace, weebly, etc, and opinionated low-barrier-to-entry frameworks like bootstrap. I think there's some market, especially for prototyping, one-off marketing pages, and people who don't already have a preferred design workflow, but I don't think WYSIWYG will return in a large way until these editors begin doing "real" front-end lifting -- i.e., "drag and drop this react/vue/whatever component within a grid, without having to know what react/vue/whatever is." the appeal of dreamweaver, frontpage, and all of those editors in the 90s was that not everyone and their mother was a coder, but everyone and their mother did want to be on the internet, and there were none of the aforementioned saas or framework solutions to rely on. in 2016, there's no lack of coders and tooling, so if you don't want to write your own code, you may as well just spend the $10 for a shop overseas to turn your static layout into a responsive webpage overnight.

0. https://webflow.com/

1. http://grapesjs.com/

samuell2• 10 years ago

I second that webflow is seemingly the clearly best stuff out there. Just a pity they don't have a stand-alone client. Can't work on web designs while travelling in some parts of Africa etc, which is a shame :/

artf• 10 years ago

GrapesJS's author here. Firstly, thanks for the mention tribby, appreciate (got +20 stars in few hours :)). Anyway, in this days I plan to make a big update to the site and will add also another demo/preset, the builder for newsletters[0]. The main goal of GrapesJS, indeed, is to replace the common WYSIWYG editors, which are good for content editing but inappropriate for creating HTML structures.

0. https://s30.postimg.org/bbh4gwwdt/top_secret_stuff.png

pavlov• 10 years ago

...I don't think WYSIWYG will return in a large way until these editors begin doing "real" front-end lifting -- i.e., "drag and drop this react/vue/whatever component within a grid, without having to know what react/vue/whatever is."

React Studio is trying to do that:

https://reactstudio.com

deboboy• 10 years ago

Adobe is going after this space with Muse: http://muse.adobe.com

We've used WebFlow for a couple of years; it doesn't suck and you can actually build an early stage [pre-rev] business with it before committing to a full stack team/budget.

moonlighter• 10 years ago

Macaw is such a tool, runs on Mac and Windows. It's a free download at http://macaw.co (the product isn't updated anymore though; the devs have moved on).

proyb22• 10 years ago

macOS is no longer available download but I tried many way to search for it, Windows version still there.

Animats• 10 years ago

One of the few remaining alternatives to Dreamweaver is Blue Griffon.[1] It's open source (mostly), but the manual is proprietary. I just downloaded it and tried it. It's a basic HTML editor, not, like Dreamweaver, a site manager. It's heavily oriented towards preparing content for screen readers for the blind, with ARIA features prominent.

[1] http://www.bluegriffon.org

frozenport• 10 years ago

WordPress met those people's requirements

c-smile• 10 years ago

Last 10 years I am in the business of making WYSIWYG editors of various kinds. Yet I am an author of BlockNote.net HTML WYSIWYG editor (it is pretty old but works up until W7).

HTML/CSS WYSIWYG editing from mathematician point of view:

Second main task of a browser is: by having given HTML/CSS to produce set of pixels on window's surface.

On other side WYSIWYG editor is aimed to solve opposite task: from desired set of pixels (those ones you want to get) to restore/produce acceptable HTML/CSS combination.

The problem is that the task can be accomplished only with pure HTML. As soon as you add CSS to the equation acceptable WYSIWYG becomes barely possible: the same set of pixels (rendering on the screen) can be achieved in many different ways. Layout can use floats, absolute positioning, flexes and grids recently, etc.

Direct task (rendering) is perfectly formalize-able and solvable (HTML5 and CSS specs) - we have at least three independent implementations of these formalizations.

But opposite task (HTML/CSS structure synthesis from given image) has no determined solution.

And so different WYSIWYG systems use different approximations.

Like Microsoft Word, it produces HTML/CSS documents that are pretty close to what you just saw in it, but that HTML/CSS is barely readable and reusable as HTML/CSS. Others produce readable HTML but rendering is far from what you want to see.

Therefore "ideal" WYSIWYG editing of HTML/CSS is not achieavable in principle. You need to give up something - either WYSIWYG quality per se or feature set. Like you can have WYSIWYG editing but for editable text alike islands: content area of your blog site for example.

dualogy• 10 years ago

Interesting thoughts!

Therefore "ideal" WYSIWYG editing of HTML/CSS is not achieavable in principle.

I think users just need to be (made) aware that any & all web pages' design is always "template/theme"-driven. Even in the absence of CSS: the browser then falls back on its unique user stylesheets / factory defaults (black Times in unpredictable font-size on white background, unless maybe hi-contrast accessibility setup has the colors reversed, unless, unless, etc..)

MS Word-style "WYSIWYG" looks like a "simpler" problem in this respect because a piece of paper is a piece of paper (not really though as printing settings can easily mess with what what-they-saw-they-thought-they'd-get). Any sane web-page WYSIWYG must separate the content-formatting-without-tags (bold/italic/a picture floating to the right/etc) from style editing --- so will be essentially (at least) really "2 editors" (in 1).

Now as the user quickly grasps this intuitively after just a bit of tinkering, I don't really see the issue anymore?

type0• 10 years ago

HTML and WYSIWYG shouldn't really be in the same sentence. It is such a promiscuous but tollerant format/language that it instantly produces a mess. There are some interesting videos about it on computerphile: https://www.youtube.com/watch?v=-csXdj4WVwA (Where HTML beats C?)

jasim2• 10 years ago

Very well put. I've been tackling a similar problem with my product Protoship UIPad - "Find the optimal HTML and CSS for an image". By optimal I refer to code that a skilled developer would write themselves and will be happy to own and maintain themselves. We've seen terrible code generators - they make our lives harder and have no market.

I chose to solve this by using Sketch, which has rich layer information - is it a text, is it centered, is it a rectangle, what is its background color etc. Sketch also has layer names, which can be mapped to component oriented CSS. The difficulty is in finding the optimal positioning for this, which we solve a little algorithmically and also through user annotations. You can read more about my approach and its trade-offs here: https://medium.com/sketch-app-sources/protoship-uipad-design...

protexilu• 10 years ago

Tme to pull out the deep neural nets! Isn't the problem that you're describing a bit like generating, say, words given an image? Sure, there are several differences, but it's an interesting problem.

Easier than caption generation? - There's only one possible outcome for HTML/CSS --> website look - And we know what this outcome is (just render the thing) - not a lot of "words" in the vocabulary... there are only so many tags and styles we can use (at most a couple hundred), with most of the complexity coming from the combinations of these elements

But in some sense, it might be a harder problem, since the idea of web development is combining these "words" in a way that makes sense. So there might be a harder-to-learn grammar.

flukus2• 10 years ago

The biggest reason is that WYSIWYG doesn't really work on the web. What you see on your screen isn't what someone else will see because their monitor is a different size or they are on a mobile device.

WYSIWYG requires a fixed layout size, which was common back when dreamweaver/frontpage were around.

tribby3• 10 years ago

this is incorrect. almost every modern WYSIWYG editor includes support for media queries.

coldtea2• 10 years ago

The biggest reason is that WYSIWYG doesn't really work on the web. What you see on your screen isn't what someone else will see because their monitor is a different size or they are on a mobile device.

Different screen sizes and WYSIWYG use are orthogonals. Any WYSIWYG editor worth its salt has supported media queries, previewing on different screen sizes, breakpoints, etc for ages.

j453• 10 years ago

In the past creating rich experiences was in things like Flash. With it's premature flogging, the side effect was there was little to actually and reliably replace the rich experiences it was able to create 2007-08. That's one reason seeing tooling like this, and Adobe Edge is something to look forward to.

rl32• 10 years ago

That's one reason seeing tooling like this, and Adobe Edge is something to look forward to.

Adobe Edge is dead.

https://www.adobe.com/products/edge-animate.html

Note: As of November 2015, Edge Animate is no longer being actively developed.

Prior to cessation of development it stagnated for a few years before finally being put down. Shame, really.

ezequiel-garzon• 10 years ago

I think Pingendo [http://pingendo.com] qualifies.

elif• 10 years ago

You are commenting on one..

Kiro• 10 years ago

The generated HTML/CSS is not semantic and impossible to maintain outside the editor.

jmacd• 10 years ago

https://www.pagecloud.com/ might be worth taking a look at. I've been impressed by it.

pbhjpbhj2• 10 years ago

With responsive design - that adapts to your viewer, their bandwidth, their device (and orientation), their add-ons (eg uBlock/ABP) - WYSIWYG rather starts to lose meaning. I'd warrant it's easier to design in the abstract than moving elements and watching 5, 20, 100, ... different views to see what your page visitor might see.

Now add in progressive enhancement.

We're not dealing with the largely fixed desktop viewport anymore.

That I suspect is why WYSIWYG hasn't taken off, Dreamweaver did quite well, but then the web ran away to multi-platform as the default.

jasim2• 10 years ago

Webflow is the best all-in-one tool out there.

There is also Sketch, which is a vector design tool that shines at designing user interfaces. And unlike Photoshop, it is extremely friendly to the web - if you can do something in Sketch, that can be done in CSS.

We're building a tool that converts these designs into code (HTML, CSS, SASS, React, ERB etc). That gives a sort of WYSIWYG workflow for pro users. You can have an expert designer do your design, and then have a developer run with it by generating quality code from them.

Yhippa• 10 years ago

I'm on mobile so I can't use the app but I'm hoping for a spiritual successor to HyperCard. Looks like there's a lot of hand holding being done however.

waterflame• 10 years ago

I've been using this tool since a year now to quickly build HTML5 banners for DoubleClick. 1- the software was way too buggy than it is now, yet, it still is, and updates aren't that frequent. 2- all objects are positioned absolute, even though you can choose to create a responsive banner. 3- for me, it's perfect for ads, and handles animations pretty well (it uses CSS animations) 4- you can always access the generated code and modify it once you understand how it works. 5- I would never use it to create anything other than ads. 6- the UI sucks, especially when the biggest part of the process is adding assets, modifying their properties or settings their CSS, and you constantly have to resize the accordion drawers.

dagge• 10 years ago

Would be interesting to hear your thoughts on https://tweenui.com/animator

jdub• 10 years ago

"The 90s are back, baby!"

frik• 10 years ago

Any news? Is it a new version. I have it installed for at least a year.

vivekd• 10 years ago

Where is the need for this product? People who know about computers will probably just use the very easy to learn HTML and CSS code and people who don't know computers will likely use wix or wordpress or some similar alternative. I wonder where this product will fit?

vonklaus• 10 years ago

Where is the need for this product?

An intuitive easy to use WYSIWYG editor is a highly sought afterand demanded product category. Squarespace costs money and is actually (for me) a pretty bad user exp.

Google probably can deliver on this because they are SEO. Even good editors were not semantic. I havent tried this product, but if it is halfway decent it will find market share. If it is perfect it could replace wordpress.

I am pretty competent as a developer and I would use (based on my understanding from the link) this product rather than battle css or compile sass. Plus I can edit the code.

On top of top teir engineering, google has control of SEO & pagerank so maybe they can win where orhers hadnt. No brainer for them.

camus2• 10 years ago

It looks like an HTML ad creator, not a "website designer".

tonyhb• 10 years ago

This has been out for around 5 years. I remember installing this at an ad agency I worked at when HTML5 ads were barely a thing.

At this point they probably have a small team working on it for sake of their ad division but people here shouldn't into this too much.

t3ra• 10 years ago

So its not targeted towards making "pages" more towards just making HTML5 banners. I guess just trying to replace flash banners with HTML5 ones

The templates are all for banners and the tools for making say a "div" are not there.

TekMol• 10 years ago

I thought, "ok let's try this..." hovered over the green button and then WOAH! "Download Web Designer Beta" wtf.. DOWNLOAD? Are we back in the 90s?

aluhut2• 10 years ago

Does anyone know if it installs that Google Updater Service also on Win?

aluhut2• 10 years ago

Nevermind...crapshit installed itself or left some installer behind even with me cancelling the installation. I hate google software...

bertjk• 10 years ago

Hmm looks kind of like Celtra's AdCreator[0]. I wonder which came first? Has anyone used both who can compare the two?

[0] https://www.celtra.com/adcreator

sansubr• 10 years ago

This is really cool. Landing pages could be built faster with this now..

gigatexal• 10 years ago

What's old is new again: hello dreamweaver just this time from google.

hmoghnie• 10 years ago

I wonder when will they shut it down.

namaemuta• 10 years ago

For a moment I thought that google had designed a software for app designs like Sketch or Adobe XD. None of them works for Linux so I was pretty excited until I realised what it was really :(

ourcat2• 10 years ago

Having lived through the birth (and death) of HotDog / Dreamweaver / Frontpage etc. my biggest concern here is "HTML soup".

My next biggest concern is that these tools don't really teach people much about how the web works and also that marketer-types tend to over-use these tools with their new-found 'skills' and build over-bloated sites.

HTML is easy.

ff10• 10 years ago

TIL that Dreamweaver is still being marketed.

hkdobrev• 10 years ago

I was wondering if this is the same software which was announced years ago and it was still in beta or it's a new software that's in beta. I've found I've personally added the record to Homebrew Cask in 2013 - https://github.com/caskroom/homebrew-cask/commit/429e430a622...

nnd• 10 years ago

On a related note: anyone knows a good guide to catch up with the recent frontend design/development trends?

baboun• 10 years ago

Google Dreamweaver

mochidusk• 10 years ago

I'm currently building a browser-based WYSIWYG to make book covers. I've tried SVG and Canvas but it's terrible for implementing multi-line text. Trying to add kerning, tracking was almost impossible.

Not sure if anyone's heard of Readymag[0], but I'm really impressed with their editor - and it has excellent typography tools and UI.

Anyway, what I've noticed is that now many people are abandoning their own websites & blogs in favor of a centralized service such as Medium, Instagram, etc.. I remember a few years ago there were alot of fashion bloggers and now they're all on Instagram, updating daily. People have lost interest in designing, building, maintaining their own sites because it's too much work for the average person. Not to mention traffic going to the individual sites are neglible compared to social media. When posting a photo on your own site gets 10 visitors, but that same photo garners hundreds of likes on somebody else's platform, then you're going to be spending time on that platform.

[0] http://readymag.com

Raphmedia• 10 years ago

Ha, Google Web [Ads] Designer! I tried it. Works really well but who works on ads on a daily basis?

SnowingXIV• 10 years ago

I wish things like this existed but not for front end, but for handling databases. I want to be able to send values from my static sites into a database and then from there be able to perform hooks and actions from said database. This all being done securely. I need form handling and tracking.

Google Web Designer (2013)

Related Stories