Museums Get Mobile!

“Museums Get Mobile!” was a one day event on designing mobile experiences, aimed at managers, curators and consultants in the cultural sector. It was organised by the UK Museums Computer Group in MShed, Bristol.

The day kicked off with a welcome from the organisers and a short talk from the sponsor, about the advantages of apps. This was followed by the first keynote: Clearleft’s Andy Budd.

Andy Budd – Responsive design is easy

Andy Budd started off by claiming that responsive design is actually quite easy, quickly adding ‘as long as you have been paying attention’.

He took us through the various stages of the history of web design, going for flexible to fixed to flexible and responsive. He showed the very first web page, that was just text, had no CSS and was therefore already responsive. It could be accessed from any kind if device. This is no accident, as the web was envisioned with universality as its underlying principle. Paraphrasing Tim Berners-Lee, it should be accessible from any kind of hardware that can connect to the internet. Along came designers, and they messed it up. Designers have been breaking responsiveness by placing content in fixed width containers.

Embrace the flexibility of the web

There have always been voices that we should embrace the flexibility of the web, most notably John Allsopp in his [classic] article A Dao of Web Design: “we should embrace the fact that the web doesnt have the same constraints [as print], and design for its flexibility”.

Just like people thought tableless CSS sites would never become the norm, some people still think responsive design never will. Andy emphasised responsive design definitely is the future, as it is the most sensible thing to do.

Andy briefly discussed apps versus websites, and was in favour of the web, arguing from statistics. The chance someone will visit your website is much higher than that someone will go through the whole process of finding, downloading and installing your app, especially if they rarely ever visit. Secondly, a problem with apps is that there are a lot of different ecosystems: iOS, Android, Windows Phone, Blackberry, and so on.

Responsive web design can be regarded as a logical next step in the history of web design. There were fluid sites, then fixed sites designed for fixed widths, then half fluid sites and now fully fluid and adaptive sites that are meant to work everywhere.

