Successfully reported this slideshow.

Prototyping the digital university



Upcoming SlideShare
LEC Orientation
LEC Orientation
Loading in …3
1 of 61
1 of 61

Prototyping the digital university



Download to read offline

Slides for talk on "Prototyping the digital university" given By Chris Scott and Anja Hazebroek, at the IWMW 2016 event on 21-23 June 2016.

Slides for talk on "Prototyping the digital university" given By Chris Scott and Anja Hazebroek, at the IWMW 2016 event on 21-23 June 2016.

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

Prototyping the digital university

  1. 1. DigitalUniversity Chris Scott | Headscape Anja Hazebroek | University of Hull
  2. 2. Freedom to experiment
  3. 3. Disruption
  4. 4. Collaboration
  5. 5. Testing
  6. 6. Learning
  7. 7. Prioritisation
  8. 8. Selling
  9. 9. Confidence
  10. 10. 2014 at the University of Hull • Out of control website • Obsolete, unsupported CMS • 1,000s of pages of out of date and duplicate content • No overall editorial control • Departments doing crazy stuff – FTP access • Website outage during clearing • Stalled CMS procurement project • Web team overwhelmed by firefighting
  11. 11. • Disrupt business as usual • Kick-start building a vision for the future • Experiment with designing for user journeys • Convince senior management • Convince University staff • Engage with users • Inform the CMS procurement process
  12. 12. Communicate a vision of future student digital experiences Motivate an agenda for transforming how the University “does” digital
  13. 13. Six prototyping success factors
  14. 14. Visual fidelity Interactivity Tools Team Process Life cycle
  15. 15. Visual fidelity
  16. 16. Interactivity
  17. 17. Tools
  18. 18. Interactivity
  19. 19. Content types Display logic Taxonomies Relationships Menus Breadcrumbs URL structures Content workflows
  20. 20. Team
  21. 21. • Start with the web team • Content people • UX designer - wireframe “live” • CMS developer - build on the CMS “near-live” • Someone to critique at end-of-day reviews • Someone to facilitate
  22. 22. What about “business” specialists?
  23. 23. Working environment
  24. 24. Process
  25. 25. Dedicatedsession Preparation Declining momentum Planned follow-up activity Workintensity Time
  26. 26. Workintensity Time
  27. 27. Life cycle
  28. 28. Wins
  29. 29. Confidence in user-centric design approach
  30. 30. Reusable processes and tools for user-centric design
  31. 31. Ideas “brought to life” for stakeholders
  32. 32. User validation of some key features
  33. 33. “How would we achieve X,Y, Z, …?” questions for CMS vendors
  34. 34. Lessons
  35. 35. Minimise the gaps between prototyping sessions
  36. 36. Document prototype evolution and decisions
  37. 37. Make time to train editors adding content to the CMS
  38. 38. CMS-based prototyping – not “real-time”, but worth it
  39. 39. So, to conclude…
  40. 40. Experiment Disrupt Collaborate Test Learn Prioritise Sell Be confident
  42. 42. Thank you

