awesome-repositories.com
Blog
MCP
awesome-repositories.com

Discover the best open-source repositories with AI-powered search.

ExploreCurated searchesOpen-source alternativesSelf-hosted softwareBlogSitemap
ProjectMCP serverAboutHow we rankPress
LegalPrivacyTerms
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
HubSpot avatar

HubSpot/shepherd

0
View on GitHub↗
13,737 stars·652 forks·JavaScript·12 viewsshepherdjs.dev↗

Shepherd

Shepherd is an interactive product tour framework and JavaScript onboarding library used to build step-by-step instructional journeys. It serves as a web application guidance tool that presents sequences of instructional overlays to help users navigate interfaces and discover features.

The library enables the creation of guided user tours, onboarding experiences, and interactive application guides. It is used to provide contextual in-app education and drive product feature adoption by leading users through specific workflows.

The framework utilizes configuration-driven tour definitions and a sequential state machine to track user progress. It employs DOM-element anchoring and coordinate-based positioning to bind tooltips to specific HTML elements, while using overlay-based focus masking to highlight focal points.

Features

  • Onboarding and Walkthroughs - A JavaScript library specifically designed for creating guided tours and user onboarding flows.
  • Tour State Management - Tracks the current step index and user progress to trigger transitions in a predefined walkthrough sequence.
  • Guided Tour Components - Provides interactive overlays that highlight UI elements for step-by-step user onboarding.
  • In-App User Education - Provides contextual in-app assistance and tutorials to reduce the learning curve for a software interface.
  • Interactive UI Overlays - Provides interactive UI overlays that highlight specific elements to teach complex tasks.
  • Product Tour Libraries - Functions as a comprehensive library for building interactive, multi-step product walkthroughs.
  • Tour Step Orchestrators - Manages the sequential progression of a guided tour based on user interaction events.
  • Web Applications - Provides a client-side utility for presenting sequences of instructional overlays to drive product adoption.
  • Coordinate-Based Position Calculators - Implements logic to calculate viewport coordinates for precise placement of instructional overlays.
  • Focus Masking - Renders a semi-transparent layer to highlight a single element while disabling interaction with the rest of the UI.
  • Feature Adoption Tours - Leads existing users through specific workflows to increase usage of new or underutilized features.
  • Guided Tour Construction Tools - Provides a system for authoring and configuring guided tours via declarative data objects.
  • Element Anchoring - Binds instructional tooltips to specific HTML elements using CSS selectors to ensure correct positioning.
  • Guided Tours - Guided application walkthroughs.
  • User Tours and Guides - App tour and guidance library.

Star history

Star history chart for hubspot/shepherdStar history chart for hubspot/shepherd

How this analysis was created: This summary and feature list are AI-generated from collected project material and can contain mistakes. Stars, license and language are imported from GitHub. Inclusion does not mean that we have tested or audited this project. Check the source documentation for any feature you depend on. Learn more on our About page.

AI search

Explore more awesome repositories

Describe what you need in plain English — the AI ranks thousands of curated open-source projects by relevance.

Start searching with AI

Frequently asked questions

What does hubspot/shepherd do?

Shepherd is an interactive product tour framework and JavaScript onboarding library used to build step-by-step instructional journeys. It serves as a web application guidance tool that presents sequences of instructional overlays to help users navigate interfaces and discover features.

What are the main features of hubspot/shepherd?

The main features of hubspot/shepherd are: Onboarding and Walkthroughs, Tour State Management, Guided Tour Components, In-App User Education, Interactive UI Overlays, Product Tour Libraries, Tour Step Orchestrators, Web Applications.

Which projects share features with hubspot/shepherd?

Projects with overlapping indexed features include: gilbarbara/react-joyride — react-joyride is a user onboarding library for React applications used to create interactive guided tours and… usablica/intro.js — Intro.js is a JavaScript onboarding tour library and web interface guide framework. It functions as an interactive… sorich87/bootstrap-tour — bootstrap-tour is a product tour library designed to create guided walkthroughs for websites using the Bootstrap… shipshapecode/shepherd — Shepherd is a client-side onboarding framework and interactive product tour library used to create step-by-step guided… linkedinattic/hopscotch — Hopscotch is a guided onboarding framework and JavaScript tour engine designed to create step-by-step user… linkedin/hopscotch — Hopscotch is a JavaScript library and framework for creating interactive product tours and user onboarding guides. It…

Projects sharing features with Shepherd

These projects share indexed features with Shepherd. Shared tags can include platform or build tooling; verify the primary use case before treating a result as a replacement.
  • gilbarbara/react-joyridegilbarbara avatar

    gilbarbara/react-joyride

    7,588View on GitHub↗

    react-joyride is a user onboarding library for React applications used to create interactive guided tours and walkthroughs. It provides a framework for defining sequences of tooltips and beacons that highlight specific user interface elements to introduce users to application features. The library distinguishes itself through a programmatic controller that allows developers to manage tour state, navigation, and lifecycle events via external application logic. It supports a high degree of visual extensibility, allowing the replacement of default tooltips and beacons with custom components to m

    TypeScriptjoyridereactreact-component
    View on GitHub↗7,588
  • usablica/intro.jsusablica avatar

    usablica/intro.js

    23,478View on GitHub↗

    Intro.js is a JavaScript onboarding tour library and web interface guide framework. It functions as an interactive product walkthrough tool that uses tooltips and highlights to explain software features to users. The library enables the creation of guided onboarding tours, interactive product tours, and step-by-step walkthroughs. These tools facilitate software feature discovery and provide application interface guidance to help users navigate layouts. The system manages the user experience through sequenced step orchestration, coordinate-based tooltip positioning, and DOM-based element high

    TypeScript
    View on GitHub↗23,478
  • sorich87/bootstrap-toursorich87 avatar

    sorich87/bootstrap-tour

    4,411View on GitHub↗

    bootstrap-tour is a product tour library designed to create guided walkthroughs for websites using the Bootstrap framework. It functions as an interactive UI tool that uses a sequence of popover hints to highlight specific page elements and lead users through a workflow. The system coordinates guided experiences across multiple pages by mapping tour steps to unique URLs. It maintains user progress through local storage persistence, ensuring tours resume at the correct step after a page refresh. The library includes programmatic controls to start, pause, resume, or skip steps, and supports au

    CoffeeScript
    View on GitHub↗4,411
  • shipshapecode/shepherdshipshapecode avatar

    shipshapecode/shepherd

    13,741View on GitHub↗

    Shepherd is a client-side onboarding framework and interactive product tour library used to create step-by-step guided walkthroughs. It functions as a UI guided tour system and DOM element highlighting tool that displays instructional overlays and tooltips to guide users through a web application interface. The system features a dynamic layout engine for anchoring tooltips to target elements and preventing screen overflow. It supports multi-element highlighting to draw attention to several UI components simultaneously and includes focus trapping to restrict keyboard navigation to active tour

    JavaScripthacktoberfestshepherdtour
    View on GitHub↗13,741
  • Compare all 30 related projects→