Weblog

(ux + ui + product) * (design + hacking)

Which fish?

4 July 2011 · project · environment · fish · food

My friend and partner in crime, DRMaciver, pointed me to David McCandless & Derek Guo’s shocking visualisation of Atlantic fish stocks in the Guardian. I’d been vaguely concerned about our fish-eating habits. I happen to love fish but the murmurs about the state of fishing has been making me increasingly uneasy, fuelled by documentaries like Shark Water and Blue Planet. But I find it very hard to make a decision about what’s okay to eat. I simply can’t keep the information in my head.

An IRC buddy of mine, Zarkonnen, had a similar problem and turned the Guardian’s data list into HTML and JSON. I pulled in his JSON and turned it into a mobile-friendly, home-screenable list. Nothing fancy but I’ve been using it for the last few days and have found it genuinely useful already.

So, here it is: Which Fish?

I’ve been getting very into personal instrumentation recently, tracking energy expenditure via a Fitbit, weight via some Withings scales, mood via Mappiness,  movies, gigs and books via my very own @oo5 project. I started noting all this stuff  out of curiosity; I didn’t have any concrete plans for the data. There were vague thoughts of some kind of visualisation to help me find correlations between my habits and my general wellbeing. I ran across an anecdote from the Evernote CEO, related by Tim Ferriss, which got me thinking though. This chap had been trying to lose weight for years. He’d tried every fad diet under the sun but while the weight shifted, it always came back. The single most important thing in his road to a leaner, meaner self was simply to weigh himself every day and let his subconscious do the rest.

Since reading that I’ve noticed something about my behaviour as it relates to what I do, where and when. My Fitbit makes me think twice about getting the bus all the way to work; my Withings scales influence my lunch destination; @oo5  (with the help of my Kindle) effects whether I browse the internet, catch up on Instapaper or read a proper book. The simple act of measuring things has changed my behaviour. 

When you can measure what you are speaking about, and express it in numbers, you know something about it; but when you cannot measure it, when you cannot express it in numbers, your knowledge is of a meager and unsatisfactory kind; it may be the beginning of knowledge, but you have scarcely in your thoughts advanced to the stage of science.

Lord Kelvin in 1884

Curious, I wanted to try measuring some things I wanted to change. I tried using the very beautiful Daytum but it was just a touch too slow to inject into my daily routine. After a bit of a think I decided to make a simple iPhone-installable counter, that could be launched fast, used quickly, and forgotten about. So on the way back from SXSW I hacked together  TallyHo. You can create counters for anything you like, add them to your home screen, and away you go. I’m tracking a whole bunch of things, including cups of coffee, which I should drink less of,  glasses of water, which I should drink more of, and plastic bags, which I want to use less of. 

The main focus is on what you’ve done today. There’s a big number in the middle of the screen telling you how you’re doing. Underneath is the medium term view - how you’re doing this week, and the long term view - how you’re doing overall.

I released TallyHo quietly a while back and uptake has been surprising. Somewhere over 1200 items have been counted to date, with tallies including:

  • Cigarettes
  • Coffees
  • Beers
  • Teas
  • Indigestion
  • Bars of chocolate
  • Bags of crisps

At the moment the data gets synced to my server and there’s an option to claim your tally by signing into Twitter, so you will be able to retrieve your data should anything happen to your phone. I might add a sync to Daytum too, to benefit from their lovely visualisations. In the meantime, drop me a line if there’s anything you’d like to see TallyHo do. I’d also love to hear from you if it’s helped you change something (anything!) about yourself.

Web Designer Depot have published my predictions for 2011 alongside a bunch of my favourite designers. Here’s what I had to say, with bonus hyper-linky goodness.

If 2010 was the year that mobile came of age then 2011 will see it move into its own apartment next door to the desktop and start throwing wild parties. Having started as the younger, slightly neglected sibling it’s now on the verge of shouldering the desktop out of the way.

