Blog

This blog showcases educational and inspirational content related to art, design, process, and more.

Some design trend data

Great post and data deconstruction. Best viewed from Source

It took a surprisingly long time and about fifteen million get requests to scrape meta data for every upload (as of the end of August ‘13) on Dribbble, the popular design community. I ended up lopping off the first half-year-or-so of activity on the site as the community was growing in fits and spurts and the data were inconsistent and basically all over the place. In sum, my little Heroku-deployed Go app collected information about 638,271 uploads and 3,479,698 taggings, and stored it all in a PostgreSQL database.1

Fig. A: CLICK HERE TO VIEW

In the interest of being a good internet citizen, I rate-limited the hell out of it. Strangely, the scraper looped through the full range of unique upload IDs about a dozen times, and it seemed to pick up a few more uploads each run (albeit only a handful the final time through), which would indicate there was some kind of silent failure occurring. If these numbers seem off or my method seems flawed, I’m interested in hearing about it.

I’ve included the taggings-per-upload ratio in Fig. A to add meaning to the trend data that follows. Since 2010, the average Dribbble upload went from having less than 4 tags to over 6, so an increase in incidence of a particular tag could indicate nothing more than users’ increasingly prolific tagging (i.e. a change in Dribbble usage behaviour, not a trend in web design). I considered normalising the later spark-lines against that increase, but my eyeballing of the data suggests that the increase in tagging coincides with an increase in tags (the size of the tag set increased). There might be a clever way to properly normalise the data to diminish the change in Dribbbler usage and highlight actual data but until I figure that out or somebody emails it to me, be aware you’re looking through a glass darkly.2

The rise of ‘flat design’

Dark glass or not, there are a few striking vistas. The most spectacular is the rise of flat design. The community’s usage of the ‘flat’ tag was a rounding-error above zero until the late autumn of 2012 when it began a rapid ascent. (It’s probably not worth noting that Scott Forstall departed Apple on 29 October 2012 — but you don’t need to be Tim Cook to know which way the wind blows.)

Fig. B: Rise of ‘flat’ on Dribbble,  CLICK HERE TO VIEW

In August of 2013, more than one in every ten Dribbble uploads was tagged ‘flat’. But Fig. Bcharts two trends, really. One is the rise in a style of visual design that’s been called flat, which is typified by a lack of texture, gradient, drop shadow. And the other trend is the propagation of the term ‘flat’ to describe this style of design. Charting related stylistic tags (‘minimal’, ‘simple’, ‘metro’) suggests a trend that’s no less obvious, but perhaps a little less dramatic.

If the conversation within the software design community over the past year is any indication, we might expect the trend in Fig. B to be mirrored by a precipitous decline in the use of skeuomorphism. Of course the word skeuomorphism was really only introduced as a shibboleth among the proponents of so-called ‘flat design’, as a pejorative description of an outmoded look.

Fig. C: ‘Skeumorphism’ on Dribbble,  CLICK HERE TO VIEW

The word ‘skeuomorphism’ was first used as a tag in June of 2011 by Eugene Cheporov (and ‘skeuomorphic’ predated ‘skeuomorphism’ by a couple of months: Joshua Blankenship tagged an upload with itin September of that year). Its use since then has been extremely seldom (peaking in January 2013 with a meagre fourteen taggings out of more than 20,000 uploads), and often self-conscious (the first upload tagged ‘skeuomorphic’ was titled Because there aren’t enough skeuomorphic shots on Dribbble…).

Fig. D: Google Trends,  CLICK HERE TO VIEW

But uploads of the style that came to be pejoratively called ‘skeuomorphism’ were far more prevalent far earlier. Take a look through some Dribbble uploads from 2011: there’s a lot of carefully stitched upholstery, glossy leather, and slickly rendered machinery.3 So I tried to find some related tags to use as a proxy. ‘Noise’ and ‘texture’ both overlap with the style that I would call ‘skeuomorphic’ (not in its proper sense, but the gaudy, drop-shadow-y style it’s come to mean). They also constitute trends of their own (and even overlap with ‘flat’ more than never), so, as ever, it’s a dark glass.

