36
Walkthrough Madness An introduction to all the amazing things you can do with Walkthroughs follow along at: http://goo.gl/Fe6kMe

Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Embed Size (px)

DESCRIPTION

Imagine you could send your users a hyperlink that starts up a step by step walkthrough tutorial for pretty much any process they want to do on your site. Imagine you could embed those links into your documentation or even in a special contextual help block you display on your site. Imagine further that you can record how a feature works that you have just developed, or that your customer could send you a link to a walkthrough that reproduces a bug they've found. That is exactly what you can do with the WalkHub Drupal module. Writing documentation is probably one of the least favorite things developers do, but If you don't do it, you end up spending your time giving support on ridiculously simple issues instead. When we do documentation most of us spend hours and hours pasting screenshots into Google docs, then the theme or pictures change... With Walkthrough.it you can add a documentation layer on top of your website. You can play tutorials that guide people through your site, step by step. It's like a GPS for your website. And the best part is: you can use community tutorials and easily share and collaborate on common scenarios. In this session you will learn how you can record Walkthrough tutorials using Selenium IDE, an open source plugin for Firefox. How you can then edit them, share them and incorporate them into your website. I will also show how you can use Walkthroughs to create fairly complex scripts for repetitive tasks.

Citation preview

Page 1: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Walkthrough MadnessAn introduction to all the amazing things you

can do with Walkthroughs

follow along at:http://goo.gl/Fe6kMe

Page 2: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Pronovix

Page 3: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Tours: the new big thing

Page 4: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 5: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 6: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 7: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 8: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Raised $ 11’567

Page 9: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 10: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Why all the hype?

Page 11: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Video tutorials● Interactive● Lots of context● Visual

Text tutorials● Editable● Searchable● Comment-able● Translatable

Traditional options

Page 12: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 13: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Common issues

● Visuals change● Hard to keep up to date

● The 2 windows issue● Require interpretation

=> DOUBT

=> COGNITIVE LOAD

Page 14: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Tours are in place and

up to date

Page 15: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 16: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

The real problem withDocumentation is...

Page 17: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

$ ?!?

Page 18: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Reminds me off...

Page 19: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Feature testing has this same problem

Page 20: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

it has a few more problems...

Page 21: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 22: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 23: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

But seriously, how do we pay for this?

Page 24: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Tests

Documentation

Demo

Script to test if it still works

Script to explain how it works

Script to show that it works=

=

=

Page 25: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub
Page 26: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

So what if we could combine these 3 into 1?

Page 27: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

verifiableTests

up-to-dateDocumentation

AutomatedDemo

Walkthrough

Page 28: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

+ +

=

Page 29: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

How?

Page 30: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

● Play a walkthrough

● Creating Walkthroughs○ from Selenium

● Creating steps○ Step highlight

○ Selenium command

Demo

Page 31: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

● Adjusting Walkthroughs○ Adding steps

○ Changing step order

● Parameters

○ Share a link with parameters

○ Adding Parameters

Demo

Page 32: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

You want to buy a WalkHub?

Page 33: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

You CAN’T

Page 34: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

It’s Open Source

you can support our work though :)

Page 35: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

sign up: eepurl.com/uYjy9

Follow us: @WalkHub

Contact us: [email protected]

Page 36: Walkthrough madness: an introduction to all the amazing things you can do with a WalkHub

Media sources● http://upload.wikimedia.

org/wikipedia/commons/0/0a/Prague_Astronomical_Clock%2C_Prague_Orloj_picture-005.JPG

● http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/MiniHouseOfCards.jpg/800px-MiniHouseOfCards.jpg

● http://upload.wikimedia.org/wikipedia/commons/thumb/6/60/Box_Elder_bugs.jpg/800px-Box_Elder_bugs.jpg

● http://commons.wikimedia.org/wiki/File:Obsolete_road_and_sign_-_geograph.org.uk_-_450380.jpg

● http://upload.wikimedia.org/wikipedia/commons/thumb/7/7a/Line3174_-_Shipping_Containers_at_the_terminal_at_Port_Elizabeth%2C_New_Jersey_-_NOAA.jpg/800px-Line3174_-_Shipping_Containers_at_the_terminal_at_Port_Elizabeth%2C_New_Jersey_-_NOAA.jpg

● http://commons.wikimedia.org/wiki/File:Saved_(Boston_Public_Library).jpg