The industry (as articulated by Fred Wilson of Union Square Ventures) is coming around to the idea that mobile could often be the primary platform for new apps. As web developers and designers we are in a great position to take advantage of this shift through infrastructure enhancements like HTML5 and Phone Gap, and frameworks like jQuery Mobile, Zepto and Backbone, along with a horde of others.

All of these are based on technologies we already know and can start working with today. Rather than clumsily reskinning our websites, 2011 will be the year we embrace the philosophy of mobile to produce context aware, task tailored, fundamentally handheld apps.

This time last year I had just arrived in Belize. I was standing on the beach in Placencia, on the world’s narrowest high street, with my brother and friend Brett. Our ferry had been cancelled and we’d spent the whole day working our way from Honduras up the coast by truck, boat, bus and lancha.

With the New Year just gone I thought it might be nice to reminisce so I build a little hack project to help me mine the hundreds of memories that my Flickr stream contains. It’s super basic at the moment but I thought I’d put it live anyway. So. Introducing:

This time last year - Flickr reminiscence

It’s really intended for use on my iPhone but I’ll add a desktop format at some point.

While I was in Central America over New Year I found myself trying to place the Maya, the Olmec and the Aztecs into the timeline of world history. I don’t think I’ve ever seen them in context before - everything I’ve read deals with a single empire, civilisation or region. So I decided to draw a graph to find out. The result is Rise & Fall: The Historical Trajectory of Power & Politics.

Setting about Wikipedia with random abandon, looking up dates and following links I have creating an editorial list of the things I think are noteworthy. I’ve played it fast and loose with dates and inclusions. Broadly speaking: early entries are cultures; late ones are empires. There’s a fine line between them, when there’s any line at all. Cultures tended to be subsumed so their “end” is debatable; empires were conquered but have a tendency to decline so their end is also in question. What I’m trying to say is that this chart is just my interpretation. If you want to know more, have a read. If you decide I’ve made a mistake, drop me an email.

Out of curiosity I also decided to try to give some indication of the cultural legacy of the world’s powers. As a rough yardstick I’m using the number of Google search results for the quoted search “name culture”. This is skewed towards those whose names have continued - Chinese and Egyptian, for example - and against those who have died out - like the Mauryan and Bagan - but it’s an interesting measure.

A couple of features I like:

The straight line marking the end of the Phoenician, Kushite, Greek and Persian empires as the Romans rise.

The big gap between the Romans and the Spanish - the Dark Ages - while Asia and the Middle East flourish.

The Maurya, apparently a golden age for the Indian subcontinent, fading from Western memory and the chart.

Enjoy!

Rise & Fall: The Historical Trajectory of Power & Politics.

Over the last week or so I’ve started pushing a little thought tool/influence experiment I’ve set up called Elect or not? I’m trying to gently nudge people into thinking about why they vote for who they vote for while hopefully gathering some data on the halo effect while I’m at it. I’ll write more about the science behind it when I get some more time.

Out of curiosity I just crunched the numbers for the results I’ve had so far and thought I’d share… Bear in mind that this is people saying who’d they vote for based on looks alone, without knowing who the candidate is, who they represent or what their policies might be…

  • 32% Conservative
  • 25% Labour
  • 24% Liberal Democrat

Compare these results to some of the proper polls… 

YouGov (2010-04-28):

  • 34% Conservative
  • 27% Labour
  • 31% Liberal Democrat

ComRes (2010-04-27):

  • 36% Conservative
  • 29% Labour
  • 26% Liberal Democrat

ICM (2010-04-25):

  • 33% Conservatives
  • 28% Labour
  • 30% Liberal Democrats

Tweetminister (experimental):

  • 35% Conservative
  • 30% Labour
  • 26% Liberal Democrat

It’s a little bit scary but my numbers don’t seem too far removed from these far more sensible and official polls… See the data for yourself on the Elect or not? Parliament page.

Some Sass tools on Github

7 April 2010 · sass · github · project · css · me

