When you report a problem on FixMyStreet.com, the site displays a map for you to click on to indicate its exact location. Of course, you can zoom in and out of that map, but when it is first displayed, FixMyStreet needs to use an initial ‘default’ zoom level. Ideally, this is a zoom level that reduces the number of clicks required before a user can pinpoint the location of their problem.
And here’s where we encounter a tricky problem. The world is a varied place – some towns are very dense with buildings and streets crammed close together. In these areas you need to default to a zoom that’s quite ‘close in’, otherwise it can be hard to locate your problem.
But out in the countryside, we have the opposite problem. You can have huge areas where there’s nothing but blank fields or moorlands. If the default map zoom is ‘close in’ here then users are likely to see a big map full of nothingness, or maybe just a single stretch of unidentifiable road.
So, what is to be done?
The answer is this – every time you search for a location in FixMyStreet the website does a check to see whether the location you typed is in an area where a lot of people live, or very few people live.
mySociety has been storing this population density data in a webservice which we call Gaze. If the area you searched for is in a densely populated area we assume that it must be an urban location, and the map starts with a helpfully zoomed-in map. But if you’re in a sparsely populated area then it’s probably rural, so FixMyStreet starts zoomed out, making it easier to get an overview of the whole area.
Where do we get the data from? Our late colleague Chris discusses this in a blog post from 2005 — the short answer is NASA SEDAC and LandScan. It’s an interesting example of how unexpected things can happen when data is made public — if population density wasn’t available to us, we wouldn’t have been able to put this small but clever detail into FixMyStreet’s interface.
When you report a problem on FixMyStreet, we ask you to click on a map to pinpoint its location. For example, if you want to tell the council a tree has fallen over, or there is a hole in the road, you can click exactly where it is. This is an easy way to provide the most accurate information in the report that we then send to the council.
If you’re a programmer then you probably think that it’s obvious to use a map for such problem reporting. We agree: maps are ideal for this, and it’s a shame that so many councils still aren’t doing it this way.
However, even though it’s very useful to have an accurate location for a problem, with FixMyStreet there are several reasons (below, we list just four) why someone might not be able to simply “click on the map”. In these cases, the map is no longer helpful — it’s a barrier. So we have to ask: is an accurate location so important that we should refuse to accept reports without one?
It turns out, for FixMyStreet, we don’t really need that accuracy. Sure, it’s best if we have it, and over 95% of reports do contain pinpoint locations, because most people do click on the map. But if we don’t have that location data, then we can still make a fair guess from the postcode or area name that the user has already provided (that’s how we knew which map to display, after all). So we allow the user to submit the report without clicking on the map.
Consequently, every time someone reports a problem without using the map, it means they’ve not given up, or clicked on the wrong place just to submit the form. In fact, they’ve reported a problem because we removed what would otherwise have been a barrier.
So, here are some reasons why we didn’t make clicking on the map mandatory in FixMyStreet:
- Map-reading isn’t a skill everybody is comfortable with
When you’re building and testing FixMyStreet, you tend to imagine people will be reporting problems in places they know well. It’s easy to find somewhere on a map you are familiar with. But FixMyStreet users could just as easily be reporting a problem they passed on their way to work, on holiday, or at a party. So if they can’t read maps well it might be difficult or frustrating to locate a unfamiliar road junction or building.
- Navigating a map requires more challenging user skills
FixMyStreet is easy to use, deliberately — in fact you can report a problem just using your keyboard. Zooming and panning a map element is much harder than any other part of the process. Remember that if you’re building a website like this yourself you are already comfortable with using complex controls that lots of people — FixMyStreet-using people — are not. This is true even before considering other limitations such as small-screen devices or visual disabilities.
- The map might not be helpful
We rely on third-party maps. Most of the time, they are excellent. But what if the map is out of date? What if the problem is on a new road which hasn’t been added yet? What if the user remembers that the pothole was outside a distinctive shop or remarkable tree, only to find such landmarks aren’t on the map?
- The problem might not have a location
Potholes are easy: they have a fixed position on the road. What about smells or flooding? These problems sometimes simply don’t seem to have an obvious pinpoint location.
In summary: we think clicking on a map is the best way to ask for a location from FixMyStreet users. But if we forced everybody to do it, some problems would never be reported, and some people would never become FixMyStreet users.
- Map-reading isn’t a skill everybody is comfortable with
This means that you can go to www.fixmystreet.com and start typing your postcode straight away. There’s no extra click to put your cursor in the input box.
Does it matter? On any single visit, if we didn’t do this, then probably this happens: you simply click in the box, and start typing, and do not even think about it. No problem! But sometimes you don’t notice that the cursor is not in the text box, and you start typing, and those letters do not appear. You look up, and you are a tiny bit annoyed; you click in the box and type it in again. That’s all.
But remember we’ve had well over one hundred thousand different users access FixMyStreet since it went live. On a site that gets that busy, even if we annoyed only 1% of those users on the homepage, it adds up to a lot of frowning. A user who is annoyed on the homepage is more likely to give up — and remember that the homepage often is not the first page they came to, so some users will already be getting tired of unnecessary clicking. This is why we do believe it is worth getting things like this right, and that it does matter.
In fact, in this case there are no other input boxes on the homepage: all the other interaction is by clicking on a link. This means that everything that page offers is just one click away (and yes, the way browsers handle forms means you can press Enter instead of clicking “GO” when you’ve finished typing, but we count that as one click).
This is a very small detail, and almost nobody would notice it if we did not point it out. But actually, that is one of the reasons we’re posting these design tips: good design, especially usability design, usually means you don’t notice when an interface is doing the right thing.
This tip is easy, and it builds on two earlier ones: don’t force your users to make any more clicks than absolutely necessary. Identify what they’ll probably be trying to do, and let them begin that as soon as possible, especially on the homepage.
There are three things to think about here:
- Is there anything you can do to remove an extra click for a user? Do you really, really need that information from them? Or do you really need them to press ‘OK’ here?
- Too many clicks and users will abandon their task especially on sites where people are engaging with government or politics for the first time
- Most users began their task before they arrived at the site
The second point is especially relevant to users of civic sites like the ones we build. This is different from other websites. For example, if you go online to book a flight, or pay tax, or buy flowers because you forgot your mother’s birthday, even if the website is difficult or frustrating to use, you will stay on it until you have finished. The result is more important than the barriers: you need to finish. But people who are thinking about reporting a pothole they just missed on their bicycle that morning, or writing to their parliamentary representative for the first time, or making a freedom of information request — well, these people are already making an unusual effort. If you do anything at all to make that harder for them, then they can and they will give up. Civic sites must make the task so easy that nothing discourages users from finishing the mission they started.
The third point is more subtle. Earlier this year, Francis Irving explained how clicking on Google was part of the product. This means that, by the time a user has arrived on your site, they may already be many clicks and key-presses into the process. The more you prolong this effort, and especially if you prolong it with unnecessary or annoying extra clicks, the more likely it is that they will give up.
A user who gives up does not accomplish the task you wanted them to do.
A user who gives up might never bother to try again.
Civic engagement can be that fragile, especially for first-time users.
As we’ve already pointed out in a previous blog post, it’s likely that someone will arrive at your site on the “wrong” page, and so they will click again to get to your homepage. That click has already prolonged their journey. Click-fatigue starts to set in. You must help them to start doing something — instead of still clicking around trying to get to the place where they can start — as soon as possible. This is why you should think of the homepage as the centre of your website: it’s not the cover page or an introduction — it’s where people already on your site go to get things get done.
Or, to put it another way, by the time users have got to your homepage, perhaps they won’t have any spare clicks left.
Of course, we have to be pragmatic about this and make sensible guesses about what users will be trying to do — it’s silly to try to cover everything. We study our web analytics and do user-testing, but even if you can’t do that, it’s usually fairly easy to identify the key tasks. We don’t just think of the homepage as an introduction, or a cover page, or a portal (although it can also sometimes serve those purposes): ideally, for the most common tasks, it must be the start. The task does not need to be finished — that can be several pages further on. As we showed in an earlier blog post, we just need to get users started.
Let users make a useful click — even better, a successful click — and they stop thinking about giving up, and start getting things done.
If you’re building any civic or democratic website, we know that you’ll want to make its homepage beautiful and unique. After all, you want to make a good impression on your users, and first impressions are the ones that count.
Go ahead! Dive in and make it special… but also take our advice and don’t burn all your energy on building a perfect homepage. The reason why is that many of your users will come to your site without ever seeing your homepage.
The main reason for this is the influence of search engines, Twitter and Facebook. These have already changed users’ behaviour during the short history of the World Wide Web: there was a time when people could be expected to start on the front of your site and work inwards, clicking on the links you provided, step by step. But several things now work against this: search engine results link to pages deep within your website; links are easily and routinely shared (email, Twitter, Facebook, Pinterest, even QR codes); and people are becoming accustomed to simple URLs that they might compose by hand, such as mysociety.org/contact. Realistically you must expect a user’s first page to be any* page on your website.
This means that, on every page except the homepage, your users may have arrived without any context or history — and, importantly, without the benefit of all the fabulous design time you’ve put into that glorious homepage.
Spend some time thinking about how you are treating those people. Imagine they’ve been teleported into a strange land; they know, roughly, what planet they’re on, but otherwise it’s all new to them. That’s how bewildering this could be to a user who’s clicked on a link that drops them deep into your website. It’s a common experience and it’s easy to get right, but if you get it wrong, they will just as easily teleport out again. And they will think: “that is not somewhere I want to visit again.”
None of this is very radical. But the point is that it’s very easy to overlook — especially because, if you’re one of the developers working on a site, you already know too much about how it works to be objective when you look at what you’ve made.
Here are some things you should consider:
- Do your pages instantly say what they’re for? A new user landing on an unfamiliar page will grope for some explanation – “This is a page about a politician”, or “This is a page about problems in this street”. You need to make sure you spell it out somewhere easy to see.
- Can the user easily take an action from this page? If the user was looking for more than just a quick hit of information, the chances are that they want to get something done. Don’t fall into the trap of assuming that, just because they’ve landed on this page, this is the page where they want to be. For example, if you look at any one problem report on FixMyStreet and you will find a big “Report a problem” link in yellow at the top of the page.
So you should of course create a beautiful, functional homepage, but you should never forget that almost every page on your website will be a homepage for someone.
One of the democratic software tools mySociety has built is an online petitions tool for use by governments. We built the first version for the British Prime Minister’s office, and now it is used by a variety of British local governments.
When a user wants to make a new petition, they fill in a web form, containing the petition details.
During this process, a user must choose when they want their petition to end.
The question we are exploring today is this: what’s the best way to ask for that information?
From a developer’s point of view, the end of a petition is obviously a date. This is because the petition software really needs to test whether or not today’s date comes after the petition’s end-date. So an easy — and accessible — way to ask for this data would be as a
dateinput, which could even helpfully trigger a calendar pop-up menu or similar widget.
But we don’t do it like that, for a couple of reasons, both of which you might miss if you were to build this from scratch. Instead, we ask:
For how long would you like your petition to accept signatures? (e.g., “1 month”; maximum 1 year)
That’s not a date input. But why?
The first reason is that the user is thinking about running a petition as something they plan to do for a period of time. Put simply, if you’re asked about your next holiday, you’ll probably imagine what you’ll be doing (“I’m going to spend two weeks lying on the beach”) rather than the end of it (“I’m going to stop lying on the beach on the 25th of August”).
In terms of interface design, this means that users will tend to think about how long something lasts differently than from how a computer or a coder will tend to think about it. The general rule is: even for something as simple as this little web form, if it’s possible to create an interface that matches the way that a user thinks about the world, then it will be less confusing for them than one that does not. Usually this means the system has to be a bit more complicated to program, in order to convert what the user types to what the computer needs.
The second reason that we ask for a duration, not a date, is that in the case of the petition, the user doesn’t actually know when their petition is going to start. Although they’re entering it into the website right now, there will nearly always be a delay before the government approves it. So most of the time, by asking for a duration, we’re avoiding raising this issue at all, and the user simply says what they mean, and it works. A petition with a duration of “3 months” will run for three months, once it goes live. A date wouldn’t survive an unspecified delay like that.
So, we ask for a duration and parse the result to turn it into a date when it goes live… but there’s an extra twist. What if the user really does know the date their petition must end? Maybe it’s a petition about closing the main road for a New Year’s Party, and it’s got to be discussed at the council meeting that’s being held on the 5th of December. Well — OK! If the user puts a date into the duration field, even though we didn’t ask for a date… we accept it. We can do some validation to make sure it’s a sensible date, of course, but basically if someone does puts a date in there, then that’s fine too.
What we hope this has shown you is that even something as simple as asking a user for an end date can be done easily (just use a date input there) or thoughtfully. The system wouldn’t break if we did it the other way. But making things as convenient as this means that we are allowing users to focus on the thing we’re trying to let them do, instead of drawing attention to how we are making them do it.
Simple things are the most easily overlooked. Two examples: a magician taking a wand out of his pocket (see? so simple that maybe you’ve never thought about why it wasn’t on the table at the start), or the home page on www.fixmystreet.com.
The first thing FixMyStreet asks for is a location. That’s so simple most people don’t think about it; but it doesn’t need to be that way. In fact, a lot of services like this would begin with a login form (“who are you?”) or a problem form (“what’s the problem you want to report?”). Well, we do it this way because we’ve learned from years of experience, experiment and, yes, mistakes.
We start off by giving you, the user, an easy problem (“where are you?”) that doesn’t offer any barrier to entry. Obviously, we’re very generous as to how you can describe that location (although that’s a different topic for another blog post). The point is we’re not asking for accuracy, since as soon as we have the location we will show you a map, on which you can almost literally pinpoint the position of your problem (for example, a pothole). Pretty much everyone can get through that first stage — and this is important if we want people to use the service.
How important? Well, we know that when building a site like FixMyStreet, it’s easy to forget that nobody in the world really needs to report a pothole. They want to, certainly, but they don’t need to. If we make it hard for them, if we make it annoying, or difficult, or intrusive, then they’ll simply give up. Not only does that pothole not get reported, but those users probably won’t bother to try to use FixMyStreet ever again.
So, before you know it, by keeping it simple at the start, we’ve got your journey under way — you’re “in”, the site’s already helping you. It’s showing you a map (a pretty map, actually) of where your problem is. Of course we’ve made it as easy as possible for you to use that map (and, yes, we also let you skip it if for some reason a map doesn’t help you). You see other problems, already reported (maybe you’ll notice that your pothole is already there — and we haven’t wasted any of your time making you tell us about it, even though you probably didn’t realise we intended right from the start to show you other people’s problems before you reported your own). Meanwhile, behind the scenes, we now know which jurisdictions are responsible for the specific area, so the drop-down menu of categories you’re about to be invited to pick from will already be relevant for the council departments (for example) that your report will be going to.
And note that we still haven’t asked you who you are. We do need to know — we send your name and contact details to the council as part of your report — but you didn’t come to FixMyStreet to tell us who you are, you came first and foremost to report the problem. So we focus on the reporting, and when that is all done then, finally, we can do the identity checks.
Of course there’s a lot more to it than this, and it’s not just civic sites like ours that use such techniques (most modern commerce sites have realised the value of making it very easy to take your order before any other processing; many governmental websites have not). But we wanted to show you that if you want to build sites that people use, you should be as clever as a magician, and the secret to that is often keeping it simple — deceptively simple — on the outside.
At mySociety we take some pride in knowing that FixMyStreet has helped rid the world of thousands of potholes over the years, but of course our contribution to unbroken roads is merely the start of the process. Certainly, reporting a hole on FixMyStreet is easy (we’ve gone out of our way to make sure that is the case), but we do appreciate that a hole remains a hole until somebody takes the trouble to actually fill it in. So really it is all the inspectors, despatchers, logistic and supply teams, fleet mechanics, and repair crews who make the world a smoother, less perforated place.
We’re currently working on a pilot project in the city of Cebu (the “second city” of the Philippines) with the World Bank and transport experts ITP that will implement a FixMyStreet-based reporting service as part of the ongoing battle to keep its roads and streetlights in good repair. Later in the year we will have more to report, but for now—before anything is up and running—we can start by saluting the work of some of the remarkable people who fix the roads (and replace the bulbs) there.