Brilliant website inspiration, as well great articles on disrupting the normal design process. Plus web design style guides, and stupid design mistakes. Some great CSS techniques if you are a front end developer, as well as an exciting new virtual whiteboard.
It was great getting the articles together for this week. Some top writers, thoughts and concepts, as well as inspiration. Enjoy this website design and development inspiration rundown!
The past few weeks I have featured several agency websites to show how good design and layout can be simple and elegant. These two sites build on top of this even more!
April Zero is a demo site for showing the information Gyroscope collects on you. The way it displays data, and quite honestly how pretty it is really appealed to me!
A creative studio based in Slovakia. This is one of the most creative sites I have seen in a while. Great use of animated SVGs to tie each section together. A great piece of work.
Designer Resources, Examples and Inspiration
Priority Guides: A Content-First Alternative to Wireframes
Finding a better process for designing websites is a big priority for me. A lot of “Digital Agencies” throw a design together, then add the content into pre-existing boxes. Quite frankly that makes no sense. Why add content that isn’t required? The internet already has enough meaningless drivel. Every message should be considered and have a point.
A List Apart takes us back to designing wireframes, and discusses how there may be a better alternative.
How To Create a Web Design Style Guide
If you are designed a site for a client that is likely to be around for a while, or you are redesigning your own site a style guide is a must. Not only does it allow you to go back to a central place to remind yourself, it stops you redesigning an element that already exists! It also allows third parties and future development teams follow brands guidelines.
10 Small Design Mistakes We Still Make
We will always want the principle “dont make me think” to apply to everything. The goal to each page should be self-evident. The average user should know exactly what is going on.
This article covers 10 mistakes that regularly occur, that stop the user from progressing easily.
Development Snippets, Samples, and Articles
Text editing techniques every Front-End developer should know
This almost didn’t make it onto the list, until I realised it was one of the most helpful articles I have read in a while regarding writing code.
Any Front-end developer is going to spend a lot of time typing and manipulating code. It pays to know how to ‘drive’ your editor to get the best performance. This comes just in time after my post on my new editor setup.
Combining the Powers of SEM and BIO for Improving CSS
SASS and LESS can take your loverly code, and turn it into a mess once complied. It can also make file sizes larger than needed.
SEM and BIO are coding techniques that allow your code to be scale-able, maintainable, and with a simple structure. A great read, and something to really consider.
A bit of everything
Still in development. But god damn this is going to be useful! Think Trello, now think whiteboard. But on the cloud! Currently only on desktop, but so so interesting!
700 Screenshots of Developers’ Websites
Something nice and simple. 700 screenshots of developers websites. Maybe you can get some inspiration? Maybe you are just intrigued?