Fig. E: Mobile computing platforms on Dribbble,  CLICK HERE TO VIEW

It is, I am sure, an extremely significant indicator of the developer ecosystems of the major mobile computing platforms of the moment that iOS is about ten times as popular as Android within the Dribbble design community. In Android’s best month, about one in a hundred uploads were so tagged; in iOS’s, about one in ten. And woe betide Windows Phone, for which there isn’t even enough data to mock.

Read from this what you will; I don’t have the heart for it. But the data is pretty definitive: iOS has the critical mass of designer mind-share.

The reason I began this little-big-data adventure was because I had a hunch we’d seeMark Simonson’s Proxima Nova suffer a dramatic decline in usage the moment Hoefler Frere-Jones made available for web-use the typeface for which Proxima so often has been called to mimic, Tobias Frere-Jones’s Gotham. I thought a) the entire project would be reasonably quick; b) it’d make a very satisfying graph; c) glory. Proxima Nova’s use on the web has often struck me as we-want-a-web-font-but-also-want-Gotham. I admit I’ve done the very same once or twice. It’s a poor imitation, but bold and in caps, it ticks a lot of the same boxes.

Fig. F: Sans-serifs on Dribbble,  CLICK HERE TO VIEW

Of course: the data are too subtle for my ham-fisted brain. Gotham’s usage since 2010 is basically in decline. I suppose it’s probably in decline since 4th November 2008. And, again, its decline here is not necessarily meaningful: this may be highlighting changes in the Dribbble community, changes in Dribbble usage patterns, or actual changes in the typeface’s relative popularity. And Proxima Nova does follow the sort of trend we might have expected. It rises, presumably roughly with Typekit’s own usage, and then tapers off much like Gotham, whose coat-tails it supposedly rides.

I’ve included a few other popular sans-serifs to round out the picture. Poor Helvetica, presumably in decline since its Hustwit-driven revival in 2007. Myriad gets surprisingly little attention on Dribbble, considering how much real-world usage it sees. That humanist Open Sans looks like it’s on the way up. There isn’t much data yet, but I imagine in another couple of years we’ll be able to chart it satisfyingly against Freight Sans and extrapolate some far-fetched conclusions about their respective platforms (Typekit vs Google Fonts).

Fig. G: Serifs on Dribbble,  CLICK HERE TO VIEW

My attempt to reproduceFig. F but for serif type families was a complete failure. Fig. G demonstrates just how unsatisfying the data are in this regard. Is serif usage more fragmented? Or less exciting to tag? I suppose people have been (this is just my own hunch, not based on any formal data) using serifs for text and sans-serifs for display type, and Dribbble tends to highlight display text more than nicely typeset paragraphs. Nevertheless, it’s curious.

Pardon our progress

This data took far too long to collect, and far too long to (very amateurishly) analyse. There’s a lot to be improved about the analysis, most of which I’ve mentioned as it’s come up above. Dribbble itself is a limited sample, and the data I’ve collected isn’t normalised against changes in Dribbble’s community or usage patterns. Similarly, I’ve collected all tags on all uploads to Dribbble. It might make more sense to limit our data to uploads or uploaders that have a modicum of credibility (i.e. somehow incorporate the ‘like’ or ‘follower’ counts), or even somehow weigh data-points correspondingly. It might be interesting to chart the spread of tags across the community. (Do tags begin in the periphery and spread inward, or do they begin with the dribbblerati and spread outward?) And finally: is there any way to address the fact that Dribbble uploaders don’t consistently tag in a useful or elucidatory way?

Fig. H: Big (American) holidays on Dribbble,  CLICK HERE TO VIEW

I can nowise claim any kind of even passing statistical know-how, so I’ve uploaded a ~70mb CSV to Github. Please do fork, analyse, graph, chart, blog, correct, augment.4 That beautiful and meaningful chart I was fantasising about (with the rise of ‘flat’, decline of ‘skeuomorphism’, resurgence of ‘Gotham’, and short-lived reign of ‘Proxima Nova’) didn’t quite materialise. But I’m reasonably happy with Fig. H.

Source