4 ms·

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 / comp

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 they just expect content to fit on their fixed-sized design, when the web exactly the other around - content is king.

Watts 14y ago
I think this is great for prototyping ideas. Using Photoshop for web design is an approximation at best.
- grantjgordon 14y ago
  True, but this is just a different sort of approximation, too. Layouts where all the elements are absolutely positioned don't work in the real world, so the markup and css will have to be 60%+ rewritten and will likely not look exactly as it's laid out here.
  - mrbogle 14y ago
    The intent at this point is to not generate layout html/css. Humans are much better at this right now than the editor could be. And the assumption is that the programmer will want to write the layout code himself anyway, being careful to place it in nice modules that fit with their dev environment. We could build an entire product just trying to generate semantic, reflowable markup from a design.
    - Watts 14y ago
      I agree. Let's be honest - it's kind of weird that we rely on a program that is really designed for editing photographs as our main tool for designing web sites. I'm all for exploring this further at least as a tool for doing layouts and design that CSS can handle. For everything else (e.g. designing icons), there are more appropriate tools.
      - fleetvanjeremy 14y ago
        It would be nice to have something that allowed you to use both. There can be so much rapid experimentation in photoshop because we know the tool so well - having that import easily into something like this for the final touchup would be ideal (in my most perfect world) as so much time goes into the touchup and the last few pixels in css.
- liamondrop 14y ago
  One of Photoshop's virtues is, in my opinion, that it is NOT a browser and does not force one to think in terms of what browsers can do. Like all freedom, such a huge range of possibility does pose certain problems, but it also allows for very interesting, sometimes completely novel solutions. I do both design and development and I find I use very different parts of my brain when doing one or the other. For me, it's important to stay far away from any kind of code until it's actually time to start implementing. Otherwise, I fall back to predictable habits.
mrbogle 14y ago
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 have. We're not sure what that looks like yet, though.
- drivebyacct2 14y ago
  I think what you have is great and I think you should run with what people are seeing this as "awesome" for, design prototyping. I think making this into anything that generates layout or uses the browser engine is going to be either: much harder than you think, or: will lose much of the functionality that you can allow for now via "do whatever, drag/drop, absolute positioning".
  - tomsaffell 14y ago
    I totally agree. I've been wanting an app like this for the last 6 months (wondering why one didnt already exist), and a lack of fluid layout doesnt put me off at all. The one thing I really want is realtime collaborative use, ala google docs (Firebase should make that easy).
    - mrbogle 14y ago
      You should email me. ben@easel.io
  - mrbogle 14y ago
    Thanks. That is the intent. Design prototyping, but with tools that allow the dev to build it more quickly.
- JoshTriplett 14y ago
  > The hard part about using the browser's layout engine is that it is limiting to the designer. True, and the even harder part is building a system that treats that as a feature rather than a bug.
rooibos 14y ago
I think it is more than a drawing tool, this is what the TBL intended the web to be. Where you can view and update pages from the same interface: http://www.w3.org/Amaya/ http://www.w3.org/Amaya/ A bit like a wiki but more rich.

Watts 14y ago

I think this is great for prototyping ideas. Using Photoshop for web design is an approximation at best.

grantjgordon 14y ago
True, but this is just a different sort of approximation, too. Layouts where all the elements are absolutely positioned don't work in the real world, so the markup and css will have to be 60%+ rewritten and will likely not look exactly as it's laid out here.
- mrbogle 14y ago
  The intent at this point is to not generate layout html/css. Humans are much better at this right now than the editor could be. And the assumption is that the programmer will want to write the layout code himself anyway, being careful to place it in nice modules that fit with their dev environment. We could build an entire product just trying to generate semantic, reflowable markup from a design.
  - Watts 14y ago
    I agree. Let's be honest - it's kind of weird that we rely on a program that is really designed for editing photographs as our main tool for designing web sites. I'm all for exploring this further at least as a tool for doing layouts and design that CSS can handle. For everything else (e.g. designing icons), there are more appropriate tools.
    - fleetvanjeremy 14y ago
      It would be nice to have something that allowed you to use both. There can be so much rapid experimentation in photoshop because we know the tool so well - having that import easily into something like this for the final touchup would be ideal (in my most perfect world) as so much time goes into the touchup and the last few pixels in css.
liamondrop 14y ago
One of Photoshop's virtues is, in my opinion, that it is NOT a browser and does not force one to think in terms of what browsers can do. Like all freedom, such a huge range of possibility does pose certain problems, but it also allows for very interesting, sometimes completely novel solutions. I do both design and development and I find I use very different parts of my brain when doing one or the other. For me, it's important to stay far away from any kind of code until it's actually time to start implementing. Otherwise, I fall back to predictable habits.

mrbogle 14y ago

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 have. We're not sure what that looks like yet, though.

drivebyacct2 14y ago
I think what you have is great and I think you should run with what people are seeing this as "awesome" for, design prototyping. I think making this into anything that generates layout or uses the browser engine is going to be either: much harder than you think, or: will lose much of the functionality that you can allow for now via "do whatever, drag/drop, absolute positioning".
- tomsaffell 14y ago
  I totally agree. I've been wanting an app like this for the last 6 months (wondering why one didnt already exist), and a lack of fluid layout doesnt put me off at all. The one thing I really want is realtime collaborative use, ala google docs (Firebase should make that easy).
  - mrbogle 14y ago
    You should email me. ben@easel.io
- mrbogle 14y ago
  Thanks. That is the intent. Design prototyping, but with tools that allow the dev to build it more quickly.
JoshTriplett 14y ago
> The hard part about using the browser's layout engine is that it is limiting to the designer. True, and the even harder part is building a system that treats that as a feature rather than a bug.

rooibos 14y ago

I think it is more than a drawing tool, this is what the TBL intended the web to be. Where you can view and update pages from the same interface: http://www.w3.org/Amaya/ http://www.w3.org/Amaya/ A bit like a wiki but more rich.