Design for Hackers: Reverse Engineering Beauty

Category: Graphic Design
Author: David Kadavy
4.2
All Hacker News 20
This Month Hacker News 1

Comments

by jayshua   2019-02-01
I was in your boat about five or six years ago. Programming was fine, CSS was kinda-not-really ok, and design was just non-existent. Over time though, it really is something you can learn.

I started by cloning designs in CSS that I liked. Same way I write programs just to learn. Pick a design and try to reproduce it. (Here's a good simple one that could probably be finished in a single sitting. [1]) Eventually I was able to clone an entire website while only referencing the internet for CSS details, not core concepts. It'll take time just like learning any language, but the theory behind CSS does make sense if you can peel back the layers of features built on top of it. (Like Git, the core model is beautiful - the CLI not so much.) Reading about the "cascade" part of "cascading style sheets" would be a good place to start if you get the basic syntax already. Then study the selector operators. All of them, there aren't that many.

Then read books on design. Info about CSS the language is readily available online. Info about design, not as much. Design for Hackers [2] is targeted at programmers and explains not just the what but also the why certain designs work. The way our brains interpret color and how that causes certain colors to work well together. How people process information and how to leverage that to make designs that "make sense." Visual Grammar [3] is a design reference book I refer to. It's like a SQL reference book - won't teach you the language (of design) but explains the options you have and when they could be useful. Things like "these types of alignments will produce this type of result."

Just remember that it takes time to learn a skill. And design is definitely that - a skill that can be learned.

[1] https://assets.awwwards.com/awards/images/2016/04/uxpin-teas... [2] https://www.amazon.com/Design-Hackers-Reverse-Engineering-Be... [3] https://www.barnesandnoble.com/p/visual-grammar-christian-le...

by aicioara   2018-11-13
As a hacker with no design background, reading Design for Hackers [1] was life changing. I finally understood that design is just a set of rules and that really modelled well on my engineering mindset.

Add to that frameworks such as Bootstrap CSS and opinionated website builders such as Weebly and I finally overcame a major limitation in my skillset. I could now actually build what I wanted to build, knowing that it looks decent and I can focus on what is under the hood.

If the web all looks the same, it is probably because it is built by people like me who need a rigid framework to work within.

[1] https://www.amazon.co.uk/Design-Hackers-Reverse-Engineering-...

by dpeck   2018-11-10
Its honestly not that hard to get to the novice level at design and be able to have conversations with experts in the field. Like other things in its basics you're learning vocabulary and the rudimentary understanding of "why" certain patterns are used. If you're not looking at doing the design yourself you can bootstrap this up inside of a year.

I found https://www.amazon.com/Design-Hackers-Reverse-Engineering-Be... to be a good basic overview of a lot of elements.

by revorad   2017-08-19
Design for Hackers by David Kadavy is really good - http://www.amazon.com/gp/product/1119998956/ref=as_li_qf_sp_...
by estel   2017-08-19
Link for the UK store: http://www.amazon.co.uk/Design-Hackers-Reverse-Engineering-B...