V&A Digital Explorer map

The V&A Digital Explorer map pushes the boundaries of what a museum web app can be. We would like to nominate it for Best of the Web, as we believe it is a ground-breaking service that demonstrates innovation in a number of novel ways. We also strongly believe that innovation is only really relevant if it can be shown to make services better for users, so we have included evidence available to date, of impact and changed behaviour.

We outline what how we wanted to improve the audience experience by building the Digital Explorer map, its main features and why we feel these are innovative. Finally we also provide pre-launch objectives combined with post-launch user data, and analysis of the impact upon the user behaviour it was developed to support.

Why we created the Digital Explorer map

Wandering the spaces of the V&A is literally a wonderful experience for millions of visitors every year. There are many reasons people visit, but one of the most universal and powerful emotional reactions is the simple pleasure of discovering the wonderful objects in the V&A’s gallery spaces. We had been aware for some time that there was no equivalent experience for digital visitors. We had rich content, imagery, video and data about objects and events, but there was no equivalent way to meander at leisure through the V&A digital space to discover the amazing collections it contains.

The Digital Explorer is primarily an experience designed to allow people to indulge themselves time to leisurely explore the V&A, either as a pleasure in itself, or as an engaging way to discover what to see in advance of a visit. To realise this, it needed to deliver a “sofa”-quality experience for users. This is why we built it for tablet use first. Of course, we also made it responsive to remain useable on a mobile because we know that most people who visit bring their phone.

Outline of innovations in the Digital Explorer Map

These are the main ways in which we suggest the Digital Explorer Map demonstrates innovation:

  1. Firstly the Digital Explorer Map is innovative in its approach to user experience – it was developed primarily for pleasure and enjoyment. It was designed to suit tablets because user behaviour studies show they have become established as the device of choice for pleasurable leisure web use. It’s intuitive pinch-and-zoom and drag-and-drop gestural features encourage easy exploration with the fingers.
  2. It is innovative in its subtle use of responsive features so that audiences can use it on any device they buy and in any way they choose to use it. This is because people are not either tablet or phone users, they own, share and use all sorts of devices, sometime concurrently, sometimes differently because of context.
  3. The Digital Explorer uses standard, open web methods such as HTML5, JavaScript and CSS in innovative new ways to avoid excluding people. It was a design requirement that the service did not use a proprietary native app that we knew would exclude significant numbers of people. Our audiences should not miss out because they happen to own the ‘wrong’ phone or tablet. That would be our fault, not theirs.
  4. It is also shows innovation in how it advances the V&A’s data-by-default delivery strategy. It is a concrete example of the rapid service development needed to cope with the market unpredictability of the modern multi-device, digital consumer lifestyle. It is also an exemplary demonstration of a live service delivering the often-talked about principles of Create Once, Publish Everywhere. It combines user-centred design with strategic open data policy by pulling in live data from the collections and events APIs (application programming interface).
  5. Although deliberately not obvious to end-users, it is technically advanced and has a number of clever and elegant technical features that extend the use of open HTML in new directions. Importantly however, these technical features were only included where they helped make a great user experience. For example, Scalable Vector Graphics (SVGs) are used to provide smooth lossless zooming and small download sizes for mobile connections, not because they are innovative, but because they help users.
  6. Finally, the map has clever user-behaviour tracking built into it, to harvest evidence of how it is used. It automatically tracks gestures, use of navigation and search activity as data. By combining a carefully designed data model and event triggering linked to the existing Google Analytics account this data can be easily reported upon in Analytics and cross-referenced against other standard data. This innovation allows us to gain a better picture of how services are used overall and helps measure engagement.