It started to be used in personal projects first, and quickly made its way into commercial sites, The Boston Globe being one of the first. A great example of a responsive museum website is that of the Rijksmuseum [see also the case study of the new Rijksmuseum website at Fronteers 2013.

Being such a logical next step, for front-end developers, responsive design is not so hard, especially if you have been paying attention to things like fluid design. If you haven’t, it may snuck on you. Learning responsive design from scratch is probably hard and scary, as there is a lot involved.

Organisations have to make their sites responsive. “Wait and see” is not a great strategy, your competitors will get ahead of you. “It’s hard” is not a valid argument. Yes, it will take extra time (and budget), in our [Clearleft’s] experience about 10% more. But if 50% of your visitors visit from mobile, which is likely to be the statistic in 2014, is spending 10% more to reach 50% more people really so bad? Why spend 100% of the money on 50% of the people that access your site? As a museum, you would not discriminate against sex or race, why discriminate mobile users?

Responsive design is not designing three versions for mobile, tablet and desktop respectively. It is a way to pour your content in as many as possible ‘glasses’ (Andy visualised content as water, and devices as glasses). Responsive design demands you understand your content.

Our job is not to dictate design, it is to hint design

In responsive design, never think of devices, think of breakpoints instead: optimise where the layout breaks, not where a specific device is used. You have no control over what devices a visitor uses to access your website, what browser they have, what font size they set. Our job is not to dictate design, it is to hint design.

In a responsive design process, developers and designers should work closely together and talk to each other.

Responsive retro-fitting, the process of making an existing website responsive, does not work well, as it fails to address content problems and does not have the benefits of starting with mobile first. Companies like the Guardian started with a responsive mobile site from scratch, built next to the existing site. It was initially only shown on mobile devices, whilst it was being optimised for bigger screens. It is planned to replace the existing site sometime this year.

Mobile first is a very useful conception to think of, as it can helps focusing attention. There is less space available, so it forces content, marketing and design people to prioritise.

Jeremy Keith would hate me for saying this, but I prefer tablet first, it is a nice midground. You start from a tablet version, them scale up a bit for larger screens and scale down a bit for smaller screens. We are currently taking this approach working with a client.

There are still a lot of issues to resolve with responsive design, an important one being how to deal with images. yay for <picture>

The question shouldn’t be, “when should I make my site responsive?”, it should be “when can I make my site responsive?”

Q: How do you deal with people within the organisation that are convinced they need an app?
A: Mobile apps are part of a healthy ecosystem, but responsive web design is a sensible and logical approach to take. Irregular visitors of your museum will not take the hassle of searching for and installing your app, fans of the museum may like app. You don’t need to talk your boss out of apps, but you should be doing responsive web design as a default.

Ask for forgiveness, not permission

Q: How to ask for budget to do responsive design?
A: Use statistics. Personally, I prefer to ask for forgiveness, not permission. In the project description, don’t make a big deal about it being responsive, maybe call it “has to work on a variety of devices”. That is just very sensible, no one can argue against that. And then when it launches and happens to work across lots of devices, everyone is happy.

Designing for changing museum audiences in-gallery and online

Ivan Teage

Ivan Teage of the Natural History Museum (NHM) explained how the NHM’s approach to mobile caters for the basic needs of visitors.

NHM offers WiFi, which is activated through a splash page that comes up when users try to connect. On this page, NHM can get the visitor’s attention. Analytics are used to see what people are doing and test different content.

NHM research shows 77% of visitors have a smart phone. Many have a tablet, but they don’t bring it to the museum. Before visiting, 1 in 3 visitors research their visit on their phone.

Nearly 10% of the visitors, uses the WiFi, making it a big hit, especially since no efforts were made to promote it. Most use it not to find information related to the museum, but for Facebook.

In 2014, on average, websites will have more mobile visits than desktop visits

As Andy said before, in 2014, on average websites will have more mobile visits than desktop visits. The website of the NHM currently hovers around 44%. There is also a notable difference between pages, some pages are much more popular on mobile, others on desktop.

One of the great challenges NHM faces is that there are a lot of different priorities within the organisation, some “nondigital”.

Frankly green + webb

The biggest aspect in mobile is the organisation. There is a lot of making things for mobile just for the sake of making things for mobile, those are the most challenging projects to work on.

Some regard mobile as a tool. Working on mobile, people tend to focus on choosing tools first, rather than on the actual project. Maybe because it is not very physical, mobile is often called “an experience”.

Let’s look at defining what we have to design before we choose the tool to design it with.

For a specialist (…) it can be heart-breaking to be asked to summarise something in three sentences

For a specialist, for example, a curator who studied 15 years on a subject, it can be heart-breaking to be asked to summarise something in three sentences, they would probably prefer more detail.

Digital services often exist of more than just a website. As they often involve with physical services as well, [like a physical box office in the case of a museum], there are lots and lots of people involved in any given project. It will be hard to get them on the same line, or in the same meeting room.

Two tools to deal with this complexity:

• a digital services manifesto, a set of shared objective like the one GDS released, can be a great tool to push a project in an organisation
• a visitor journey, an outline of every step a visitor can be involved in, to try to understand what the whole experience is like. There are a lot of examples of visitor maps on the internet, from companies like Lego and Starbucks.

Léonie Watson

Léonie Watson talked about accessibility (on the web).

Accessibility is not boring, we can creative visually exciting and creative experiences that are accessible. It is not difficult, it is no rocket science, but there may be unfamiliarity.

Accessibility is usability for all of us.

Everybody benefits from accessibility

Who benefits:

• You do. You can make your content available to more people, you open it up to a larger audience, which makes a great feal of sense.
• We do (us being people with disabilities, like sight, hearing, learning, cognitive).
• Everybody does. The real minority in the world, are just regular people. People surfing the internet wearing glasses or with a hangover, or people who are tired, because their young kids kept them up all night.

There are accessibility guidelines that make sure we can find out what to do, and help to make things testible. BBC recently launched their Mobile Accessbiblity Guidelines.

There is accessibility testing. Some things can be automated, but putting your content in front of people with disabilities will likely be more effective.

There is also legislation. In some countries more than others. In the UK, there is the Equality Act. It does not have any requirements for accessibility, it only says “digital services have to be accessible”, it doesn’t specify to which standard.

Accessibility does generally cost a little bit more. If your people are good and used to accessible best practices, they can do optimisations at no extra cost. But if you want to do testing, which you probably should, it can cost more than other usability testing, for example transport costs.

Retrofitting accessibility is probably just as hard as retrofitting responsive design

It is best to ‘do’ accessibility throughout all stages of the projects. Keep an eye on it as the project goes. It works with waterfall and agile. Test as often as possible, fix as quickly as possible. It is easier and perhaps cheaper to fix things in early versions than it is in live sites. Retrofitting accessibility is probably just as hard as retrofitting responsive design, which Andy discussed. It will cost much more and probably achieves less.

Accessibility is forever, not just for launch. Keep an eye on accessibility after the project goes live, maybe monthly or yearly.

Andy Budd: Five to six years ago, developers were very involved with accessibility, do you think that is decreasing now?
Léonie: Yes, it does get lost in the buzz sometimes, but there are still a lot of efforts and generally the situation is quite good.

Making responsive design a reality: accessibility and content strategies and commissioning content strategies

Andrew Lewis – thinking holistically about mobile-responsive services

Andrew Lewis of the Victoria & Albert museum discussed how they think about responsive web design. A responsive web service is one that adjusts content to your audience.

V&A did a responsive retrofit in 2012.

Responsive design is not about technology, it really is about social behaviour.

Situations in which people use their phone:

• preplanning a visit
• visual diary
• comfy sofa time

Mobile users and tablet users are often the same people. The V&A website optimises for different contexts, orientations and screen sizes.

Dan Goodwin – Collaborative discovery: commissioning a big web project when you’re not sure what you want

Dan Goodwin, UX Director at Bristol-and Cornwall based agency fffunction, talked about kicking off a big web project.

It is difficult to choose the right agency for the job. A traditional commissioning approach could include asking within your network, send out request for proposals, asking agencies to come up with quotes.

But an important thing to note is: in the process of building a website, requirements are going to change. That is a given. The problem with the traditional commissioning approach is that nobody really knows 100% what’s needed.

Working on the Bristol Museums websites, fffunction did a collaborative discovery phase, to make sure all the different requirements were analysed and looked into.

They did a stakeholder workshop, a get together with a selected number of shareholders, getting them to put post it notes on the wall, with things like target audience, principles, content ideas and potential features. It gave a great insight into the scope of the project and what needed addressing. They also did user interviews, which helped testing their assumptions.

During the Q&A, some pros and cons of working agile were discussed. Working with flexible requirements is one thing, agreeing to or getting permission for flexible pricing another.

Shelley Mannion – Learning from mobile experiences in museums

Shelley Mannion from the British Museum showed how (people) interacted with various kinds of devices and experiences within the British Museum.

Contrary to other speakers before, Shelley did have some good experience with apps. Some webbased, some native.

In statistics of the British Museum website, mobile has also grown a lot. It increases reasonably quickly, but not as fast as the first graph showed.

In her talk, Shelley challenged some common assumptions, like “It has to be the latest device”, this really depends on the device you are using. Another assumption she challenged: “the bigger the screen, the more people can stand around it” . They found the maximum seems to be about 3-4 people around a screen, regardless of how big the screen is.

Shelley showed a couple of very interesting examples of projects in which visitors interact with exhibitions. Imagery, videos and URLs will be in the slides, but they were unavailable at the time of writing.

Conclusion

Some important takeaways of the day were that mobile is here to stay, that it will be bigger than desktop in 2014, and it would be ideal to make things universally accessible, embrace the flexibility of the web and have a flexible workflow. It became clear that those things can be difficult and scary, but they will be beneficial in the long run. Some solutions were discussed: more research —into visitors/users as well as into the project scope—, better teams in which designers, developers and content people work well together and always keep challenging your assumptions.