Ask HN: Getting over the web design wall?

Are you saying PHP is cool today?? ;)

This is a tough issue to get around. I could list some ways to get better a web design but it's probably a waste of your time to try it. Like with programming, a good eye for design comes with a lot of practice.

There was a post the other day about how someone used crowd sourcing sites to create a decent design, perhaps you could look into something like that.

Otherwise, on a very low budget you might just use freely available templates. Once the site starts paying it's own rent, then you could start looking into hiring someone to create a more unique / branded design.

Accept that you suck at design and start copying. Find sites that you like, and recreate the elements that catch your eye. If your experience is anything like mine, you will wind up with a look that's worse than what you're borrowing from, but it will be better than what you would have done on your own. In the process you get to see why things look good or bad. Note that I don't mean snagging CSS and images, I mean actually recreating the elements from scratch.

Do that lots of times, and eventually you go from sucky to decent. Not sure how to get from decent to good.

Once you have a good grasp of the fundamentals of design theory (golden ratio, rule of thirds, color theory) it's really easy to adapt to different trends as you see fit to what you're working on. I agree with what some of the other guys suggested here, a quick way is to just copy what other sites are doing instead of trying to invent something yourself.

By copying, i don't mean a verbatim clone of other website's visuals. Look deeper into how a site is laid out, where certain elements are positioned, and try to figure out why the designers visualized the content the way they did.

All this would be assuming that you have a good understanding of photoshop/illustrator. If you don't feel comfortable using photoshop. I'd suggest you to either spend some time to pick it up (sites like tutplus have some basic tutorials that are pretty easy to follow http://psd.tutsplus.com/category/tutorials/interface-tutoria...), or you can just buy a prefab theme from themeforest like pius11 suggested.

In any case, my specific advice for dealing with web page design is to 'outsource' it. Build your sites in a themeable CMS and just play with themes. It sounds like you can tell a good looking design from bad, so just spend the time trying different looks, and something will come out in the end.

That said if you do insist on being the fully rounded person and doing all aspects of the project (which I often find myself doing :-) I would second the advice given here to simply borrow design elements from sites that you like (90% of 'design' is simply this anyway, with a relatively small number of people putting actual design principles to use and even even smaller number of thought leaders doing interesting and innovative design work). This should give you a start on getting something that looks somewhat decent, and give you time to think about how far down the design rabbit hole you wish to dive so that you will at least start to understand the underpinnings and theory of the things you had been cargo-culting.

Design is not how something looks - it's how it works. Think like an end-user and step back from the myopic view most developers have of their own applications. Ask yourself questions like "Is it obvious what to do here? Does the UI help me achieve my goals or hinder it?" The actual visual representation is only one part of achieving these goals. Remove redundant, confusing or cluttered elements on screen. In good design every pixel pulls it's own weight and white-space is used judiciously. Perfection is achieved when nothing more can be removed.

Pay attention to color schemes - there are plenty of sites now which will help you pick a nice color palette. Pick colors which work well together and are readable. Colors convey a message.

Don't ignore typography either. Googling will give you good suggestions for fonts which work well together and carry certain types of messages and associations. Don't use too many fonts on page. Vertical rhythym and letter/line spacing can make a big difference to a sites appearance.

Something I do before starting sites is to make a proof sheet - sample content of the basic types of tags, elements and markup you will encounter, and a CSS stylesheet defining the appearance of these elements. This may help you visualise the site a little better and will keep you consistent as you build it out.

I'd put most of your effort there.

Have a look at sites like Pinboard or Instapaper for good examples of simple type based design.

Sites don't have to be flashy to be successful.

If you aren't feeling very creative, duplicate the work of others. Heck, even if you are feeling creative, duplicate anyway. Try to copy the iTunes interface. Figure out exactly what methods and techniques are used to design certain buttons. Then move on to other parts of the interface. You'll learn about subtle gradient use, shadows, insets, opacities, font, color palettes, and more. Before you know it, you'll have duplicated the entire iTunes interface and picked up a huge skillset along the way.

Then do the same with the most beautiful websites you can find. And the whole time, tell yourself it's not impossible to design that beautiful website because somebody already did it. If you get stuck, google the specific problem. Somebody was in your place before. The only way to really learn design (or anything, arguably) is by doing. When I browse the internet, I subconsciously examine every single piece of the design and figure out how they did what they did. For most websites it doesn't take more than a few seconds because they're remarkably simple once you know a little bit about design. For those tricky ones, I look a little closer and can figure it out within a minute or two, sometimes resorting to opening the source and looking at how the images are sliced up. If something's really busting my brain, I'll fire up Illustrator and give it my best shot.

Eventually you'll figure out what works for you and what doesn't. You'll gravitate towards certain techniques and ditch others. If you're smart, you'll even end up with a "graveyard file" containing all the little pieces that you might be able to use in future designs. With that graveyard file, designing gets exponentially easier - it's like having a box of magical tools at your fingertips.

But I have realized that the time I spend on trying to find out how to completely code what I need will take far too long and should be complimented by someone who eats and sleeps development.

So sir my point is maybe instead of trying to learn a whole new profession it would be wise to partner up or even outsource that part of it.

And if you need it done for free try bartering your dev skills for design skills.