map-facilitieshttps://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/map-facilities-300x201.png 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/map-facilities-446x300.png 446w" sizes="(max-width: 950px) 100vw, 950px" />

 The Digital Explorer Map innovations in detail

  • Pushing what images can do, with Scalable Vector Graphics (SVG)
    The map has smooth gesture-based zooming in and out for users, without loss of quality, which looks just as good close-up as it does zoomed out. This is made possible with the groundbreaking use of HTML5 to manipulate SVG vectors. As well as looking great, it uses much smaller files sizes than would be possible with traditional scalar web graphics such as JPEGs or PNGs. Vector graphics have obvious advantages in a world where a service may be used on 42″ monitors or 3″ mobile screens and everything in between with no way of knowing the devices people are using. SVGs are an elegant solution to provide responsive and lovely image scaling without loss. This innovative approach to “responsive design” is one of the map’s most subtle features.
  • Built for pleasure
    The map is designed for pleasurable discovery, valuing enjoyment and playful exploration as a primary purpose and recognising the fact that spending time contemplating culture, or a planning a visit to a museum is an indulgence to be savoured in itself.
  • Optimised for device-specific behaviours
    The map is unusual in being optimised to display features suited to the typical user behaviours of the device they may be using, all from a single feature. In tablet view the map is optimised with full menus and gesture navigations. In phone view, the map condenses to a streamlined display to reflect that mobile use requires simpler features, because mobiles have small screens and are often used whilst walking, often with one or two fingers

    • Tablet-optimised view
      The default view is designed for tablets as this is a format which studies show is popular for leisurely browsing, which is what the Digital Map is intended for.
    • Mobile-responsive view
      The map will adjust its display dynamically dependent on screen size, to ensure it is still easily useable on mobile phones. This is because user-surveys show mobiles are the devices people actually bring with them to the museum.
    • Large-screen responsive view
      The scalable vector graphics mean that if the map is used on very large screens, it will simple expand to fit, without loss of image quality. This is designed to reflect the increasing availability of cheap large monitors for desktops and to anticipate future deployments on large touch-screen devices or kiosks in the museum.
    • Orientation-responsivity
      The map detects user screen orientation to display features more easily in either portrait or landscape views.
  • Rich content: deeply integrated and dynamically updated
    The Digital Explorer map allows people to “wander” the V&A with their fingers and show them its incredible contents. As users explore, they are connected with images and information about the incredible objects on show in the V&A’s many galleries. They can also see the full range of events and where exactly they are happening. This rich information is provided by live-linking to museum information and knowledge from multiple sources. It shows images, and rich information from the collections database and current event information from the events database. By using lookups based on room-reference, the contents of the rooms will update simply as the organisation does its daily work of cataloguing (object info) or managing bookings (event info). No additional content or technical resource is needed.
  • Create Once, Publish Everywhere
    The map demonstrates the power of making data portable so that it can be re-used. It connects to the V&A’s core collections and event data using the established data APIs that also power multiple other services. The map is built on an innovative digital asset strategy stretching back to 2008 when the first collections API was created.
  • Fully platform independent for the modern multi-device audience
    Because it uses open web standards, the map is also not locked into proprietary platforms, avoiding vendor lock-in. It is not restricted by app rules controlled by third party operating systems like iOS or Android. For visitors, this means it is forward-compatible with almost any web-enabled device. This is not only user-friendly, it is a very efficient way to manage scarce resources. Consumers are free to choose. Just because they use one technology now, doesn’t mean they will stay with it forever.
  • Future-proofed with open standard web technology
    The map is sophisticated, but is based upon solid HTML5 web open standards: HTML5, JavaScript, CSS and SVG images. Using open standards allows the Museum to participate in open collaborative development across and beyond the cultural sector and to expose our code to others to re-use
  • Small file size for faster download
    The total map size is less than 1.5Mb, which is considerably smaller than using comparable static images of maps, or PDFs. This is also less than 30% of the size of the V&A’s non-interactive PDF map (4.8Mb). In a sample test (over 3G on a tablet) the 1.4Mb digital map took 1.34 seconds to download compared to 10.06 seconds for the 4.8Mb PDF. (20 September inside the V&A building). This is a huge improvement.

Engagement via intuitive gesture-based interactivity

point

https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/point1-300x215.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/point1-417x300.jpg 417w" sizes="(max-width: 610px) 100vw, 610px" /> Easy finger-touch touch gestures for room selection and menu navigation

pinchout

https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/pinchout1-300x215.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/pinchout1-417x300.jpg 417w" sizes="(max-width: 610px) 100vw, 610px" /> Two finger pinch-out gesture to view detail
Zooms in for closer inspection

pinch

https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/pinch1-300x215.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/pinch1-417x300.jpg 417w" sizes="(max-width: 610px) 100vw, 610px" /> Two finger pinch-in gesture to view smaller
Zooms out for stepping back and seeing where rooms and facilities are located

venus-close-up-room

https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/venus-close-up-room-300x202.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/venus-close-up-room-444x300.jpg 444w" sizes="(max-width: 946px) 100vw, 946px" /> SVG images allow sharp zooming with no loss of quality, independent of screen size

icons

