Tumblr collection

Leave a comment

I started a tumblr to collect UI/UX stuff I like and don’t like and think about why I like it and why I don’t and if I don’t how I’d fix it.

Phew

http://heylookspencer.tumblr.com

A bit on infographics

Leave a comment

Now, I don’t mean to be too cynical and I’m not out there to discredit the work of others. I am, however,  a little lost as to terminology in design and publishing these days, perhaps.

I just started using that flipboard app for iPad yesterday and added ‘Good’ to my contents page. Good.is is all about good stuff: “10 Best Foods for Your Looks”, “Is Summer Vacation the Enemy?”, “Videos from London’s Cycle Super Highways” are just a few tweeted headlines from today – and, as you can expect from something a mid-to-late-twenties, semi-trendy, creative professional who just moved into Pacific Heights, San Francisco would subscribe to, it’s packed full of those oh-so-hot infographics, which I assume is short for information graphics.

The confusion I have about said infographics is that (when I was a boy) information graphics were intended to make information easier to understand, or to put information in context (in a way that makes it easier to understand), as opposed to making information simply look nicer on a page.

They’re mostly quite nice to look at, but here are two of them I’d like to re-label from ‘inforgraphic’ to, well, something else:

Good.is - General Motors sales in USA vs. China

Good.is - General Motors sales in USA vs. China

I’d call this one an illustration instead of an infographic. For starters, the title “More GM Cars Sold in China Than America” is a very, very (VERY) clear  piece of information that doesn’t really need clearing up by a visual communication specialist, not to mention the illustration is a little confusing in itself: the cars aren’t aligned on a grid  so it’s actually a little tricky to quickly take in just how many cars are American and how many are Chinese. Each visualized integer (USA:China 1.08:1.20)s take up the same amount of space (visually) and I found myself having to count, to an extent, to see how many cars where on each line.

How would I solve this infographic? Either, I’d arrange the cars on a grid so that there are clearly less American cars, or, I’d use a pie chart breaking down the number of cars sold in China, USA and ‘other’ markets, or even a simple bar chart of the two markets compared… Or I’d just not illustrate the information at all.

To sum it up, I don’t think this piece of information really needs anything visual to make it clearer so maybe a stock image of a GM car would be just fine for the article as that would be less likely to confuse at all.

The other one is this:

Good.is - A Dropout Epidemic

Good.is - A Dropout Epidemic

This is a much more complex set of information than the previous, and there has been some visual elaboration made to make it more interesting than a regular chart spit out of Excel or Numbers. However, this visual embellishment does nothing to clarify the information and is therefore just embellishment. The page is just as daunting as any chart spit out of your favorite spreadsheet software despite the cute pencils and script typefaces, really, look at all of that information! So, I’d class this one as a chart, not a piece of information graphics.

How would I do this one? No idea – I  probably wouldn’t publish it as it doesn’t add a whole lot of detail to the story given there are no hard figures related to each cute pencil bar. Maybe it would have made sense to include a high state and a low state as an illustration to accompany the article, then give a link to a very straight, not illustrative, chart with all of the data figures if that’s what some readers would want to see.

To sum up my opinion on this infographic, I don’t think the design of this chart really does much to make the information it conveys more digestible for the reader.

To conclude, I think…

During the Obama campaign, infographics really took off – charting became ‘hip’, and for a while there was some great information graphics work flying around. That wasn’t the birth of visually interesting – as well as functional – information graphics. Just check out the book ‘A Smile in the Mind‘ and look at the financial reports section – you’ll see some amazing work in there dating back to who-knows-when (my copy is currently in a shipping container so I can’t tell you) and I recall The Guardian started publishing great information graphics after their rebrand/reformat in the early-to-mid 2000’s.

I believe (but am open to suggestion) that infographics are a trend and the term ‘infographic’ doesn’t seem to match up with what I understand to be ‘Information Graphics’ (I almost applied for a degree at LCC specifically in Information Graphics before I was accepted at Central Saint Martins, so that goes to show how much thought can go into ‘infographics’: years of training). They became part of popular culture in the late 2000’s and are still floating around as visual filler to accompany press based on data – whether or not they improve the reader’s understanding of the data.

I personally can’t suggest an alternative. Without these pretty charts and information-inspired illustrations, we’d probably be looking at stock photos or political cartoons – neither of which I have any qualms with.

It’s all much of a muchness, but that’s blogging for you.

If you have some information you’d like visually communicated, get in touch.

Some things I noticed online

1 Comment

These just in:

Weird mix of design styles from Yahoo!, and a new(ish, but growing ever more popular by the day) trend in web design.

Yahoo!’s designers (the ones they hired instead of me? Yeah, just saying.. :-p) seem to have confused this textural background with a highly reflective background on their Yahoo! Mail sign-in page. Looks weird and probably happened out of laziness / pointlessly following trend.

Weird reflection on textured wallpaper

This wrap-around banner thing is pretty popular still. I wonder how long it will last.

In fact, it’s been around since at least October 2009, as this post from James Carlton shows:

Wrap around banners from James Carlton's blog

I totally get it, it looks nice, and adds some depth but I can’t help but think web designers are now adding it because it’s the ‘done thing’. For example – when the CSS3 standards started coming in and suddenly there were rounded corners and drop shadows all over the place.

I also have a thing about “30 free icons for web designers to use on their website” blog posts. If they’re designers, maybe they should design their own icons instead of just dropping something someone else thought up / made into ‘their’ design.

update: tiny wrap-around banners from LinkedIn

LinkedIn banner example

Me and my Mac today

3 Comments

I used a javascript thing I found via Google reader that tracks the movement of your mouse on the screen. I’m not sure what the dots mean. It might be where I have left the cursor.. or maybe it’s clicks? I think it’s a bit of both.

This is a typical (very) lazy day at home on the couch in front of the tv, browsing the internet from time to time. I might leave it running tomorrow to see how it turns out after a day of illustration using my wacom and illustrator. Could be quite different?

My favorite part is the bottom-right, where I have exposé set for ‘all windows’.

*the application that generated this from my mouse movements is called MousePath

TrendyGIFs

Leave a comment

I made this blog to put trendy animated GIFs on.

TrendyGIFs

TrendyGIFs

No touch? What the…?

Leave a comment

So I noticed there’s a lot of stuff about iPhones and touch things on my blog. Well, since I last posted I got a job that isn’t in a pub. Part of this job involved me making this no-touch interactive window thing happen for Orange.

See the ITN News coverage here:

Oh, and the company I work for is here