Editor's Notes

    Chris and I will share some of our experiences of prototyping so that hopefully you can expand how you plan and do it.
    We’ll talk about two scenarios at different ends of the prototyping spectrum – mainly one at the University of Hull and but also some comparisons with another at the University of Edinburgh.
    So what does prototyping offer us?
    Here are some possibilities…

    Freedom to experiment. Freedom to do things that don’t work and to discover that they don’t work without a high cost.
  • Disrupt how you are thinking. Break away from the legacy of what’s in place right now.
  • Get your team working together – talking together, solving problems together, listening to new ideas, evaluating ideas.
  • Test early. Get users to interact with tangible representations of your ideas early on in the design cycle.
  • Learn as you do. Learn as you test. Learn as you iterate.

    Getting to know the strengths and weaknesses of your team. Expertise and skill gaps.
  • Figure out design priorities.
  • Communicate your ideas in a clear and tangible way. Sell your ideas to stakeholders.
  • The process of prototyping is a confidence builder.

    Let’s look at the case of the University of Hull and where we were back in 2014…

    What about objections? What might people – especially those you are asking to fund prototyping – object to? Here are some…
  • Of course you might encounter some objections when you try to start prototyping.
    Let’s look at just a few…
  • Your are not going to throw the ideas away.
    Freedom. Speed. Creativity. All the things I’ve just mentioned.
  • We’ll cover genuine emergencies. Everything else we’ll schedule or reschedule.
    Need to get a sense of the right priorities.
    The future should be the priority.
  • Go for it if you can.
    Confidence? Disruption? Kick-start? Independent input to get you out of conventional thinking?

    Now let’s look at the University of Hull. Let’s go back to 2014 – before they started prototyping – and set the scene…
  • Who needed to be convinced about the way forward? Key people…

    Anja Hazebroek, Director of Marketing & Communications
    David Richards, Pro-VC for Research and Enterprise


    Edinburgh’s aims were different to Hull’s.

    Build an evidence-base for change – interviews with students, videos of students trying to accomplish tasks and discussions with front line student support people.
    Communicate a picture of how a transformed student digital experience could look and work.
  • Planning for prototyping. What do you need to think about?

    Here are six factors on my checklist…
  • Let’s look at each of these.
  • How accurate or precise do you need the visual aspects of the prototype to be?
  • Example using Balsamiq
  • Example using Axure
  • Alpha prototype built on Drupal
  • At Edinburgh the focus was on how things might look.
    This isn’t a working thing. It’s pure mockup – but based on design patterns from Edinburgh’s global experience language.
  • This is where Edinburgh is now on mobile for some of its key digital services.
  • This is how applying the University’s GEL to those services might look
  • The next factor is interactivity…

    Do you need your prototype to support user interactions?
  • At Hull interactivity of the prototype was really important.
    The web team needed to understand how website support for user journeys actually worked.
    They needed the confidence to be able to show colleagues.
    They also needed to be able to test with users.
  • So we implemented working features like megamenus, navigation, breadcrumbs, related links, …

    And we gave editors a place where they could add and structure content and join things together to build a working site.
  • For Edinburgh, what was important was the SHOW.
    This is all in Powerpoint, so only the presenter can interact and then there’s only one interaction supported on this screen.
  • Be taken to this
  • And then this.
  • How are you going to construct your prototype?

    Plenty of options

    Here’s what we used for Hull…
  • Plenty of options

    Here’s what we used for Hull…
  • Hull

    And here’s what we used for Edinburgh…
  • Edinburgh

    With Silverback to capture videos of interviews.

    So, why choose to build a prototype using a CMS at Hull?
  • Interactivity for both frontend and backend users.
  • You are starting to build up the experiences that users will encounter as they use the site, editors will encounter as they build a site, developers as they construct a site and UX designers as they design.

    The web team is building confidence as it builds a prototype.
    So who do you need for the team?
  • These can be all in-house.
    The more in-house the better the learning.
    Fill in the gaps from outside.

    Edinburgh’s prototype needed a team of two and a lot of interviewees.
  • Great if you can get them.

    BUT in my experience university web teams have a huge amount of knowledge so you don’t necessarily need to pull in business specialists to do useful prototyping.
  • It’s really important to protect the team from interruptions when you are trying to work in short intensive bursts.

    You might not need to survive a nuclear attack, but you might need to take shelter from interruptions.

    One or two of you might be old enough to remember this government information booklet from about 1980 – how to survive a nuclear attack.
  • This really is how the government recommended – maybe still recommends – how we should survive a nuclear attack.
  • Anyway, what we actually did was not to build a shelter from a desk and some doors, but get the Hull team off campus to the lovely Mercure Hull Grange Park hotel…
    Cakes were exemplary.
    Everyone needed to go on a diet after 4 days here.
  • We worked in short bursts.
    Fitting around commitments and escaping from day-to-day demands for a few days at a time.

    Something like this…
  • This is for the first session.

    What actually happened was that it was hard to sustain the follow-up. This is a challenge.

    Over a few months the allocation of effort looked something like this…
  • Doing it again, we’d definitely seek to shorten the cycle to reduce the loss of momentum between sessions.

    Let’s look quickly at a typical session agenda…
  • What are you going to use the prototype for?
    Facilitate discussions with stakeholders.
    User testing.

    Have some objectives before you start.
  • User testing
    Great to be able to get users to compare what’s there now with the new ideas.
  • Edinburgh approach is about selling the idea – exposing issues with current student digital experiences and showing how a new approach to digital might look and work. Edinburgh is gaining ground with

    OK, so let’s look at some of the wins we experienced at Hull…

  • e.g. Subjects megamenu
    Presentation of course options
    Links to teaching staff
    Module-level details
  • Anja to speak to these?
  • If you want to do any or all of these as you create your digital services and products…
  • ×