https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/icons-300x202.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/icons-444x300.jpg 444w" sizes="(max-width: 946px) 100vw, 946px" /> To avoid clutter, room number icons only show when zoomed in sufficiently to read them

Multiple device support

The Digital Explorer is standard HTML, so it works on almost web device. Here are some examples…

apple

Responsive display on Apple iPhone 5 (iOS)

android

https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/android-150x300.png 150w" sizes="(max-width: 314px) 100vw, 314px" /> Responsive display on Samsung S4 (Android)

Put simply, the Digital Map gives visitors a pleasurable, simple-to-use way to explore the V&A on their device of choice. They can pinch-and-zoom, drag-and-drop and touch-select rooms, all within an accurate scale map of the Museum. The intuitive graphical interface allows visitors to explore the many galleries and spaces in the V&A to discover the amazing objects that are on display, find out about events they might like and where they are happening in the building. It also clearly shows practical information about essential visitor-facilities such as entrances, stairs lifts and ramps, toilets, shops and places to eat.

Evidence for need: designed for the always-on, multi-device consumer world

Here is some background information on the evidence that led us to introduce the Digital Explorer map.

We knew that having traditional web pages for viewing on a desktop had become just one of many options available to our audiences. The evidence from national, international and local data could not be ignored:

• Tablet ownership by UK adults doubled 2012 to 2013 to 24%*
• More than a third of V&A visitors own a tablet device (above national average)+
• One in ten households has more than one tablet*
• Bedrooms, and main TV rooms, are popular locations to use a tablet*
• Main tablet uses – ‘Entertainment’ and (50%) ‘easy access to the internet’ (45%)*

Tablets are clearly viewed as the most enjoyable, convenient way to browse the web for leisure.

* Ofcom. Communications Market Report 2013. 1 August 2013.
http://stakeholders.ofcom.org.uk/binaries/research/cmr/cmr13/2013_UK_CMR.pdf

+ Fusion/Frankly Green and Webb. Understanding the Mobile V&A Visitor: Autumn 2012. Visitor survey, V&A Digital Media and Learning departments. 2012.

http://www.vam.ac.uk/b/blog/digital-media/museum-visitors-using-mobile

Part of an integrated strategy

The Digital Explorer is more than just a standalone app. It is a fully-integrated feature within the overall visitor information experience on the V&A website. The Digital Explorer is a facet within the multi-behavioural journey that visitors take from awareness to discovery to journey to visit.

journey

https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/journey2-300x146.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/journey2-1024x500.jpg 1024w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/journey2-500x244.jpg 500w" sizes="(max-width: 1762px) 100vw, 1762px" /> The Digital Explorer is an integrated part of the V&A’s overall responsive provision for multi-device owning audiences

Create Once, Publish Everywhere in reality

The Digital Explorer is part of the evolution of a 6-year strategy that started with the creation of the ground-breaking V&A Collections API in 2008. This image shows how it fits in. It shows examples of portable digital assets (of furniture objects) being efficiently re-used in multiple service presentations. The same images and authoritative data are displayed in multiple places. The map is really just another behaviour-focussed lens on the collection, responding to the change in social activity, caused by new digital devices.

Create Once, Publish Everywhere - Efficient Digital Asset Management. Two examples of furniture objects' digital records being efficiently re-used as business assets. The same images and authoritative data are displayed in multiple places

Create Once, Publish Everywhere
Data-by-default strategy delivers efficient digital asset management.


Evidence from users

Launching a lovely service is all very well, but what do users think?  The remainder of this submission is a summary of data collected about impact against the objectives we set out to achieve.

We approached this in two ways. Firstly we conducted extensive pre-launch user-testing and feedback over six months, to hear what people told us about the functionality. We gathered 70 qualitative responses which allowed us to improve the experience.

Secondly we designed automated data collection into the Explorer linked to our standard Analytics account to track behaviour post-launch.

Pre-launch user-feedback period

We used an agile build process where we soft-launched the map in an unpublicised working beta version. This allowed us to conduct staff-mediated testing in the V&A galleries. This was done by issuing tablets to Visitor Services staff with the map and a qualitative user-feedback survey loaded. The gallery staff used the Digital Explorer as a working discovery tool for six months helping real visitors to find interesting objects or facilities. We used the visitor feedback to fine tune the beta with a number of changes to the layout as the feedback came in. These included changes to the zooming of text. The user testing period lasted from March 2013 until launch in September 2013. In this time we used the feedback to improve things like menu layouts, wording, colours and size and position of callouts. By launch we felt we had ironed out any glitchy issues and the test users were very positive by this time.

