6

As a programmer, I enjoy embarking on small personal projects and I have a load of open source scripts that I host on github. I am very much a programmer and not a designer. However, it is inevitable that sometimes I am forced to design. These are usually cases where there is no point in paying for a designer, but it would be nice if the page looked good.

Some examples are:

  • Creating personal pages, e.g. blog, showcase
  • Landing pages for my github scripts (gh-pages)
  • Designing personal pages for friends

These are all situations that have come up and I end up creating spaghetti style css sheets.

So... what tools, tips, hints, general advice do you have to offer for us programmers who have little creative imagination?

Improve this question

8 Answers 8

Reset to default
5

There are tons of webdesign blogs out there. I would recommend:

  • Smashing Magazine
  • Webdesigner Depot
  • A List Apart
  • Webdesigner Wall
  • CSS-Tricks

Website design ends up incorporating a wide set of skills: user experience, typography, colour selection, image editing, communication, etc.

I'm in the same boat as you. There's a lot to learn, but it's pretty interesting stuff.

Improve this answer
5
  1. Stumbleupon search - It's my favorite way of finding interesting articles about web design and design techniques. You can search for design lists or just styling techniques and get a wide variety of interesting websites.
  2. CSS Zen Garden / Browsing theme repositories - I like to see what others have done so that I can get an idea of what works and what doesn't. Pick out a few really creative pages, and a few really blegh pages and compare the differences
  3. Copy copy copy - At times I will reproduce professional pages just so that I have practice making a design that I find attractive. When you take the time to fully reproduce someone else's work, you will start noticing the inconsistencies that you wont have noticed before.
  4. Ask an artist - I'm fortunate to have a few friends who are graphics artists, and I regularly ask them to send me any designs that they want prototyped in a web-layout. This gives me the opportunity to work directly with an artist and learn from them, and more practice at design work.
Improve this answer
1

I just started using Balsamiq Mockups for this process. It's a great product I wish I would have found earlier (better late than never). It allows you to think through your layout in a sketch form instead of a code form. Check it out.

Improve this answer
1

I asked a designer friend of mine to help me with things like this recently, and she said that unlike in the olden days, you can just get this stuff off the shelf. The place she sent me to was ThemeForest; I'm sure there are others. Basically, it's a giant catalog of design. For a few bucks you can buy one, complete with HTML, CSS, and images.

Improve this answer
1

Start following some of the design and photoshop blogs - you'll soon find some you like and plenty you don't.

There's some very good ones out there with free photoshop tutorials and some good hints and tips on basics, like selecting colour schemes, fonts, layouts and the like. I'd also recommend following a few blogs on usability - this ties in nicely with design.

The key that got me beyond "typical programmer" style layouts is finding step by step photoshop tutorials to put together example pages. This led to me picking up step by step dozens of little photoshop techniques I'd never have put the time in to find out for myself.

I very much started the same way and having more awareness of those basics has helped me no end. Whilst I'll probably never be an artistic designer I can at least create professional looking clean and usable layouts.

Improve this answer
1

I have go through this issue also and I found:

  • Learn the basics of CSS, also learning CSS Frameworks will help. (examples of good frameworks like: Blue Print)
  • Learn Photoshop, tutorials will be enough to get you along
  • Read a book about a web design to learn how to pick harmonic colors.
  • Watch a lot websites which have a great design and try to take ideas from it.
Improve this answer
1
  • +1, I was going to recommend Blueprint as well, I found out about that from an ASP.NET MVC screencast which highly recommended it for people, like the OP, who are very much programmers and not designers.
    – Carson63000
    Mar 31, 2011 at 20:06
0

There are plenty of blogs on CSS, JQuery that I read if I want to do, e.g. iPhone style locking screen. I see programmes that has cool features and I ask myself, "how did they do it" and try to do the same. That's how I learn.

Improve this answer
0

I concur with all the answers given.

I basically just poured through tons of CSS code and CSS sites. I asked questions on forums as well. The way I became a better designer was by taking a site that I really liked and try to mimic the design on my own site (there had to be a reason for it functionally of course). But through that process that is what helped me the most.

Imitation is the greatest form of flattery.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.