• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Sketch for web design?

Hi. I am currently looking to change career into web design, and currently I am learning HTML / CSS. I am a graphic designer by trade, but I want to learn about the back end, so hopefully I can design & build sites.

I am doing a bit of research on which software to use for the design side of things, and I keep hearing good reports about sketch, as I understand this is geared up for web / UI as its all vector based. I used to use photoshop for mock ups, but would I be making the right moving moving to sketch? I only want to design for the web, so most of photoshops features I won't need to use.

My question is if sketch is the one to learn, and is this hopefully go to be around for a few years?

Also does it help in generating code when you export your designs? I have also heard of macaw, but is this any good?

I suppose my main skills will always be the design side of things, but I am looking to learn about the build of things, but I can never see me being a great coder as its probably a bit too technical for me, so certain tasks I may have to pass over to someone else, but we will see.

Any advice on where this industry is heading would be much appreciated.

thanks guys


Staff member
Ive never used Sketech but it looks pretty decent. That being said, you've probably got enough to learn without more design software.

I started web development from roughly the same point as you and have been using photoshop to desing sites without too much hassle. I downloaded some psd templates contain web grids at various sizes and theyre a huge help when moving into development from a design. I cant find the website but have ulpoaded a zip of the templates to my server for you if you want to try them out: http://www.artelcreative.com/downloads/grids.zip.

Good luck.
Thanks for this, much appreciated. Quite a few people online are saying that photoshop is becoming a bit dated for front end design and sketch is a better tool for this type of thing. Do you know if sketch or anything else can create the code for websites? I am already finding the code side of things a bit boring, but trying to explore the best options for me. It also seems sketch seems to be quite in demand based on reading job descriptions.


Staff member
I would steer away from apps that will generate code from flat designs as they have a tendancy to generate really messy code.

Which resources are you using to learn html, css etc..? have you tried codecademy? Its a a great place to start.

Paul Murray

Staff member
I use Sketch for all my digital designs, save for when I work in a studio, then I'm forced to either use Photoshop or Illustrator, neither of which really fits the needs. Photoshop now has features such as symbols and artboard, but it really feels like Adobe are adding these features in to try and compete but it just makes everythign feel bloated to me.

Sketch works with another app called Zeplin, that allows you to share layered Sketch designs with developers, enabling them to download icons/assets and view colours, sizes and CSS values. It's possible to copy CSS styles directly from an element in a Sketch file and paste them into a text file as CSS, though I don't think you can export to HTML/CSS natively as I've never looked.

Another option is Affinity Designer which has a cool feature that allows you to design a responsive layout in a way that will actually adjust like a real site.

I can't see either of these taking over from Adobe products anytime soon but they do seem to be gaining in popularity. More than likely Adobe will either buy one of the companies out and continue their monopoly or create rival software. Adobe XD does similar things, but seems to be more for prototyping than actual design.