Post-launch behavioural data and analysis

The new service was used more.

In simplistic terms, the Digital Explorer map is used much more than the PDF it supersedes. The graph shows an eight-month period starting from four months before launch (from the left, with PDF only available) to four months after launch. There is clearly a much higher uptake of the new service after launch.statshttps://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/stats-300x75.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/stats-500x126.jpg 500w" sizes="(max-width: 1021px) 100vw, 1021px" />

Use of the Digital Explorer map was nearly three times higher after launch than the PDF map had been in the equivalent previous 4-month period (268%). After launch the PDF was still available on the same page, though there was a tailing off with the Digital Explorer being used more than 6 times as much (+637%). The trend is also clearly showing a steady growth.

However, while this was encouraging, use alone is not really a sufficiently rigorous test of engagement. We also wanted to test if the behaviour of users had changed. Not just how many times they used it, but for how long and in what ways. Specifically, we had an a-priori objective to test: would people engage with it more on tablet devices? We had hoped the data would show this and this turned out to be the case.

The new service was used much more on tablets

The graph below shows use by type of device for all users in the first four months. The orange segment shows a 20% use on a tablet. This is easily the highest proportionate use on tablet of any area of the V&A website. This shows a clear change in user access behaviour towards the primary target device (tablet) and the secondary target device (mobile).

device-proportionshttps://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/device-proportions-300x136.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/device-proportions-500x228.jpg 500w" sizes="(max-width: 828px) 100vw, 828px" />

Audiences spent more time using the Digital Explorer

On all devices, the time spent on the map is noticeable higher than the average overall visit to the site

More specifically, average tablet engagement time rose 58% from 2 min, 24 sec to 3 min 47 sec, mobile engagement time rose 31% from 1 min 34 sec to 2min 03 sec.engagementhttps://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/engagement-300x194.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/engagement-462x300.jpg 462w" sizes="(max-width: 721px) 100vw, 721px" />

Gestural engagement on tablets

As well as standard Google Analytics reporting, the Explorer has additional behavioural tracking built in, linked to analytics. This allowed us to track the number of gesture interactions per use. There is no previous measure to compare against, but the figures for use show that people are not just loading it, they are also engaging with it. The average number of gestures per use of the Digital Explorer was 25 for all devices, rising to more than 30 on tablets.

Simply put, the amount of gestures also increases when people are using the primary target device (tablet).engagementhttps://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/engagement1-300x199.jpg 300w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/engagement1-451x300.jpg 451w" sizes="(max-width: 630px) 100vw, 630px" />

Exposure to collections through active browsing

The map’s built in tracking also showed that on average when using the Explorer, users make seven requests for extra information about specific rooms. When this happens, users are exposed to an average of 12 objects. This means that simply by browsing with gestures, the average user of the service is seeing images of about 80 objects.

Of these people, one in three users also requests extra information about at least one object they browsed. This is evidence that supports the objective of using a pleasurable interface connect people with the collections.

In addition to browsing, one in five used the Digital Explorer search. The top ten search terms were interesting compared to the main site. The fifth most searched for term was “cafe” . Obviously this is about a clear user need on a visit, indicating people are using it as a visit-planning feature too.

Top ten Explorer search terms Top ten search terms on main site
fashion islamic
theatre vivien leigh
Fashion fashion
photography activities
cafe william morris
jewellery pearls
sackler art deco
art deco dress
sackler centre jewellery
textiles toys

Positive social media comments

Comments on social media were positive. The Facebook comment here was especially good:

“Brilliant!! Who’d have ever thought it’s possible to ‘wander ‘ the rooms of the V&A whilst camping in the Australian rainforest!!”

facebookhttps://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/facebook1-175x300.jpg 175w, https://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/facebook1-599x1024.jpg 599w" sizes="(max-width: 768px) 100vw, 768px" /> twitterhttps://mw2014.museumsandtheweb.com/wp-content/uploads/2014/02/twitter1-463x1024.jpg 463w" sizes="(max-width: 594px) 100vw, 594px" />

In conclusion, we believe that the V&A Digital Explorer map is a uniquely innovative use of web technology, combining audience-involvement in developing the user experience, with behavioural data evidence to deliver a genuinely new way to enjoyably discover the V&A on digital devices. We are very pleased that the evidence appears to show a clear positive impact on audiences with greater use, higher dwell time, measurable levels of engagement and positive comments.