Gamification in Service Portal (Knowledge18 CreatorCon)

Introduction

Thanks for attending our Knowledge18 CreatorCon Session. During this session, NewRocket showcased a scoped Gamification application that is available to download free here:

 

NOTE It is required that your version of ServiceNow is running Jakarta or later. This scoped app is not supported on Istanbul or earlier.

Components

  • GamificationAPI (Script Include) – Contains the application logic
  • Activities (Table)
  • Badges (Table)
  • Levels (Table)
  • User Badges (Table)
  • User Activities (Table)
  • Gamer (Table)
  • Gamification Points & Badges (Widget)
  • Gamification Event Listener (Widget)
  • Gamification Examples (Widget)
  • Gamification (Page)
  • Driver.js (Widget Dependency)
    • GamificationDriver (UI Script)
    • GamificationTourConfig (UI Script)
    • GamificationDriver (CSS Include)

Installation

  1. Install & commit the Update Set
  2. Navigate to your portal theme record (e.g. Stock)
  3. Inside the Header or Footer, embed the Gamification Event Listener widget using the folllowing code:
    <widget id=”gamification-event-listener”></widget>
  4. Navigate to the gamification portal page (e.g. /sp?id=gamification)
  5. Click Award Points
  6. If all has been successful, you should be rewarded with 100 points

Included Examples

  • Feature Tour (using Driver.js Library)
  • Social Q&A

Configuration

Includes “Gamification for Service Portal” Application Menu with the following Modules:

  • Activities – The activities users complete to earn points
  • Badges – Badges are earned based on accomplishments
  • Gamers – An extension of sys_user, stores user points
  • Levels – The levels users can obtain based on number of points

To configure the Driver.js Feature Tour, edit the GamificationTourConfig UI Script.

screen-shot-2018-05-22-at-8-25-09-pm

Corrections – (6/13/18)

  • The GamificationAPI Script Include needs “Accessible from” set to “All application scopes”
  • The documentation incorrectly lists the app prefix as “x_nero_gamificatio”, however it should be “x_nero_gamificati”

Additional documentation has been provided on the Gamification portal page (/sp?id=gamification).

For more information on the Driver.js library, check out the docs here: https://kamranahmed.info/driver

5 comments

  1. Love it, easy to install – just a couple questions: the badge icons don’t appear, gives a broken picture icon and the points don’t show up until I refresh…any easy fixes to this? The icons are in the badges table…thanks!!

  2. Hi Nathan, I think Social Q&A example requires more information like changing the GamificationAPI script include to Accessible from – All application scopes.
    Also, the following needs to be changed as well for me to work.
    var api = new x_nero_gamificatio.GamificationAPI(); to
    var api = new x_nero_gamificati.GamificationAPI();
    Thanks.

  3. Hi Nathan,

    Couldn’t get this to work (Jakarta). Application committed with no issues.

    1. Changed the Accessible from on the Script Include ‘GamificationAPI’ so it is ‘All application scopes’
    2. Alterered the line in the Widget that was incorrect to ‘var api = new x_nero_gamificati.GamificationAPI();’
    3. is firmly in my header record in use.

    Any ideas?

Leave a Reply

Your email address will not be published. Required fields are marked *