Hacker News new | ask | show | jobs
by thesunny 4610 days ago
Hi Proexploit,

That's a good question. And I'll address it but first I'd like to make a clarification.

You mention that if all the floating elements have fixed width and height, then what benefit is there versus simply using absolute positioning.

So, for clarity, if we did give widths and heights to all elements, then yes, apart from perhaps some code readability, there wouldn't be many other benefits; however, we don't actually give heights to text elements. This allows the browser to flow the text dynamically and because of this, it is possible that text will render shorter or longer than in the original Photoshop file because of where the text breaks at the end of the line. This can be exasperated when certain fonts like Arial may display as Helvetica and visa versa depending on the operating system.

Elements that are under the text will either pull up or push down as the text gets shorter or longer. There is also another benefit in that if you tie the code into something like a CMS where the images or text are editable, then the layout will reflow in the way you would expect.

The question was: How do we handle mobile devices or devices with different screen sizes?

There are actually ways that we can support this in the future and it might even take just a few days to write it. We currently have a full generated internal DOM that we convert to HTML and CSS. We also export to other formats. For example, I forgot to mention this earlier, but we also automatically export in LESS, HAML, Slim, Jade, Less, SASS, SCSS and Stylus.

I haven't thought this all the way through, but I don't think it will be difficult for us to export all of the elements so that they are always stacked for use in mobile devices and resize images to fit better. We can probably share the HTML code and then provide a different version of the CSS for mobile. There are some more details than that I can think of already, but they can probably all be overcome.

I would like to address that this isn't the typical use case if you are designing your website in Photoshop. In such a case where you wish to use identical code to support multiple screen sizes, you would probably hand write code with a grid to achieve this. Even in this scenario, however, our software can help you slice images, generate HTML and CSS styling code and put it in a reference page to make it much easier for you to code the final page. This will still massively accelerate your web page development, of course under the assumption you are using Photoshop. If you don't care to use Photoshop, and if you are more of a developer than a designer than there may not be much benefit in doing your prototyping this way, then our software is not a good choice for you.

Again, we think Macaw is cool, but you aren't, at this point anyways, going to get anything near the depth, maturity, familiarity and available knowledge on the web for an image editor as Photoshop. For designers, it is probably appealing to use a tool that they already know well and is very good at what it does. I don't think Macaw is trying to compete as an image editor though. So you'd probably build your image assets in something like Photoshop and then import and layout in Macaw. For some, they may prefer everything in a single tool.