Live data from Hacker News

Show HN: Easel, web design in the browser

alpha.easel.io

71–80 of 125 posts

Re: Show HN: Easel, web design in the browser

#71
post #38

Just a drawing tool in the browser. This doesn't do anything different than Photoshop or Omnigraffle, if the web designer is smart enough to reuse layers / components. It could be a really useful though if it had support for more than absolute-positioned, fixed-sized elements, and used the browser's layout engine instead. Today's biggest problem is that web designers use Photoshop for coming up with mockups and then…

The hard part about using the browser's layout engine is that it is limiting to the designer. We'd have to snap things into say, floating position, etc. And we'd have to know exactly what the designer was thinking when they're dragging some element around. Or they would have to know about floats, and how to use them. We think (right now) that the best way around this is some kind of constraint system, like CAD apps h…

it is limiting to the designer

As a user, I want the designers to be limited. Scaling by percentages and using constraints sounds like an improvement. On the other hand, I like your minimalistic tools.

Re: Show HN: Easel, web design in the browser

#72
Congrats on putting out a great looking alpha. One question I have: The entire layout is being drawn inside of a canvas. Why was this decision made? Since (at least partly) the purpose of your tool is to output css it seems that you have tasked yourself with recreating CSS rendering inside of a canvas. Seems like a huge and unnecessary burden when just outside of the canvas you have this rendering tool specifically designed to render CSS.

Re: Show HN: Easel, web design in the browser

#73
post #30
post #19

This strikes me as a good mix of Balsalmiq (www.balsalmiq.com) and Photoshop. One of my pet peeves is getting mockups from designers that clearly fail to take the actual abilities of browsers into account. Hopefully, this can change that, while still giving them the design freedom they want!

Then you need to get a designer that knows how the web works! It shocks me when I see fellow designers make things that's not feasible on the web.

On the other hand, a designer that has no knowledge of HTML or CSS can open doors that you may have never considered, even if it involves more work.

Re: Show HN: Easel, web design in the browser

#74
post #57
post #48

Very cool interface. Any a very nice usage of keyboard shortcuts. Can Easel output an entire web page? - meaning can I layout an entire page then get a zipped download of the page plus any CSS and JavaScript resources?

It can. But things will all be absolutely positioned. The intent is to generate pieces of html and css that fit into your dev environment. The code generation is still very much in-flux, but from what we're seeing, programmers dont want the entire thing generated.

but from what we're seeing, programmers dont want the entire thing generated

Actually for developers like myself there's several use cases where having access to the complete generated source would be awesome:

1. Separate the positioning/layout styles and the color/font/design styles into separate CSS files. That way I can include all the designs created with Easel easily instead of copy/paste one at a time for each element generated.

2. For showing a mockup to a client or knocking out quick interface for a side project using absolute positioning can be acceptable.

Re: Show HN: Easel, web design in the browser

#75
post #14

Earlier quoted context omitted.

Is that a good idea or not, I wonder? Wouldn't people with Photoshop be using it instead of this? Seems like it might be a good idea to target it at non-PS owners.

As a web designer that primarily uses Photoshop, I'd say it's a great idea. Photoshop is horrible for web design. So horrible that I design purely in the browser now. This is going to be a nice addition to my workflow for when I want to include something shiny.

Photoshop is needed for anything beyond a simple design.

Re: Show HN: Easel, web design in the browser

#76
How is this useful? I can edit colors, border radius, box shadow, line height, font, positioning, and alignment in real time on a real HTML mockup using Firebug, webkit developer tools, even the Internet Explorer F12 tools.

Web design mockups that include these things should be done in HTML and CSS. WYSIWYG editors are crippling for professionals and poison for amateurs.

Re: Show HN: Easel, web design in the browser

#78

There's no way this won't kill Photoshop for web design

Really, all Photoshop needs to kill this is some more attention towards Web-designers.

It's a lot easier for Adobe to squeeze in browser simulation, button states, etc. then it would be for Easel to emulate all the features in Photoshop.

Re: Show HN: Easel, web design in the browser

#80
A minor bug: if you change a value in a text field (such as the Y offset for a drop shadow) and click the OK button, the value is not saved. You need to first make the focus go out of the text field and then click the OK button.
Post reply on HN