
Ask HN: How can I get better at design? - nudge
While for larger projects it makes most sense to partner with a designer, I would like to be able to make my own hobby projects/sites look a bit better (http://vowsjs.org/ is a fantastic example - I wouldn't even know where to begin). The problem is, I'm not terribly artistic. I understand HTML/CSS fine, and I can tell what (I think) looks good, but I wouldn't have a clue how to do it myself. Is this something I can improve at, and if so, how? Thanks.
======
justinph
I'm a designer. Many sites I see that are made by non-designers suffer from
two major flaws:

\- Lack of white/negative space: You need room for your elements and type to
breathe. Along this same line, you need to give generous padding and margins
to things. If you ever have type squished up against the edge of a box, that's
guaranteed to look bad. Have a repertoire of spacing that gets used in
multiples: 5px, 10px, 20px, etc.

\- Lack of hierarchy/scale: I think these two go hand in hand. One of my
typography teachers in school had a saying: "Don't just make it 60pt, make it
600pt." Rather than bumping the heading up 10px, bump it up 30 or 40.

Bonus tip: Read about Gestalt Theory and you'll start to understand the
psychology behind design. Might work for you if you're a techie:
<http://en.wikipedia.org/wiki/Gestalt_psychology>

~~~
alanh
Agreed. Allow me to add a few “avoids:”

For me, biggest tell-tale of a new designer is overuse of design elements and
frills. Adding gradients, shadows, faux 3D, outlines, images, etc. should not
be done without a good reason, and sparingly.

Your user’s attention is limited. Plan for this. Visually emphasize only the
most important thing(s) on the page — 2 or 3, maximum. This often means not
using many saturated colors (ever notice how much there is grey in OS X? It
stays out of the way. I find Aero Glass unbearably distracting at times.)

You don’t have to make your content (as opposed to nav) hyperlinks use a color
from your branding palette. In fact, don’t, as rule of thumb. Make them a
decent blue (not super saturated like #0000FF), and do vary them for :visited.

If it sounds like I am saying “don’t have fun,” I apologize; I tend to be
overly minimalist. _Do_ the fun stuff, just use them as demos, not in
production (music band sites excepted).

------
awt
A book I've found to be very useful for picking the absolute basics of graphic
design (which applies to web design in many ways) is "The Non-Designer's
Design Book."

It covers the basic principles of graphic design:

Proximity

Alignment

Repetition

Contrast

It also covers the basics of using color in design.

Universal Principles of Design is also a fascinating read.

I've found that reading these books, then trying to design something is
helping. It helps if you've tried to design something before reading the books
as well.

~~~
edanm
Helped me a lot too.

Amazon link: [http://www.amazon.com/Non-Designers-Design-Book-
Typographic-...](http://www.amazon.com/Non-Designers-Design-Book-Typographic-
Principles/dp/1566091594)

~~~
cageface
For a design book that is an _ugly_ cover.

~~~
nailer
yes - they just a lost a sale for me. The yellow and the purple tones are too
close.

~~~
tokenadult
That's the publisher's house style, I'm pretty sure. Author's rarely have
control over book covers or book titles--publishers think they know more about
such marketing issues than authors do.

~~~
zackattack
That sounds reasonable, but Steve Krug's _Don't Make Me Think_ is a design
book that embodies its own principles, from cover to cover.

------
Robin_Message
A nice piece of advice I've seen is to start in black and white (and shades of
grey) and get the contrast and lines and so on right first. Once that looks
good, either leave it, or then add colour and texture (and maybe remove some
of the lines and borders if the colour or texture changes make them
unnecessary.)

Sketch designs on paper on a grid, with a nice pen. It's easier to try out
ideas and evolve when they only take a minute.

Practice.

------
ErrantX
I'm pretty bad at design but what I have found has sufficed for me in the past
[1][2] is:

\- bold colourful blocks

\- tend towards minimalist

\- use no more than 3 colours in a design

\- use colourlovers.com for palettes

\- copy nice bits/ideas off other people (obviously without ripping off entire
designs)

\- avoid gradients

EDIT: oh, one other thought. One or two fancy bits of design or JS magic ==
good. Too many == very bad :)

