I’ve always had a bit of a problem with responsive design. It too easy to assume the most important context is the size of the screen, too easy to fall into the habit that the way you build a mobile version of a service is to change the presentation layer - just shuffle the same content about the page in a different order and hide a couple of things *.
To make things worse, the term ‘mobile-first’ is often understood by non-developers as “we designed this product for a mobile first!” rather than “we use the mobile CSS as the base and build up from there”.
Websites that work on a mobile are not the same as websites designed for a mobile context. Resizing a browser to make sure it looks OK is probably not good enough any more:
Some tasks are just better suited to mobile/touch or desktop/keyboard - maybe the desktop and mobile version of the service are fundamentally different propositions? It’s worth taking a look at what Evernote have done as a result of understanding the context of how the mobile (app), desktop web and desktop app versions of their product are used. The GOV.UK performance platform team are also exploring this, by making the big screen view of data fundamentally different. Knowing when to build one product or multiple products is going to become increasingly important (I think).
A web page + javascript on a smartphone can now, among many other things, vibrate, respond to changes in ambient light and proximity, things that are just more useful on a phone than on other devices and open new possibilities. Every page is a potential app.
The design language for mobile software is diverging from that of bigger screen software (remember in the late 90’s early 2000’s when lots of websites looked like desktop software with loads of dropdowns and side menus?). So long as all mobile web apps look like mini-me versions of the desktop browser one (it is hard to find many that do not), they are at risk of being beaten by native apps. Users just are going to start expecting better.
Mobile phones and tablets, with touch as the interface, are set to become the default way people consume the web so we better make sure the mobile web is as good as native apps, or there’s a good chance the web will lose.
I think it’s time for teams to start coding directly on mobile (or at least an emulator) and for product owners to start demanding demos on mobile in the first.**
* I’m not suggesting everyone does this, just that is an easy trap to fall in to. ** I’d be interested to know if anyone has seen any good development setups that replace coding in browser on the development machine with coding on mobile.
There’s a quote in this O’Reilly Radar trailer for a talk about the bitcoin blockchain that has slightly melted my brain:
I think 10 years from now we’re going to see that these types of semi-decentralized companies are going to be replaced by fully decentralized companies, where the company itself just runs in an automated way on some kind of cryptocurrency.
Imagine a co-operative or mutual, setup in a few lines of code, able to programmatically distribute shares in itself at point of sale, the purchase being the proof of work.
You can’t build what you can’t think of in the first place.
This is the first of a couple of posts about why I think we need better ways for thinking about the design of digital products.
Thinking in a linear way, in simple hierarchies or in timelines, is pretty simple for us; our brains evolved in a world with 3 dimensions (plus an additional one for time), but for more complex systems, systems with many dimensions, we tend to need tools and concepts to help us.
As an experiment, think about evolution for a few seconds. What picture do you have in your head?
Was it this one?
That image, from a 1965 popular science book, goes by the name of ‘The March of Progress’. It shows the supposed progression of the evolution of humans.
Or maybe the first picture that jumped into your head was of a fish hauling itself out of the sea using its fins as legs?
The idea of linear progress, of directional change, is a stong meme, but in evolutionary terms is also not very helpful. In Wonderful Life, a book that is part story of early life on earth, part the detective story of recreating the bizarre world of the Burgess Shale from 2.5 dimensional fossils, Stephen J Gould dedicates a whole chapter to detailing the damage it has done.
Maybe you had a branching tree in your head, with species on each branch? Though slightly closer to reality, it is still far from an accurate representation. Genetic diversity and evolution by natural selection are inherently multi-dimensional and as a result we need tools to think about them properly.
In The Blind Watchmaker, Richard Dawkins uses things called ‘biomorphs’ to do just this.
Biomorphs are computer generated critters created under a simulated evolutionary pressure. They can vary from each other in 9 ways (things like width, branching, height, colour).
You can play with creating biomorphs using this javascript implementation and watch Dawkins explaining them on this 1987 episode of
Horizon. (both recommended!)
Biomorphs
Biomorphs exist in ‘biomorph land’, a many-dimensional space that contains every potential biomorph. Similar biomorphs are clumped together; radically different ones more distant. It is a space you can take a mental walk though understanding how patterns change over multiple axis. In turn, biomorph land is a tool for understanding a more complicated space:
There is another mathematical space, not filled with nine-gened
biomorphs but with flesh and blood animals made of billions of cells,
each containing tens of thousands of genes. This is not biomorph space
but real genetic space. The actual animals that have ever lived on
earth are a tiny subset of the theoretical animals that could exist.
These real animals are the products of a very small number of
evolutionary trajectories though genetic space. The vast majority of
theoretical trajectories though animal space give rise to impossible
monsters. Each perched in its own unique place in genetic hyperspace.
Each real animal is surrounded by a little cluster of neighbours, most
of whom have never existed, but a few of whom are its ancestors, its
descendants and its cousins.Sitting somewhere in this huge mathematical space are humans and
hyenas, amoebas and aardvarks, flatworms and squids, dodos and
dinosaurs. In theory, if we were skilled enough at genetic
engineering, we could move though the maze in such a way as to
recreate the dodo, the tyrannosaur and trilobites. If only we knew
which genes to tinker with, which bits of chromosome to duplicate,
invert or delete. I doubt if we shall ever know enough to do it, but
these dear dead creatures are lurking there forever in their private
corners of that huge genetic hypervolume, waiting to be found if we
ever had the knowledge to navigate the right course though the maze. We
might even be able to evolve an exact reconstruction of a dodo by
selectively breeding pigeons, though we’d have to live a million years
in order to complete the experiment. But when we are prevented from
making a journey in reality, the imagination is not a bad substitute.Biomorphs are used as a stepping stone to paint a picture of a huge hanger containing every actual and potential organism suspended in the air. A hanger you can take a mental walk though, a couple of axes at a time.
It works with other concepts too. Try and imagine a ‘musical-instruments-with-strings hypervolume’, imagine it has an axis for number of strings, one for volume, sound, methods of playing, tone, colour, country of origin and so on. We can only glimpse a couple of the axes at any one time, but along them we might see all the guitars and banjos in a clump and the bowed instruments as a cluster with the hurdy gurdy sitting just out from them, along with all the other instruments that have never been lying inbetween, some viable, some that would make your ears ache.
For a reverse example, try and imagine all the axes that existed in Jeremy Deller’s History of the World before it was squished into two dimensions (geography, musical genre, political systems, historical events, synthesisers).
The History of the World
What does this have to do with digital products though?
My proposition is that digital products are also inherently complex and inherently multidimensional, that design is too often constrained by our methods of thinking about them and too often risk being either derivative or simple iterations of variants as a result; or worse, user needs are never met as well as they could be because we are looking for solutions in the wrong place.
Products can vary along many axes - the degree to which they are active or passive, centralised or federated, specific or generic, solitary or social; they can vary in the technology used to build them and on which they are consumed, the power which they create or remove from users and the organisations we put around them. The number of potential products dwarfs the ones we ever conceive of, while many will be nonviable, some will meet user needs. We need ways of exploring the potential space products could occupy, tools for embracing the margins of potential products, tools for walking though product land.
Things like the much-tweeted Spotify diagram of how they build products are just too simple, too linear; they are the equivalent to the March of Progress (and almost certainly doesn’t do justice to the thinking the team actually put into their products).
Even the standard build-test-iterate-repeat loop diagrams feel unhelpful, since it is too easy to fall into the trap of picking one thing, one broad concept and iterating the hell out of it, making sure every feature is as perfect as it can be, without ever again questioning the core approach (or maybe that you need two or three coexisting products or 2 equally good ways of addressing the same user need, just as convergent evolution has solved flight in pterodactyls and parrots, fruitflies and hummingbirds). Product land remains unexplored, user needs unmet.
Some digital industries seem to be particularly stuck, shuffling around a single idea, the equivalent in animal space to assuming the only animal that could exist was a hyena (albeit with slightly different markings).
My favourite examples of this are the digital products we have at our disposal for finding work and finding a holiday (though there are many others). In both of these industries almost all the products seem to be clumped around one small area of product land. Some tools may be slightly better than others, but they are all essentially variants the same product.
Finding a holiday online almost always conforms to the pattern of choosing a departure airport, a destination and a price range, then seeing a list of results. So you are pretty well served by existing products if you know where you want to go from and to (and want to do it by plane).
Finding a job online consists of entering a search term into a centralised system and getting some results back in a list. The search is generally free text and searches against a subset of the jobs available online, the ones the product knows about, which is in turn a subset of the available jobs in society at the moment, since many (most?) jobs never make it online. There is a bit of variation, but most products conform to this pattern.
Better products for people to find the best holiday might not be that important in the great scheme of things (unless you run an online holiday finding service), but better tools for people to find work is good for almost everyone (people find jobs and get paid, companies find employees, government pays less in out of work benefits and the economy generally functions better).
You are currently pretty well served by existing products if you know the type of job you want and where you want to work, which generally means having some employment history. In short, if you don’t fit that description, the market fails you.
Part 2 will try and imagine some alternative viable products in these spaces and the sort of tools we can use to find the edges of product land.
- Real Lies - Dab Housing
- Benji Boko - No.1 Sound - Beta Hector Remix - feat. Ricky Rankin
- Brother culture - Sound Killer
- Half Man Half Buscuit - National Shite day - if only for the lyric “A man with a mullet went mad with a mallet in Millets”. You could build a great passphrase generator from HMHB lyrics. Spotify link
The Moabi project is reusing the tools of the OpenStreetMap project to map natural resource use in the Democratic Republic of the Congo. This is an example of what Mikel Maron (from the Moabi project) and Elizabeth McCartney (from the US Geological Survey) called ‘OpenStreetMap as Infrastructure’ in their recent talk at State of the Map US ie taking the OpenStreetMap tool-chain and applying them to new problems.
I got to experiment with some of the OpenStreetMap tool-chain at bit during recent work at the Land Registry and, now in its 10th year, the OSM tools are really impressive:
The core OSM website is a solid product providing storage of geospatial data, history of changes, user accounts etc
The new in-browser editor iD is very simple to use, and is pretty easy to customise (I think this is the where Moabi have done the bulk of their customisation)
There are various tools for rendering map tiles, checking data quality, and importing and exporting different formats
Above all though OpenStreetMap is a set of tools for building consensus around ‘things in space’.
Which brings me onto local government. Local government has lots of information about ‘things in space’: the extents of conservation areas, redevelopment zones, dates and times of bin collections by area, locations of air-quality stations etc.
Some councils helpfully publish this data online. The best have done the hard work to clean the data, convert it to open standards and figured out the licensing. Lambeth Council even publishes areas with protected vistas of St Paul’s Cathederal as GeoJSON.
The trouble is - publishing, quality and format are patchy and inconsistent between councils and that makes reuse harder.
So here’s the proposition: could the OpenStreetMap tools be used to build a LocalGovMap? Not necessarily as the definitive source of data for evermore (although I guess it could be), but to build consensus about what local government datasets should look like, using a single collaborative space.
A similar approach is working in central government, where designers from across departments are using wikis to figure out the best way of designing user interface elements. So why not across local council officers who are the custodians of geospatial data?
I doubt it would take much. Probably a couple of councils coming together and a month or so of a Ruby on Rails / javascript developer (the core OSM website is written in Rails, and the iD editor is a javascript app).
Lambeth town hall - mockup with
Image derived from (cc) martin allen
Lambeth Council are asking residents with digital skills to help them improve the services they provide. As part of this, that they are holding a hack evening (which, annoyingly, I can’t make, hence this blog post).
One of the challenges is:
how can we make it easier for people to engage with the council in decision making online, particularly those who aren’t that comfortable using the internet?
Government, particularly local government, has buildings, physical presences in its communities. Why not use those buildings to show the work that is going on in them? Turn them into info-buildings.
Info-buildings are not new. The Ayrton Light sits on top of the Elizabeth Tower (aka Big Ben) to show when parliament is sitting. On the other side of the river, the London County Council displayed unemployment figures on a large billboard on the roof (for agitation rather than engagement, but still a similar principle).
As the difference between offline and digital become increasingly academic, rather than treating them separate realms, why not merge the two? Use buildings and data together for transparency and engagement:
Use live data to display what the council is currently voting about on the side of the town hall, so people passing can better understand the work that goes on there; show a sparkline of the housing list waiting list on the side of Olive Morris House; advertise SMS numbers of open consultations to people can vote from the top deck of the bus.
The technology to do this is relatively simple - see this article on ‘Projection Bombing’ - so it should be doable, at least as an experiment, at a relatively low cost.
[Note: I’m not advocating doing this without permission!].