This looks very much like Fireworks. The author mentioned that he won't discuss it since Adobe discontinued it, but the resemblance is uncanny. I never understood why Fireworks wasn't more widely used/praised; I found it to be absolutely perfect for designing web graphics.
I never understood why hybrid vector/bitmap editors didn't gain more acceptance: it seems a natural way to work. This one-or-the-other mentality may suit developers of the software, but it's not natural for users.
I like to be able to go back and edit my shapes, yet change the contents in ways that only a bitmap editor would be able to. Storing a history of the transformations I did and re-applying when I'd resized/changed the shape seemed sensible - as well as allowing me to go back in history and remove some.
As a self-taught designer, watching professional Photoshop users for the first time was mind-boggling: they make items and then throw them away and re-make them if they need a different size - or crop parts off, rather than masking. It's all destructive editing! I learned a lot about layers and could see the benefits of them, but still...
If I remember correctly Deneba Canvas supported the hybrid Vector/Bitmap approach, but never gained enough traction to be a viable product.
I notice this about Photoshop users myself but I also notice the more time you spend using it, the biggest efficiency gains you make to your workflow come from using vector shapes and non-destructive editing (various types of masks, adjustment layer, layers with blending options). There are a few things where destruction is required but often I stash an old copy of the layer unless I'm dead set on the new version, but this can be rare. You also learn as time goes on how annoying a PSD with rasterised elements that didn't need to be rasterised are!
You should always be able to do non-destructive editing even when pretending to work destructively, by keeping around the original sources (which you keep around anyway in most cases) and the graph of operations applied (which isn't much data). Or rather, the software should be able to do that. I'm surprised that there don't seem to be any applications doing that.
Sketch has much better support for layer and stroke styles than Fireworks did, particularly older versions of Fireworks. For example, you can apply multiple gradient layer styles to both the stroke and the fill of a rectangle in Sketch, with alpha. In Fireworks, you often had to make two or three rectangles to get the appropriate effect of a photorealistic button.
Seems like most designers dismiss Fireworks before even giving it a chance. Once you get over the initial bump it actually feels much nicer to work with than Photoshop.
The only thing really listed in this article that Fireworks hasn't done for years is the retina capabilities.
Fireworks blows sketch out of the water performance wise and also opens layered PSDs/copy and paste support for vectors from Illustrator.
Adobe killing off Fireworks just proves how little they understand the needs of their customers.
in fireworks it's called "Common Library" but it's really useful for that kind of stuff. It also has "styles" functionality that flow through to all of the pages for element styles.
Nice post - Sketch is revolutionising UI design workflow. Really well thought out product — we've standardised on it for all our products at work, and I haven't even installed and Adobe products on my newest laptop, 8 months in.
I'll admit that I was initially frustrated at the constant crashes etc, but there's a very responsive team, constant releases, and I haven't had a problem in months.
I've been using Inkscape on my Mac for quite a while, but the team doesn't seem to be willing or able to support the platform well. The download page still has 0.48.2 which is pretty ancient; I'm not too optimistic 0.49 will see good mac support either.
I like inkscape, and if I migrate to Windows / Linux I can continue to use my assets there.
But this app looks very nice; I wonder if anyone can briefly mention the areas where one app is stronger than the other.
My design workflow has moved from Illustrator for design structure and Photoshop for high-fidelity design, to strictly Sketch from conception all the way to exporting assets, with the rare Photoshop for some assets (like to-the-pixel ones).
It's totally changed my design process, and it's made me wonder why there wasn't a really good app that was built from the ground up for UI design before—and why we have been 'hacking' Illustrator and Photoshop to do UI design. Vector objects on a pixel grid, @2x exporting, non-destructive properties on items. Still buggy as hell, but despite having to restart it multiple times a day, it's still worth it.
It would have been great to point out at the beginning of the article that this sketch software is for Mac only. Serious web development is not only done in Mac, did you know?
I remember in 2001 a friend of mine brought his black Apple laptop at work because he wanted to work with it to do a web application in Java. Everyone laughed at him. Now if I see someone with a thick Dell or IBM laptop it's the exception.
Sketch is absolutely amazing. I moved from Illustrator to Sketch last year, as I was getting frustrated with cruft Adobe were adding, and things they weren't fixing.
It took a little longer for me to get used to Sketch at around 3 months of casual use, but I find it much faster, simpler, and easier to use than Illustrator.
With Adobe now forcing a subscription to their Creative Cloud service for future updates, I'd expect programs like Sketch to become more and more attractive as well.
Sketch is on it's way to being what Illustrator should be. It's still a little buggy at times, for instance, you can't export things at high resolution and the workaround, resizing a group of objects, rarely works correctly.
Sketch is better than anything else on the market simply because it's actually made for user interface design. Everything else that's existed for years was made for image processing.
Sketch literally gave me the push I needed to go from a non-designing developer to a halfway decent designer. It's really that good.
The major negative right now is performance. I used Sketch to design a full iOS app with 7 or 8 screens on a fast mbp and things were seriously crawling. I had to break up separate screens into separate sketch files and even then it was laggy.
Sketch team, your product is amazing, but performance is a big issue. It should imho be your top priority.
Agreed. Seriously picking up UI design in a post-Sketch world is basically the same as picking up web programming in a post-J2EE world. You dodged a bullet.
(I am pretty proficient in Photoshop, but never had to design a photorealistic mobile UI in it. What a nightmare.)
Agree with your initial point. It's quite easy and intuitive for us non-designers too. Been using it past couple of months and prototyping my apps here.
For Windows, take at look at Xara Photo and Graphic Designer. It's principally a vector Illustration program but includes some photo manipulation capabilities too (cropping images, adjusting brightness and contrast etc).
The interface is far superior to Illustrator and it's extremely fast in performance.
I have used this program for many years and recommend you give it a try to see if you like it.
There is a free trial version of the software on the Xara website
I discovered Sketch about a year ago, and I should say it keeps getting better comparing to Illustrator. There are still some operations I can't do in Sketch, but it is the fastest and the lightest app to design UI such as http://dribbble.com/shots/1111784-iOS-7-icons-redesign/attac.... It took me few hours to redesign a whole iOS7 icon set in Sketch.
Last months I use Illustrator to convert files to SVG to work on them in Sketch.
The sad thing is that it works on Mac only and is not adopted by the designer community yet.
Sometimes things don't vertically center properly when I use the "Align Vertically" button. I haven't seen anyone else complain about this, so am I doing something wrong?
Ninja edit: After looking at the screenshot I posted above again, it looks like the entire textbox is being vertically centered (the blue outline is centered), but not the text inside of it. Why does it a function this way and can I change it so that it vertically centers the text? Thanks.
I've been using Sketch exclusively for the better part of a year, and it's not just a better tool for designing web and mobile UIs, it's a real pleasure to use.
There are still quite a few bugs, but even with those, the Sketch workflow trumps Photoshop, Illustrator and Fireworks. Version 3 should also address most of these, and is supposed to include support for symbols as well.
I still use DrawIt from BohemianCoding (the same company / people) and it's really good for smallish UI work. The CoreImage based text rendering sucks and it leaks memory like anything but it's a nice piece of software. I hope sketch has all of what they created in DrawIt and more. Good luck!
Usable smart guides as a feature have been in the shitty freeware vector tools I used 7 years ago. I don't quite understand why the author is wetting his pants because of them, but maybe the Apple ecosystem has been so far behind that this is somehow new and cool.
I tried it a few weeks ago and after working for about 2 hours on something I realized that Sketch doesn't have any support for color management (switching color profiles etc.). This is a showstopper for me.
