How to Use KILES Leaderboard

A comprehensive guide to using KILES Leaderboard application, from creating an account to displaying live scores during your training sessions.

📚Table of Contents
🚀Getting Started

KILES Leaderboard is a real-time scoring system designed to gamify your training sessions. It allows facilitators to input scores instantly and participants to watch the leaderboard update live.

What You'll Need

  • •A modern web browser (Chrome, Firefox, Safari, Edge)
  • •Internet connection
  • •Email address for registration
👤Registration & Login

Creating an Account

  1. 1.Navigate to the application homepage
  2. 2.Click the "Register" link at the bottom of the login form
  3. 3.Fill in the registration form:
    • Username: Your display name (minimum 2 characters)
    • Email: A valid email address
    • Password: At least 6 characters
  4. 4.Click "Register" to create your account
  5. 5.You may need to verify your email address before proceeding

Logging In

  1. 1.On the homepage, enter your username or email and password
  2. 2.Click "Create Your Leaderboard Now" to log in
  3. 3.You will be redirected to your dashboard
⚙️Creating a Session

After logging in, you will land on the dashboard where you can create new leaderboard sessions.

Step 1: Start a New Session

  1. 1.Click the "Create New Session" button on the dashboard
  2. 2.You will be taken to the Leaderboard Configuration page

Step 2: General Settings

  • •Session Name: Give your session a descriptive name (e.g., "Team Building Quiz 2024")
  • •Number of Rounds: Use the slider to select 1-10 rounds

Step 3: Team Settings

  • •Default Teams: The system starts with "Team 1" and "Team 2"
  • •Add Teams: Click "Add Team" to add more teams (up to 8 total)
  • •Remove Teams: Click "Remove Team" to delete the last team (minimum 2 teams required)
  • •Team Names: Click on any team name field to customize it
  • •Team Colors: Each team gets a unique color automatically assigned

Step 4: Appearance

  • •Theme Selection: Choose between Light and Dark themes
  • •Light theme: Clean, bright interface
  • •Dark theme: Easier on the eyes in dim environments
  • •This affects both input and display screens

Step 5: Save Configuration

  • •Click "Save and Next" to proceed to round configuration
  • •The system will save your session settings and redirect you
🎯Configuring Rounds

In this step, you will define the correct answers and scoring for each round.

Round Configuration Basics

  • •Each round has its own configuration card
  • •You must configure at least one answer for each round
  • •The number of rounds matches what you selected in the previous step

Setting Up Answers

For each round:

  1. 1.Right Answer: Enter the correct answer text
  2. 2.Score for Each Right Answer: Assign points for this answer (minimum 1 point)
  3. 3.Add Multiple Answers: Click "Add answer" to include multiple correct answers with different point values
  4. 4.Remove Answers: Click the delete icon to remove an answer (minimum 1 answer required)

Example Configuration

For a quiz round:

  • •Answer: "Paris" | Points: 10
  • •Answer: "Eiffel Tower" | Points: 5 (bonus answer)

Navigation

  • •Back: Return to the previous configuration step
  • •Create Leaderboard: Save all round configurations and proceed to sharing
🔗Sharing Access

After configuring your rounds, you will receive access links and QR codes for two different interfaces.

Two Access Types

  • 1.Input Page: For facilitators to enter scores in real-time
  • 2.Display Page: For participants to view the live leaderboard

Sharing Options

  • •QR Codes: Scan with mobile devices for quick access
  • •Direct Links: Copy and share via email, chat, or presentation
  • •Open Buttons: Test pages yourself before sharing

Access URLs Format

  • •Input Page: https://your-domain.com/s/[session-id]/input
  • •Display Page: https://your-domain.com/s/[session-id]/display

Copying Links

  1. 1.Click the copy icon next to each URL
  2. 2.A "Copied!" confirmation will appear briefly
  3. 3.Share the links with your participants and co-facilitators
📝Using the Input Page

The input page is where facilitators enter scores during the live session.

Interface Overview

  • •Header: Shows the current round number and session name
  • •Team Cards: Each team has its own input card
  • •Navigation Controls: Move between rounds and reset functionality

Entering Scores

  1. 1.Select the current round using navigation buttons
  2. 2.For each team:
    • Type the answer in the "Answer" field
    • Press Enter or click outside the field to submit
    • The system automatically validates and scores the answer
  3. 3.Visual Feedback:
    • Correct answers show awarded points
    • Total scores update in real-time
    • Answered teams are marked to prevent duplicate entries

Navigation Controls

  • •Prev Round: Move to the previous round (disabled on Round 1)
  • •Reset Round: Clear all scores for the current round (with confirmation)
  • •Next Round: Move to the next round or jump to the display page on the final round
💡

Pro Tip

Consider using two devices during your session - one for input and one for display to provide the best experience for both facilitators and participants.

🏆Displaying the Leaderboard

The display page shows the live leaderboard to participants.

Display Features

  • •Session Header: Shows the session name and current status
  • •Team Rankings: Teams are automatically sorted by total score (highest first)
  • •Score Animation: Numbers animate when they change
  • •Trophy Icons: Gold, silver, and bronze trophies for top 3 teams
  • •Round Breakdown: Shows each team's score per round at the bottom

Visual Design

  • •Responsive Layout: Adapts to different screen sizes
  • •Theme Consistency: Uses the theme selected during session creation
  • •Card-based Display: Each team has its own card with color-coded elements

Real-time Updates

  • •The leaderboard refreshes automatically when scores are entered
  • •No manual refresh needed - updates happen within seconds
  • •Works on multiple devices simultaneously
📋Managing Sessions

From your dashboard, you can manage all your created sessions.

Session List

  • •Session Names: All your created sessions are listed
  • •Creation Dates: Shows when each session was created
  • •Quick Actions: Buttons for each session's management options

Session Actions

  1. 1.Share Access: Get input and display links/QR codes again
  2. 2.Configure Session: Edit session settings (teams, rounds, etc.)
  3. 3.Delete Session: Permanently remove a session (with confirmation)

Creating Multiple Sessions

  • •You can create multiple sessions for different events
  • •Each session has its own unique ID and configuration
  • •Sessions are independent and don't share data
💡Tips & Best Practices

Session Preparation

  • •Test your session with sample data before going live
  • •Prepare all questions and answers in advance
  • •Have a backup device ready for score input

During the Session

  • •Double-check scores before submitting to avoid errors
  • •Keep the display screen visible to participants at all times
  • •Announce round transitions to maintain engagement

Technical Tips

  • •Ensure stable internet connection for real-time updates
  • •Use dark theme for better visibility in bright rooms
  • •Bookmark input and display pages for quick access
🎯

Pro Tip

Consider having a co-facilitator manage the leaderboard while you focus on presenting the content. This division of labor ensures smooth score updates and maintains audience engagement.