1\. <http://www.errant.me.uk> (minamilist) 2\. <http://www.startupwiki.co.uk>
(bold colours, blocks)

~~~
jcromartie
In design for the _real world_ , absolutely avoid gradients. But in design for
the screen, subtle gradients can help add a nice shade of realism or texture.

For example: Holiday Inn Express just redesigned their logo to look like some
Web-2.0-style icon thing with gradients and drop shadows. They look absolutely
_horrible_ on signage. They look like gas station signs now.

~~~
ErrantX
Yes; I wouldn't disagree... in general.

But as a "pretty bad designer" gradients tend to be territory that is destined
to fail. :)

------
erenemre
When thinking about getting better at design, do not think making things
pretty.

Instead, think how you can solve problems, how you can make your users' life
easier. And this actually begins with a lot of thinking.

I cannot recommend you any specific sources but most of the people learn
design by trying. If you want to improve your visual skills, look at other
designers' works. Try to copy them (do not steal :), read tutorials.

------
mebassett
I'm a terrible designer too, so I'm really not in any position to give advice,
but I can share my process. I figure, like any other technique, the way to get
better is to do it a lot. I usually get so frustrated after trying to make a
decent design for one website that I don't do it again for several weeks.
Anyways:

0) learn new design techniques. Try to do this regularly. Its like adding new
tools to your toolbox. A list Apart has a bunch of great tutorials, and
checking out design galleries (<http://html5gallery.com/> has some nice sites)
helps to give you inspiration and give you something to try to duplicate on
your own. I don't mean to duplicate good designs for your own work, but to
duplicate good design so you can learn the techniques used.

1) Sketch a design on paper. I don't focus on making it look cool or pretty
because I don't know how. I try to focus on solving the user's problems. I do
several sketches, and ask friends to glance at each. At the very least to see
if they get the idea of the website from looking at, but also to know which
ones they like best.

2) Graphical Mockups. I use the gimp or adobe fireworks. Again, I make several
different mockups from my best sketches (between 2-4). And again, I have
friends and colleagues review them and get their feedback. I put as much
detail as I can into each - hover effects, shading, et cetera. I try to make a
pixel-for-pixel mockup of what the actual html/css will look like.

3) Finally write the html/css for my best design.

------
telemachos
A slight tangent, but something I did recently:

1\. Apply Eric Meyer's CSS reset to strip _all_ presets from your site.

2\. Fix your site.

It doesn't necessarily help you to reach _good_ design, but it forces you to
consider how many things you need to worry about.

Link to Meyer's reset: <http://meyerweb.com/eric/thoughts/2007/05/01/reset-
reloaded/>

------
SandB0x
Learn about typography. This will start to change how you think. A fantastic
and accessible starting point is:

"Stop Stealing Sheep and Find Out How Type Works", by Erik Spiekermann

[http://www.amazon.co.uk/Stop-Stealing-Sheep-Find-
Works/dp/02...](http://www.amazon.co.uk/Stop-Stealing-Sheep-Find-
Works/dp/0201703394)

~~~
sublemonic
Another good typography resource: <http://www.typographyforlawyers.com/>

------
fjabre
I believe in free trade for the most part: everyone doing what they do best.

Focus on what you're good at. Design is serious trade that takes designers
years to get good at. If you need a quick design then check out some free css
template sites or the many sites that will sell you a prefab design for cheap.

About the only thing you need to be able to do is edit the design with a
program like Photoshop or Fireworks so you can make minor changes if you need
to.

Again, focus on what you do best and be resourceful instead of trying to
become a designer yourself. Also, once you have a good design in place don't
forget to make use of PSD to HTML services like w3-markup.com or psd2html.com.
They're cheap and will save you a lot of precious time.

~~~
metageek
Specialization is useful, but it's also useful to have some minimal level of
design competence, just so that you can make a prototype and not have people
reject it just because the design is lousy.

(Also, having a basic grasp of design will help you decide whether your
designer is doing a good job.)

------
seanlinmt
"Bad artists copy. Good artists steal. " - Picasso

