7 Web Design Inspirations & Development Resources

If you’re a visual artist, cartoonist, graphic designer, web designer or any other form of “old school” or digital artist, we all have one definite thing in common – we are all creative – regardless of whether or not you’re a “pencil to paper” or “tablet to screen” person.

I am primarily a web designer, which tends to naturally go hand-in-hand with doing graphic design – which I do also. So below is a selection of some of my favourite graphic and web design inspiration and development resources that I like to go to when looking for some inspiration or a hand with a particular web project that I may be working on.

1. Smashing Magazine – A great web design inspiration resource!

Web Design Inspiration - Smashing Magazine - For Professional Web Designers and Developers

Smashing Magazine is probably one of the most recognisable and talked about websites in the web industry when it comes to design and coding. It’s also a great website to visit for graphics and WordPress related topics.


2. Web Appers

Web Design Inspiration - WebAppers - Best Open Source Resources for Web Developers

I’ve been using the Web Appers website for a long time now, and it has served me well, time and time again, with very handy plugins and web apps for some of my web projects. The website is driven by an enthusiastic community who help contribute to the value of this great website.


3. CSS-Tricks

Web Design Inspiration - CSS-Tricks

I’ve been a follower and fan of the CSS-Tricks website and community for a number of years now. I always find interesting articles to read and videos to watch, and sometimes handy snippets of code to use in some of my projects.


4. The Noun Project

Web Design Inspiration - The Noun Project

I can’t remember how I stumbled across this website, but it would have to be my favourite website for sourcing icons for my logo and design projects. I love the simplicity of the icons on The Noun Project website. They’re very versatile and can be used across almost any medium, especially because of the SVG file format that all the icons come in. You do however need a program that can open SVG files, like Adobe Illustrator.


5. Icon Finder

Web Design Inspiration - Iconfinder - Icon Search Engine

Icon Finder is a bit like The Noun Project website, where it is also a website that contains a huge library of icons for commercial and free use. I find Icon Finder very handy depending on the requirements of a project that I may be working on.


6. Bootstrap Cheat Sheet

Web Development Inspiration - Bootstrap Cheat Sheet

Here is an awesome Bootstrap Cheatsheet that’s simple, to the point, and most importantly, it will save any bootstrap developer a ton of time because all the essential aspects (components, source code elements, screen sizes etc) are listed in one free to download PDF. This value-packed cheatsheet comes courtesy of Nick from over at WebsiteSetup, so be sure go and check out all the other great stuff he has!


7. CSS3 Generator

Web Design Inspiration - CSS3 Generator

When I need to write some basic CSS3 code in a hurry, the CSS3 Generator is a life saver! It provides you with the ability to generate CSS3 code by clicking a few buttons and entering a few parameters, and presto! It shows you a preview of what the code does and with a button that you click to copy the code so that you can paste it wherever you need it to go. Then if you also understand the CSS3 code, you can also use it like a template to write your own CSS3 without the generator.


Share your thoughts or Web Design Inspirations & Development Resources

I hope you find some of these resources useful too. Please leave a comment if you like to use any of these as well, or if you have any other resources that you’d like to recommend.

8 Responses

  1. Photography is an essential part of web design and can help capture the essence a website aims to portray without too much design work.

    I cast a line out and found a couple of great ways to find stock photography that is either free or under creative commons licences.

    Visit sxc.hu for a mass of free stock photography and digital designs.

    Visit http://search.creativecommons.org/ for a great way to find those free images on flickr and google.

    We should all help to build these free stock photography libraries, help fellow web developers and designers out. I recommend getting a flickr account and submitting photos of anything, putting them under the “cc” license. Easy to do with the iPhone too.

    1. Thanks Brodie for your insight there on photography and free stock imagery.

      I’ve heard of sxc.hu but hadn’t really thought much of it before actually, so thanks for sharing.

      And I couldn’t agree more: the more we all help contribute to free stock libraries out there, the easier it should be for people wanting to search the web to find free quality photos that they can use.

  2. Pingback: worktrainweblog
    1. That’s exactly right William. Thanks for sharing that.

      I didn’t mention this in the blog post, but another website that I like to visit frequently is Michael Locke’s website along with his portfolio, which are full of informative information and a great showcase of the UI/UX work that he’s done. It’s all very inspirational, as I’m quite passionate about UI/UX design.

      One of the things I enjoy most about his blog posts is his Friday Favorites that he likes to share. They’re always an example of “perfection” when it comes to UI/UX design – Michael truly has an eye for detail.

  3. Nice list of resources, but how about adding a time tracking or Online timesheet resource to this list? Since I believe time tracking is an important task, I think its a must in this list.

Leave a Reply

Your email address will not be published. Required fields are marked *