Flickr web design inspiration
For anyone who's interested, I keep an ongoing Flickr inspiration stream of websites I've found that, for one reason or another, I've found inspiring. You can find it here: Flickr inspiration.
Divvy for OSX, and great HTML5 readiness chart
If you've ever spent about 15 minutes resizing and positioning windows in OSX so that you can get the optimal screen set up for the next several hours of your working day ... then it's time to automate it all with Divvy - this great little app for only $14 allows you to select a working window and then quickly assign it to a position and area of screenspace. Okay, no, I'm not explaining it very well, but they have a video on their website which explains it all nicely. Well worth the $14.
And then, this handy little interface which shows you which browsers support which features of HTML5 - which is a great little resource (the website, not HTML5). We can start building with this now - we really can - we just need to provide an alternative for those more 'challenged' browsers. Ahem.
Google's font API
A crazy amount of font related good news this morning ... Typekit and Google announce their open source collaboration which is hugely exciting - and then, Typekit are supporting Google's open source font collection to make switching between the services super easy.
Embedding the new google open source fonts is as easy as adding two lines of code ... it's that simple. And as Typekit say:
Using real fonts on the web is no longer something to look forward to – the technology is ready, the industry has responded, and designers are building sites with them every day.
Great stuff. Expect to see a slew of websites sporting Tangerine within days ...
Photoshop - content aware fill
I don't really use photoshop - I'm much more of a Fireworks man (everything's a vector people. Everything!) but this is the sort of thing that I would love to be able to do in Fireworks. The 'content aware fill' option allows you to remove stuff that you'd normally fiddle around with for ages, really simply. At around 2mins 42secs of this video, prepare to be amazed as the tree in the photo just disappears:
CannyBill redesign by Andy Clarke
Andy Clarke is one of those web designers who lets it all hang out ... in the nicest possible way. He often blogs about the process of his projects, which is always entertaining and informative ... and here he wraps up his series of articles about the Canny Bill redesign.
Nice work.
CNN redesign goes up to 11 ...
Tooling around with some background images used in the new CNN redesign - which is lovely - I noticed that they've upped their basic screen width to 990px.
This is reasonably significant ... their user base is broad and the range of screen resolutions that they would have to cater for, you would think, would be equally broad.
What they're saying here is that smaller resolutions now make up an insignificant enough percentage of their readership to justify the new width (it's a fixed width site). So, we're slowly edging up ... I know that woot redesigned to 1024 earlier in the year, but I think that with CNN we're really seeing the main streaming of wider sites.
Interested to see how the new site looks on the iPhone.
Michael Beirut's Design Secrets ...
Michael Beirut is about as close as it gets in Graphic Design to being a 'thought leader' / 'guru' (delete as appropriate).
Over many, many years in design he has kept 86 notebooks ... in the video below he picks out 5 case studies from these books and follows them from conception to completion.
It's about as unmissable as these things get:
Font or Typeface?
I confess: I'm not a font hound.
I know enough about fonts to understand what works and why - particularly on the web, but I wouldn't be able to recite all the different variations of Helvetica Neue, for instance (like some people I know ...).
One of the most basic things to understand about fonts / type is the difference between a Font and a Typeface ... it's the sort of thing that snobby designers can use to make you feel silly. BUT - no more ... thanks to a great article that neatly sums up the differences for you (and me).
A couple of examples:
Font is what you use ... typeface is what you see.
- Norbert Florendo
And this one - my favourite:
The way I relate the difference between typeface and font to my students is by comparing them to songs and MP3's, respectively (or songs and CDs if you prefer a physical metaphor)
- Nick Sherman.
Good stuff - do read the full article.
The wonder of wireframes
I've been trying to get better at the process of wireframing ...
It's such an essential part of my job now but it's also a process that I'm constantly tweaking. Initially, my wireframes were really just designs that had had colouring / shading removed - but as I spend more time with the process and appreciate the benefits that a solid wireframe offer you down the line in your development, they have become much more of a living object that is used for testing the base model of the site before any serious money is spent by the client.
Now, I use wireframing to thoroughly test not just what layouts work best, but also to shape processes, to visualise user flows, and to organise content throughout the site. It's now a 'must have' process for me.
Below are a collection of articles / videos that I found useful initially, as well as a couple of useful ones published in the last couple of months or so.
- Wire Frame Your Site - article from site point that was a great jumping off point
- Wireframing with Patterns - first part of article focuses on a workshop - scroll down for more 'how to' stuff
- The importance of wireframes - and some tools to use in creating them
- The 7 Wonders of Wireframes - Paul Boag is incapable of writing anything less than crucial
- Wireframes Magazine - predictably, a magazine for wireframes. Good reading
- I Love Wireframes - Tumblelog of wireframe examples
Web Design Wisdom from Twitter
Paul Boag has put together a nice little article on Web Design Wisdom from Twitter ... my favourite of the bunch:
You don't get paid for the hours you work, but for the years learning your skills and craft
Oh, okay, if I'm pushed, I like this one too:
WordPress is not the solution to everything.
… substitute 'wordpress' for 'Any CMS you like' ...
How to work with a professional designer
Does exactly what it says on the tin ... this article on how to work with a professional designer is useful for clients (and designers) who are unsure on how to proceed with the client / designer relationship.
view notes from CSS, design, graphic design, miscellaneous, web development, work, or the ever popular 'miscellaneous' section.
click here to go back to the main notes section.
RSS
Grab the RSS feed for this blog by clicking the friendly icon below:
Archive
View notes from the last 30 days, last 3 months, last 6 months, dawn of time, or, within CSS, design, graphic design, miscellaneous, web development, work, or the ever popular 'miscellaneous' section