When money is an object

When money *is* an object


What I am going cover:

• Strategy and planning• Prototyping and testing• Ideas and tools

John Benfield, Head of Digital Media, RSC


• John Benfield• Former Creative Head of Interactive Media at

the Natural History Museum• Online projects from…




The Beast of Bodmin Moor

Cost: Nothing

Team:2: one contentone coder

To…



Ice Station Antarctica

Cost: £300k gallery£60k online

Team: 10 in-house30+ externals4 web externals


• Now Head of Digital Media at the Royal Shakespeare Company

• Site redesign






• Site redesign


• 20 cross department authors• Regular video trailers and features




• Such Tweet Sorrow• New mobile site for the World Shakespeare

Festival



• Site redesign• 20 cross department authors• Regular video trailers and features





What I have been really lucky to have is…



What I hope I am not going to do



1. You should be strategic in your approach2. Content is king3. You all have fascinating stories to tell4. There is nothing to stop your web presence

from being compelling and timely

Before I start, a few truths…



1. Masses of cash2. Ability to code in PHP, C++ or Actionscript 33. Consultants or expensive digital agencies

What you don’t need…

What you do need…1. Imagination2. Lateral thinking3. Google



Strategy and planning:1. Write a content strategy – make digital

integral not special2. Audiences: know who they are and do your

profiles





Strategy and planning:

1. Write a content strategy – make digital integral not special

2. Audiences: know who they are and do your profiles

3. Think about the user-journey4. Always write a simple brief:

Aims and objectives | Audience | Resources | Timescales



Strategy and planning: Do your analytics:• Unique visitors• Unique pageviews• Above for individual sections• Search terms• Repeat visits• Mobile vs static• Exit and entry points• Filters and Boolean search• Report it monthly



Prototyping and testing:

You don’t need UX and IA consultants or expensive user labs



Prototyping and testing:1. Information architecture– Card sorting or post-it notes– Mindmapping – Freemind





Prototyping and testing:1. Information architecture– Card sorting or post-it notes– Mindmapping – Freemind

2. Wireframing– Powerpoint– Pencil project





Prototyping and testing:1. Do user testing2. Keep it simple

1. One area for testing2. 4-5 users

3. Do it regularly4. Buy this…





Prototyping and testing:1. User testing2. Keep it simple– One area of test1. 4-5 users

3. Do it regularly4. Buy this…5. Try A/B testing using Google’s tool6. Submit to www.fivesecondtest.com

http://www.fivesecondtest.com/



Just a few ideas:

You will need – • A bit of lateral thinking• Basic ability to understand CSS, HTML• Ability to follow instructions – for JQuery• Regular search for ‘cool’, ‘new’, ‘best’ Jquery



Just a few ideas: Timelines



http://www.bbc.co.uk/history/interactive/timelines/british/index_embed.shtml





Just a few ideas: Timelines

• Can get the same effect using image slideshows• 100s of example scripts available• Lightbox | Gallerific | prettyPhoto |Highslide.js• Can find many variations and sophistications• Can be simple timelines or used to tell a story

or virtual galleries



Highslide.jshttp://highslide.com/

http://highslide.com/

http://highslide.com/



Just a few ideas: Fun with imagemaps

• Old technology, hardly ever used now• Great for interpreting spaces or objects• Virtual walk-throughs (when applied to 360

images)



http://www.cssplay.co.uk/menu/old_master.html





http://www.cssplay.co.uk/menu/scrollmap.html





Just a few ideas: Page turners

• Original Turning The Pages by the BM• Many examples – search ‘flipbooks’ or ‘page

turn jquery’• All you need are either images or PDFs• Issuu – free if you don’t mind the ads• Virtual brochures but also as way of telling

stories



http://www.rsc.org.uk/whats-on/list.aspx



Just a few ideas: Zooming images

• Original Zoomify – costs money• Great for interpreting objects or spaces in detail• Search for ‘jquery zoom image’



http://www.nhm.ac.uk/kids-only/dinosaurs/who-was-oviraptor/oviraptor-zoomify/index.html





JQzoom

http://www.mind-projects.it/projects/jqzoom/demos.php





Ideas: video

• Massive increase in online consumption• High impact way of imparting lots of

information• Now relatively cheap• Basic cameras with HD capabilities



Ideas: video • Guided tours (welcomes or explanations)• Features• Latest news• Talking head interviews



http://www.rsc.org.uk/explore/60-seconds/blood.aspx





Ideas: videoYou need:• HD camera and tripod• Invest in– an editable start/end slate– name straps– separate mic

• Edit software – simple, free, online– YouTube editor |Movie Maker | iMovie |

Creazaeducation



Ideas: Fun with YouTube • Linking videos• Telling a story • Interactive application – decision-based

multichoice



http://www.youtube.com/watch?v=1i5Tv6Oc0Wk







Just a few ideas: fun with QR codes



Just a few ideas: fun with QR codes

• Go beyond basic links to your site

Try:• Discover hidden secrets – treasure hunts• Real-world or virtual trails• Enhanced gallery displays• Promotions and incentives



Ideas: Free Flash

Even though Flash may have had its day, places like Flashkit have resources you can use for free

• Games | Puzzles | Word quizzes• Old versions of Flash still work (and cheap)• Require only basic ability to code



http://www.flashkit.com/movies/Games/Components/Simple_j-John_Ben-1302/index.php





More ideas:

Blogs• Plenty of platforms from Wordpress to Tumblr• Great for driving repeat visits• Make site current

Social media• Embedded Twitter – makes site look current• Using Facebook API for commenting• Pinterest for exhibtions and galleries• Storify – creating narratives out of social media posts

http://www.rsc.org.uk/whats-on/the-taming-of-the-shrew/

https://developers.facebook.com/docs/reference/plugins/comments/



A final biggy: Go mobile

• Check your stats for percentage mobile traffic• Create an IA based on core info/function for

on-the-go users• Basic CSS / HTML required• Big buttons, small graphics• Clear permalink to full site

[email protected]@rsc.org.uk@il_gatto_morto

Technology

When money *is* an object

When money is an object