On a whim, and after an off-hand suggestion from Stef, I decided to pop some of my most-used Sass mixins - the ones that I include in every new project - up on Github. There’s nothing too ground-breaking here: a straight port of Eric Meyer’s reset.css, and a few CSS3 expanders.

The CSS3 expanders are probably the most interesting. I was getting irritated with having to type and retype certain of the new rules over and over again with the now ubiquitous -moz and -webkit prefixes. So I bundled them into mixins. Mixins are Sass’ way of adding very simple scripting to your stylesheets. Let me give you an example.

This Sass snippet:

div
  width: 500px
  height: 300px
  +box-shadow(#000, 0px, 3px, 5px)

Gets rendered as:

div {
  width: 500px;
  height: 300px;
  box-shadow: #000 0px 3px 5px
  -webkit-box-shadow: #000 0px 3px 5px
}

Dead simple. I’ve wrapped up border-radius, box-shadow, gradient and box-sizing. Interested? Grab the files from Github.

To get my 4oD Boxee app working I first had to convert Channel 4’s YouTube feeds into Boxee’s format. I’ve gone with the simplest thing I possibly could - just including the bare essentials - but it serves my purpose so maybe it’ll be of some use to someone else.

In a nutshell: you pass it a YouTube username, it gives you back a Boxee RSS feed. Done.

Here are some examples:

4oD on Boxee

25 February 2010 · announcement

These days almost all my TV viewing has moved online. After much frustration I settled on Boxee as my home entertainment center of choice, running on a Mac Mini sitting on my shelf. It started quite rough but it’s been constantly improving and the new version is great. My favourite thing about Boxee is the iPlayer though. It puts almost all of my favourite TV content on Boxee. Almost all.

What’s been missing is 4oD, Channel 4’s IPTV service. Channel 4’s documentaries, in particular, are fantastic. Unfortunately when 4oD launched it was PC only. Last year they finally opened it up to Mac users but it was still limited to the browser, which is awkward to use from my sofa without a mouse. Awkward to the point of being unusable.

A few months ago, while waiting to be served at a pub in Soho, I overheard a man in a suit telling his colleague that Channel 4 were moving all their content over to YouTube. That sounded very exciting. Leaving aside the implications for the entertainment industry this meant that 4oD would have feeds.

Last week I happened across YouTube’s 4oD feeds and thought I’d try hacking a quick Boxee app together - mostly for my own benefit. Working with Boxee’s UI XML isn’t the easiest thing in the world but after a lot of reading, poking, twiddling and cursing I finally got something functioning. It’s very much alpha. Maybe even pre-alpha. But if you want to try it out here are the instructions:

  • Launch Boxee.
  • Go to “apps”.
  • Down the left, right at the bottom under “extras”, is “repositories”.
  • In there is an option to “add repository”.
  • Hit that and enter “boxee.donotremove.co.uk”.
  • That should get you “Mike’s Boxee repo” and in there is “4OD”.
  • Hit that and go “add to my apps”.
  • Start it.

The UI is limited, to say the least. 4oD channels are down the left; shows are down the right. Pressing right loads the show from the channel you have selected; left goes back to the channels. My biggest niggle at the moment is that loading channel content is a bit laggy. Let me know how it goes though! I’ll make improvements as I find the time and as I learn more about making Boxee apps. Or maybe Channel 4 have their own app in the works… We can hope!

You Might Not Know is a place to share those little tips you’ve picked along this road called Life. These tips can be able absolutely anything. If you think they’re useful then someone else will too. Or that’s what we think, anyway.

David and myself have been busy working on the prototype for a while now and after much procrastinating we’ve finally decided it’s safe to tell people about it.

I’m rather proud of how simple it is at the moment - mostly thanks to some cunning ideas from David. Adding a tip takes moments and I’m finding it rather compulsive. We’d like to be to Knol what Tumblr is to Wordpress.

We have a hundred things on the todo list but at this point we’d just love to see a few people playing with You Might Not Know. Let me know what you think!

Page 1 of 44

Getting around