There is an on-going debate around whether or not designers should know how to code.
My feeling is that we should know enough to be able to tweak things in DevTools and create simple prototypes in HTML, but that we shouldn’t worry about writing production ready stuff.
Design tools are for sketching
I try to remember that design tools (like Photoshop or Sketch) are for lo-fi sketching. Even highly detailed mock-ups can never really be considered high fidelity, because they lack the responsiveness and interactivity of HTML and CSS. They can never be truly finished.
Designing mock-ups is an incredibly useful part of most projects for me. But there is usually a point where they become tedious to maintain. Pixel perfection is impossible, but that doesn’t mean that visual finish isn’t important. Typographic hierarchy, measure, whitespace and grid ratios are. These are very tricky to control if you don’t know at least a little CSS.
When things get tedious, switch to code
Certain tasks become very repetitive or even difficult when using traditional design tools. Things like…
- mocking up the same page at different sizes
- styling up generic pages that could be built from existing components
- making small changes to existing pages
- explaining interactions and animation
I think it’s a designers duty to recognise this and make sure they aren’t spending too much time on things that could be done better in the browser.
Not Photoshop, not Sketch either
I know a lot of designers hope that one day a tool like Photoshop will be able to automatically export good HTML & CSS. I can’t see that happening, but tools like InVision, Sass and DevTools are getting closer and closer to becoming what we need. Even if they don’t look like traditional design tools at first glance.