Seriously... probably looking at examples of beautifully design sites and
getting some 'insipration' from them. Articles on smashing magazine are pretty
good, <http://www.smashingmagazine.com/>

And I've recently found <http://www.metalabdesign.com/>

I reckon it just boils down to practice and lots of redoing your design over
and over again. I don't like doing it because it seems like a waste of time
compared to the amount of code I could have written.

------
idan
I gave a talk on the subject at DjangoCon.EU recently, so shameless self-plug:

<http://blip.tv/file/3685673> \- Design for developers: Making your frontend
suck less.

~~~
idan
Also the slides for the talk: scribd.com/doc/32311867/Design-for-Developers

------
csallen
While I'm not an amazing designer by any means, my design skill have improved
drastically in the last couple years. I'd say the most important things are
practice, iteration, and inspiration.

Practice - Get a tool like Photoshop. Make a mockup, then turn it into a real
website using HTML/CSS. Design _at least_ 4 or 5 sites. You'll get better at
Photoshop, better at HTML/CSS, and better at design.

Iteration - Don't expect to get a mockup right the first time; don't be
satisfied with a mediocre first revision. Keep iterating on a design, tweaking
it and changing it until it looks great. This part always takes me longer than
both the initial design and the coding.

Inspiration - Coming up with designs from scratch is difficult. Instead, hang
out on design-related websites (I especially like SmashingMagazine.com). Check
out the numerous web design galleries online. There are also some cool UI
galleries out there. Make note of what inspires you, and mix and match
elements from different designs to create designs of your own. Or, just
blatantly steal haha. I laugh, but I'm not kidding -- copying someone else's
design is decent practice. And once you start iterating, it will become your
own.

What's important is to realize that becoming a good designer is a path you
must traverse; it's not a destination you can simply teleport to. So start
walking!

------
prawn
Pick a colour scheme and try to keep it consistent. One or two core colours
and then black, white and/or grey. Select one colour and use it as your action
colour.

Padding has been mentioned also. One common mistake made by non-designers is
to pack everything in. Have fat padding on bordered boxes or separating
elements.

But something I didn't see in a skim through the comments was alignment. The
single biggest improvement you can make with your work is with horizontal
alignment (ErrantX, if you spot this comment, you could easily do this with
the URLs you provided as examples). It will make your design appear neater and
simpler - less chaos can mean that your target-points are more obvious. So, in
a simple design, make sure your top-left logo is aligned with your H1 down the
page which is aligned with your paragraphs.

FWIW, I co-wrote Web Graphics for Non-Designers around 2002/03:
[http://www.amazon.com/Web-Graphics-Non-Designers-Nick-
Boyce/...](http://www.amazon.com/Web-Graphics-Non-Designers-Nick-
Boyce/dp/1590591712)

My chapters were Color Theory, Visual Elements, Layout and maybe another one -
can't remember. Parts of the Color Theory chapter were put online as a sample
when it was published:

