Learn to ‘pretty’ it up!

Learn to ‘pretty’ it up!

1. I am not a Designer.
2. I do not have a Design Degree.
3. My knowledge is limited to what I have read and practiced in the last few months. 
4. This article is for Amateurs like me who are just learning to code and want to make their site pretty.

When Neelesh Mittal asked the question, I had to do a bit of thinking as to how to answer him.

How to create clean & great looking websites?

Beautiful and Perfect are two words which rules my work a lot. So, when I create a website, it is second-nature for me to work on it until it has that clean & beautiful look that I visualize in my mind. Before, I start talking about how you might be able to make your websites pretty, you should read the disclaimer above.

Get the basics right

This will be the first piece of advice every designer will give to people starting with design. You need to understand what is design and learn about the elements and principles of design.

Some links to get you started,
1. Hack Design
2. Code School
3. Design Fundamentals

Design the interface for your users

The websites you create are not for you! Every website is built for a target audience. You need to put on your thinking cap and enter the user’s shoes. Think about every piece of the user interface you create and make design decisions which will make your website easy to use. Your design should focus heavily on providing the best experience for your user. Make it usable first, fun next.

Don’t Make me Think” by Steve Kruger is a very good place to start.

Other links to get you started,
1. UX Myths
2. UX design – Smashing Magazine
3. UI Basics
4. UI Design Fundamentals

Get Inspired

Do the following as often as possible, if not daily.

  1. Browse design galleries like Awwwards, dribble, behance & find out what others are designing.
  2. Stop & Analyze what you like and don’t like about each.
  3. Start noticing design patterns.
  4. Note down patterns & design trends you like.
  5. Use Pinterest to create a moodboards for inspiration.

This way you will get familiar with how other people are designing and eventually be able to do get that line of thinking necessary to integrate design into the functionality of your website.

Some links to get you started,
1. Dribble
2. Awwwards
3. One Page Love
4. Behance

Steal Responsibly

As you find designs you love, start copying the style and practice them on personal projects. Once you start getting comfortable, make your own designs. There are a lot of quality design resources which you could use get up and running very fast.

Some links to get you started,
1. Steal like an artist
2. Don’t Copy a Design, Steal it!
3. Good Designers Copy; Great Designers Steal
4. Be inspired, But don’t copy!

Have your own design process

You need to understand that,

Design is not a layer that you apply to your website.

The website’s functionality should go hand in hand with its appearance and behavior. As you logically plan the functionality and code the site, you should think about how it should look. So, try to find a design process to integrate with your workflow.

It can be as simple as using pen and paper to sketch out mock-ups or it can be very detailed with a researching, moodboarding, sketching, photoshopping and prototyping. I would suggest keeping it simple and experiment until you find what works for you.

Some links to get you started,
1. From idea to product
2. Follow a web design process
3. A simple workflow to design your portfolio
4. My Design Process – James Dalman

Keep up-to-date

This is the important part. You are in the field which evolves every day. What was new yesterday has already been replaced by something new & shiny today. So, it is very important to be in the know. How? Subscribe to magazines & blogs and Follow design professionals.

The following links provide a good compilation of sources to keep you up-to-date.
1. Front End Rescue
2. Web Design Repo

Wrapping up, I have shared what I have learnt and practiced to get myself started with design. You might have noticed that I didn’t mention the part about learning photoshop or illustrator. Only because, I think everyone knows that they need to have a basic know-how of photoshop & illustrator to atleast use the free resources and save it in the web format they need.

As mentioned in the disclaimer, this is in no way the opinion of an expert. So, please feel free to point out anything which doesn’t feel right here or additional pointers and tips from your experience.

Like what you read? Share the love using the links below.