Creating a how-to guide with the Tango plugin in Chrome

Google

  1. 1. Getting Tango

    Tango is a free plugin for Google Chrome that lets you create how-to guides by recording each step as you work through a process in the browser. You can install it from https://chrome.google.com/webstore/detail/tango-screenshots-trainin/lggdbpblkekjjbobadliahffoaobaknh

    Getting Tango

Monash

  1. 2. Start your Tango session with the toolbar button

    Click the Capture Workflow button to begin recording

    Start your Tango session with the toolbar button
  2. 3. Start the normal steps of the process that you want to create a guide for

    Note the Tango icon in the top left corner and the green tick in the bottom left

    Start the normal steps of the process that you want to create a guide for
  3. 4. Click on MEI3001 - Advanced MEIing

    Tango will now take a screenshot every time you interact with the page and create a basic text description of what you have done

    Click on MEI3001 - Advanced MEIing
  4. 5. Click on Turn editing on

    It will also highlight any buttons that you press

    Click on Turn editing on
  5. 6. Click on …

    Tango can't always describe what you have done, so there is some editing required afterwards. 

    Click on …
  6. 7. When you have finished the process, click the green arrow in the bottom left

    When you have finished the process, click the green arrow in the bottom left
  7. 8. This will take you to the editing screen for your guide

    Here you can edit the auto-generated descriptions for each step and edit or change the screenshots if needed. 

    This will take you to the editing screen for your guide
  8. 9. You can also insert additional steps as required by click the + button

    This is particularly useful for capturing instructions about using non-browser software. It requires manual creation and editing of screenshots though. 

    You can also insert additional steps as required by click the + button
  9. 10. You can then drag and drop next steps around in the table of contents

    You can then drag and drop next steps around in the table of contents
  10. 11. Like so

    Like so

Google

  1. 12. When the guide is complete, you can either share it as an interactive webpage

    When the guide is complete, you can either share it as an interactive webpage
  2. 13. Or Download a PDF version

    Please note that there is a watermark on each image if using the free version

    Or Download a PDF version