[http://www.webreference.com/authoring/graphics/color/nondesi...](http://www.webreference.com/authoring/graphics/color/nondesigners/chap2/1/)

If you're in South Australia, I have a few spare copies of the book lying
around if you want one (too lazy to post, sorry!). As I said, it's ancient in
Internet-years now, but might be more useful to someone than it is to my
bookshelves.

------
rguzman
One thing to keep in mind is that "graphic design" and "user interface
engineering" tend to get conflated. They are not the same thing, but pretty
closely related.

I find that the best way to proceed is to design an "overall style" for the
site first. That means, pick a color scheme, typography, and base layout
according to the principles mentioned in other comments (e.g. CRAP).
Thereafter, the problem becomes user-interface engineering (which, in turn,
may lead you to change your design).

I found this talk to be really helpful:
[http://37signals.com/svn/posts/1952-i-gave-a-talk-on-ui-
fund...](http://37signals.com/svn/posts/1952-i-gave-a-talk-on-ui-fundamentals-
for-programmers)

Also, +1 on The Non-Designer's Design Book.

I've also found many useful articles here: <http://www.azarask.in/blog/>

In particular,
[http://www.azarask.in/blog/post/know_when_to_stop_designing_...](http://www.azarask.in/blog/post/know_when_to_stop_designing_quantitatively/)
and [http://www.azarask.in/blog/post/how-to-critique-an-
interface...](http://www.azarask.in/blog/post/how-to-critique-an-interface/)

~~~
larrywright
I saw Ryan Singer's UI Fundamentals talk in person at Windy City Rails. It was
worth the cost of admission by itself, and I can't recommend it enough.

------
nandemo
Meta-comment: I really dislike the trend of abbreviating "web design" to
"design". In a software context, I take "design" to be "software design",
though even this abbreviation is usually unnecessary. Why pollute the
namespace?

------
stefs
1\. find an existing design you like, e.g. the vowsjs website. use it as a
starting point.

2\. find another existing design you like, e.g. the designiskinky.net - they
doesn't have to be related.

3\. try to combine them. what do you like about each of them? what do you
dislike? try to replace the parts you dislike with your own variations. get
inspiration from other sites. also, change some of the basics: color scheme
(there are online color scheme generators), fonts and -sizes, spacings, ...

4\. cobble it all together.

5\. it will look horrible, so change a few things and iterate.

6\. it will still look horrible. the color scheme doesn't fit somehow. the
font - looking good on its own - is still terrible for headlines. the menu is
not where others expect it. you notice that the one cool gimmick you invented
is not only useless, but totally distracting. you'll find you took a great
website, took all the good parts out, replaced them with other good parts that
totally make no sense in this context and that the result is horrible. also,
the site will look boring. you'll want to throw it away and start again.
you'll start to notice those sites were made by experienced designers and
there was a reason their sites were built that way. now your website is ugly,
your motivation is gone and also time ran out. you'll put it online anyway
because you don't have an alternative, but it wont cost you any money because
the site sells nothing and - be honest - it's still better than most of the
sites out there.

great, you learned a lot of valuable lessons!

but i tell you as much: you'll never be happy with your designs. they will
always look dull and boring - that's because you made them and stared at them
for hours. don't worry, just put them online. you can always redesign them in
a year.

------
jarin
Most of my design comes from 4 basic ingredients:

\- <http://colourlovers.com>

\- <http://0to255.com>

\- border-radius

\- text-shadow

------
azharcs
These were some of the books which taught me a lot about Design were:

Don't make me Think by Steve Krug [http://www.amazon.com/Dont-Make-Me-Think-
Usability/dp/032134...](http://www.amazon.com/Dont-Make-Me-Think-
Usability/dp/0321344758/)

Non-Designer's Design Book [http://www.amazon.com/Non-Designers-Design-Book-
Typographic-...](http://www.amazon.com/Non-Designers-Design-Book-Typographic-
Principles/dp/1566091594)

Universal Principles of Design [http://www.amazon.com/Universal-Principles-
Design-Revised-Up...](http://www.amazon.com/Universal-Principles-Design-
Revised-Updated/dp/1592535879/)

Also make sure you go through design's everyday on Behance.net, they have some
really amazing designers and design.

~~~
neves
Non-designer's book is really a great introduction.

------
joshuacc
First of all, don't get locked into Photoshop tutorial mode. Tutorials can be
helpful, but unless you understand the reasoning behind what you're trying to
achieve, you're only going to be learning how to do that one thing.

For a broader perspective that will serve you well, I recommmend:

1\. Take an art history course - Or watch a video survey of the subject

2\. Learn to draw - Drawing on the Right Side of the Brain is a good
introduction

3\. Learn the basics of typography - Bringhurst's The Elements of Typographic
Style is a classic

4\. Visit museums of art and design

Since you're talking about web design in particular, I'd recommend reading
Jakob Nielsen, as well as Steve Krug's Don't Make Me Think to make sure your
design ideas don't clash with usability.

------
edanm
I'm no great designer, but a few things I did:

1\. Read "Non Designer's Design Book" (amazon: [http://www.amazon.com/Non-
Designers-Design-Book-Robin-Willia...](http://www.amazon.com/Non-Designers-
Design-Book-Robin-
Williams/dp/0321534042/ref=sr_1_1?ie=UTF8&s=books&qid=1277896513&sr=8-1)).

2\. Subscribed to a lot of web-design blogs (try Six Revisions, NetTuts etc.).

3\. Learned to work well with Photoshop. I especially loved Lynda.com's
Photoshop courses.

4\. Designed, designed, designed. As with everything else, actually doing is
the most important thing.

------
vijaydev
<http://news.ycombinator.com/item?id=1103578> \- Check this out. Has pointers
to lots of good resources.

------
marknutter
Here's how I was able to get pretty good at design:

Every day, visit a variety of CSS galleries and make sure to view at least 100
designs, saving the ones you like the best.

Start a personal website if you don't already have one, and begin creating
mockups in Photoshop or Fireworks of what you want it to look like. Most
likely, you will be unhappy with what you create more often than not, but it's
important that you keep iterating.

When you finally create a design you personally like, subject it to outside
criticism from designers who know their stuff. Do not take anything they say
personally. They will probably rail on you about typography, whitespace, the
grid system, proper color matching, and so on. Go through the process of
fixing your design to address those critiques.

Last, and most importantly, redesign. Although I think that there is an
element to design that's innate, I would argue that it's mostly about practice
and pattern recognition. It's all about being able to pick out the best
designs and have your opinions match up with the largest percentage of the
population as possible.

Most of good design is just re-applying the best elements of other people's
designs. Truly innovative design is a rare thing and hard to pull off. It's a
bit like fashion or modern art - most people will balk at truly creative
stuff, but it can make it into the mainstream with enough persistence.

TL;DR view css galleries obsessively and save your favorites, perpetually
redesign a personal site, frequently ask for feedback from other great
designers, accept criticism gracefully, practice, practice, practice.

------
samdk
_Practice, experiment, and get feedback_

Especially if it doesn't come naturally to you, getting good at design takes a
ton of practice. But if you do practice, you can _definitely_ improve your
design sensitivities and skills.

Make sure you're getting feedback--and not feedback that says "I like that" or
"I don't like that". Specific feedback is really really essential to improving
what you're doing.

 _Purpose and focus_

I think purpose and focus are the key to a good design. _Never_ do something
without a reason. Remember that the reason you're doing design, at a very high
level, is probably not to make something pretty. It's to help whatever you're
designing better accomplish its purpose. Making pretty might be (and likely
is) part of that, but it's _not_ all of it. Always keep that in mind.

 _Typography_

The other stuff mentioned here is also essential to know, but don't forget
type. Type can (and will) make or break a design. I recommend taking a look at
Typography for Lawyers (<http://www.typographyforlawyers.com/>) to get a
start, even if you're not a lawyer. It has a good overview of a lot of the
things you need to be thinking about, and you can ignore the lawyer-specific
details. Type, like everything, takes practice. I recommend finding a couple
of fonts (1-2 sans-serif, 1-2 serif) and getting _very_ familiar with them.

If you'd like more help, or feedback on something you're doing, feel free to
send me an email--it's in my profile. I'm far from an amazing designer, but I
am pretty good at giving feedback.

------
SkyMarshal
Good topic & advice. Tangential question:

Will Photoshop/GIMP be necessary for web developers now that we have HTML5?
The various components of HTML5 can create many of the things we've used
images for in the past - buttons, layout, etc. Do us non-designers still need
to learn photo/image tools, or can we just focus on HTML5/CSS3/Javascript?

~~~
bad_user
What are you going to do? Design your logo or your icons in HTML5? Make
adjustments of your photos with HTML Canvas?

Of course, layout designing in Photoshop always seemed a strange habit to me,
ever since I tried it 8 years ago ... because fonts rendering doesn't match;
many HTML designs have fluid elements that aren't properly captured by
Photoshop/Gimp; and in general you tend to make overly complex designs when
working in an image editor.

Good practices transcend fashion IMHO.

~~~
SkyMarshal
Well icons and buttons can all be done in CSS3 now:

[http://nicolasgallagher.com/demo/pure-css-social-media-
icons...](http://nicolasgallagher.com/demo/pure-css-social-media-icons/)

Photos obviously can't, so I guess that's a reason to keep photo editors
around. But is that all?

And yeah, I never liked mocking up sites in photo editors either.

------
jgv
For starters, read "Grid Systems in Graphic Design" by Joseph Muller-Brockmann
and "The Elements of Typographic Style" by Robert Bringhurst.

After that, practice all the time. Do a ton of self-initiated projects or
design for friends pro-bono. Always be looking at designers who you admire and
figure out what about their work is so admirable!

------
uggedal
Read <http://designingfortheweb.co.uk/book/>

~~~
irondavycole
As a designer, I highly recommend this book. It's beginner level but very
comprehensive.

------
Vistico
Well one important thing I would have to say is to first pick a style!

It's easier to mature and gauge your progress when you choose a style and then
mature it progressively. The through constant practice and maturation, you
willl become better at the process. Both a drawing with great detail and one
with lack of therefore can be drawn by the same "talented" artist.

I'd say the three basic places to start are typography, proper padding, and
_style_ (which can be use of borders, rounded corners, sharp edges, or
minimalistic as long as it's consistent). There defiantly is always a style
that can be identified with each artist's work. And even with someone with the
greatest portfolio you can usually identify elements that reveal the artist
art work. So what you will have to do is iterate and experiment with the above
until you develop.

1\. A style to commercial (or your) liking.

2\. Basic sensibility when it comes to web design or your relevant project
space.. the sensibility changes with the medium at least to a small degree
(design common sense).

Just like you use your judgement to decide to at least a small degree who's
advice is worth listening to in this post, you need to build that same common
sense up for design. I suggest doing mini front page fake products up to build
up your skills. When you get better at that (you should notice significant
improvement after 6-10 projects) try to go a little further and create an FAQ
or about page for that product with that style it will become alot easier
since you've already gave "definitions" to how some elements should work and
the overall spirit of the project.

(One thing to note is it helps to have at least SOME Photoshop and Illustrator
skills, at the very least you might want to add some texture to your products
and custom gradients. IMHO it's alot easier to get great work out when you can
over kill the project. Just barley getting through it with hard "Crusty the
clown" colors will bleed your project. This is coming from someone who taught
himself good web design)

I'd be glad to show you my latest projects for you to judge for yourself. Hope
this helps.

------
wenbert
Time and practice are the best teachers. If you can tell what (you think)
looks good, then you have already solved half of your problem. Spend a few
hours tweaking and improving on a design until you are able to come up with a
design that you like. Look for inspiration on movies, photographs, nature or
other websites.

I remember spending a couple of days on my old website design. I listened a
lot to soma.fm and I noticed that the music kept me focused on the design I
was working on. I remember dreaming about what I am going to tweak/change the
next time I opened Photoshop.

Also, learning to imagine and think ahead on "how to do this and that in
HTML/CSS" will save you a lot of time and effort.

------
generalk
I'm doing the same thing right now, and I'm approaching it the same way I
learned to code in the first place: look at something someone else has done
and try to duplicate it. This is a good starting point but a horrible end
point.

------
tom_ilsinszki
Consider working with a designer even on small projects, because it's a low-
cost and low-risk way to get to know designers and filter out the ones, you'd
love to work with on bigger projects.

Also, I don't have proof for this, but based on my experiences, designers need
to be less analytical, and a little more intuitive. While programmers need to
try to be as analytical as possible (while programming at least). So, I think
it's not really easy to be good at both (again, my opinion).

Advice: develop an eye for design, so you know what's good and what's not, and
learn how to communicate with designers more effectively than most
programmers.

------
andycroll
I always recommend Mark Boulton's book:

[http://fivesimplesteps.com/books/practical-guide-
designing-f...](http://fivesimplesteps.com/books/practical-guide-designing-
for-the-web)

It's more about the theory of design, but presented in an accessible style and
'web' context.

There's also the Pragmatic Programmer's 'Design for Developers' book, but I
haven't gotten around to anything more than skimming that one yet.

[http://www.pragprog.com/titles/bhgwad/web-design-for-
develop...](http://www.pragprog.com/titles/bhgwad/web-design-for-developers)

Hope these help.

~~~
blaix
I've been meaning to read Web Design for Developers myself and was going to
recommend it as well. I've heard good things.

------
allenp
I think something you need to consider is to use design tools for designing -
paper and pencil, then gimp/photoshop.

The best designed sites out there aren't designed on the web, but rather
designed for the web. Try to make a good design first and then use your
html/css skills to adapt it to the web (and obviously since you know the
limits of html/css you can keep yourself from going to far in a direction that
would be overly complicated to implement).

Also, keep it simple to start and make incremental changes.

------
mgrouchy
I feel you here, I am a terrible designer. I just redesigned and relaunched my
blog with no content. It is a huge step up from what I had before.

Do you have any friends who are designers? What I have been doing is when I
see designs my friends make, I ask them constantly(they must be getting
annoyed by me now) why they make particular design decisions. Using this
knowledge helps me make better design decisions going forward. I'm still super
terrible, but I am slowly getting better.

------
vessenes
I like this question as I have had an interest in design for many years, but
largely hired designers to work for me, and focused on technology.

One thing that separates good designers from hacks (in my opinion) is their
appreciation of the history of design. Say you take your text, shrink the font
down, and then jam the paragraphs far away from each other in a two column
layout leaving a giant gutter (is that the right word?) in the middle and no
left or right margins. That's (whether you want to or not) referencing a
period in design history; if my memory serves, starting with some reasonably
high-concept magazines in the late 1960s.

Same idea, but add thin borders as if you cut the text out of a block of
paper, rotate randomly and slightly, and you're referencing fanzines of nearly
the same era, a little bit later.

Now, distress the text horribly, and make everything bigger like you
photocopied on 'enlarge', and you've got '80s punk.

Now, sharpen filter it all, crisp the whole thing up, stylize the borders and
cut-aways, choosing a font with built-in crispy distressing, add a muted dark
distressed background with a large image pattern (and probably a little pink)
and you've got some sort of 2010-era crispy new proto-punk / ironic nod to
punk design.

All that to say, you still want to have some understanding of the 'rules' of
design, and typography, but they will be nearly worthless to you without some
experience of the mental and emotional connections people make with existing
significant design movements.

Luckily, this experience is pretty easy to get. <http://www.designhistory.org>
seems pretty cool, although I just found it for purposes of writing this
response.

With some of that experience, you will be able to 'parse' design in a
technical way alongside your own artistic sense -- and since you're a
technologist, you'll be able to understand how the changing technology allows
new design looks to spread as well on the web, and that will put you ahead of
95+% of 'designers' on the web. Early web 2.0 was puffy letters, reflections,
and large fonts for forms -- all this enabled by browser changes, and design
needs of the time.

Late web 2.0 looks like we're going to have a lot of rounded boxes, shadows,
and browser-based gradients, since those things are getting easier to do;
whether or not that's what happens, I will be able to assess the online
designs when they come about with some sense of what's come before, and
appreciation for what people are doing now.

On Typography: all this goes for typography as well, one of my pet nerdy
subjects. I really love The Elements of Typographic Style by Bringhurst.
Design's 'rules' are far less codified than typography's rules; despite that,
there continues to be amazing work and amazing font design happening, in fact,
maybe more and more high quality font design. A thorough understanding of
typography is a great joy for anyone who reads, in my opinion. Check it out.
[http://www.amazon.com/Elements-Typographic-Style-Robert-
Brin...](http://www.amazon.com/Elements-Typographic-Style-Robert-
Bringhurst/dp/0881792063/)

p.s. I was thinking about what design group HN falls into in my head while I
wrote this, and I decided "neo-Greenspun". Thoughts anyone?

~~~
davidw
> a lot of rounded boxes, shadows, and browser-based gradients, since those
> things are getting easier to do;

Interesting question: since they're easier to do, more people will do them,
and they won't stand out. So the 'cool kids' will move on to something else?

~~~
vessenes
That's always the way; design definitely evolves for fashion reasons as well
as new technologies / needs.

------
sgoraya
Practice. Try copying designs you like...add your own spin; Get proficient
with design tools (Adobe suite or equivalent).

I also personally use lynda.com - they have great tutorials for all the adobe
programs - also some good general videos about color theory and design
principles.

I also liked this PDF by Massimo Vignelli: <http://www.vignelli.com/canon.pdf>

------
jolosan
Sometimes you need to find a mentor to give you a direction. Additionally,
surround yourself with smart and talented designers.

------
rradu
Find designs you like, then try to imitate them. Look at common elements among
them and implement them into your own design.

------
rajatmehta1
The best way to improve is to practise and to look at the sites that you think
are nicely designed , get inspired but never copy. Some of the best designed
sites that i can think of are 37signals (all there sites are designed simply
but elegantly), zengarden, mint.com

------
niallsmart
My approach was to find some designs I really admired and then recreate them
in Photoshop from the ground up. That's a great way to learn PS itself, but
more importantly in the process of (re-)creation many subtle design choices in
the original are revealed.

------
maushu
You can also read about design and user interfaces, it will not help you
directly in making "pretty interfaces" but it will help you make "interfaces
that just work".

Believe it or not one book that helped me with designing web/desktop
interfaces was a game design book.

~~~
blaix
What book?

~~~
maushu
Game Design: A Practical Approach - [http://www.amazon.com/Game-Design-
Practical-Approach-Develop...](http://www.amazon.com/Game-Design-Practical-
Approach-Development/dp/1584504714) and for more focus on the interface (the
obvious point of this thread): Game Interface Design -
[http://www.amazon.com/Game-Interface-Design-Brent-
Fox/dp/159...](http://www.amazon.com/Game-Interface-Design-Brent-
Fox/dp/1592005934)

Both books teach interesting stuff about designing interfaces and the game
itself that can be translated to software and web, specially the first book.

------
s3b
This is a good set of tutorials to get you started :
[http://www.noupe.com/tutorial/the-ultimate-collection-of-
bri...](http://www.noupe.com/tutorial/the-ultimate-collection-of-brilliant-
web-design-tutorials.html)

~~~
Robin_Message
They are all very Web 2.0-ey, which is fine but it's hard not to make
something look nice when you pull in a lot of pretty visual elements (as long
as you don't overdo it.) I felt as though the OP was more concerned with
layout and how to present information and use columns and so on, especially
since the sample he posted looked pretty enough but was just one long column
of text in sections.

Also the only corporate looking tutorial "Design a Professional Business Web
Layout Use drop-shadows and gradients to create a stylish 3-D look." (about a
third of the way down) looks terrible! Unbalanced, unfinished and instead of
professional just looks deliberately boring and stereotyped.

Having said all that, they are a nice set of tutorials, thanks!

------
bombs
The books suggested by SimpleBits were good for me,
[http://astore.amazon.com/simplebits-20/191-2738847-5476816?_...](http://astore.amazon.com/simplebits-20/191-2738847-5476816?_encoding=UTF8&node=8).

------
nahumfarchi
[http://psd.tutsplus.com/articles/inspiration/teach-
yourself-...](http://psd.tutsplus.com/articles/inspiration/teach-yourself-
graphic-design-a-self-study-course-outline/)

Outlines a self study course.

------
gspyrou
You could try Microsoft .toolbox
<http://www.microsoft.com/design/toolbox/school/default.aspx>

------
ivankirigin
How do I get better at drawing in photoshop or illustrator? I feel like I have
a good aesthetic but a newb grasp of those tools.

------
gibsonf1
Travel the world.

~~~
gibsonf1
This is actually a serious recommendation, and as a building architect, helped
me a great deal in designing in general.

------
noodle
the same way as everyone else.

study and practice.

you might never have the creative drive to be able to make something really
interesting, but you'll be able to understand and apply trends and concepts.
how artistically inclined do you think you have to be to create a nice looking
gradient-based design?

------
jtth
Do it a lot, then talk to people.

------
nnash
If you have a design school nearby take some continuing ed. classes.

------
base
subscribe some design feeds like smashing magazine. Read them a few times a
week and practice, you will get much better in few months.

~~~
l4u
i love smashing magazine too. also try to read some design books, e.g.
Universal Principles of Design, The Non-Designer's Design Book

------
kentf
practice

------
tbrooks
Steal.

------
grandalf
anyone have any thoughts on the best aspect ratio for portraiture?

