Научите посетителей вашего сайта покупать
с навигатором интерфейсов Experrto
Выберите категорию

28 бесплатных плагинов для создания руководств по продукту

Когда вы имеете дело с веб-приложением или сайтом, который нуждается в небольшом обучении для пользователей, вам стоит использовать пошаговые руководства и туры по продукту. Сегодня мы рассмотрим 28 полезных плагинов, позволяющих создавать такие инструкции.

1. Intro.js

Intro.js

Этот простой и быстрый javascript-плагин позволяет создавать пошаговые введения для сайтов, приложений и функций.

2. Website Tour with jQuery

Website Tour with jQuery

Это небольшой скрипт, предназначенный для создания онлайн-туров на сайтах с помощью jQuery. Он может вам пригодиться, если вы хотите объяснить пользователям функционал вашего приложения интерактивным образом.

3. JQuery joyride feature tour plugin

JQuery joyride feature tour plugin

Joyride — это чрезвычайно гибкий плагин, который позволяет вам контролировать то, как пользователь взаимодействует с вашим туром.

4. Bootstro.js

Bootstro.js

Bootstro.js — это крохотная JS-библиотека, которая помогает направлять пользователей в рамках тура по продукту за счет всплывающих окон bootstrap.

5. JQuery myTour plugin

JQuery myTour plugin

Mytour — это простой плагин, который используется для создания интерактивного визуального тура по сайту, позволяющего посетителям изучать возможности и функции вашего продукта.

6. Crumble

Crumble

Crumble позволяет легко и быстро создавать функциональные туры для сайтов или приложений с помощью небольших «пузырьков». Такие сообщения привлекают внимание, но чтобы они оставались читабельными, их нужно заполнять как можно более кратким текстом.

7. Trip.js

Trip.js

Trip.js — это плагин, который может помочь вам сделать ваше учебное руководство более гибким. Сейчас он поддерживает множество полезных возможностей, таких как бинды для клавиатуры, анимации, изменение тем и т. д.

8. FAQtoid

FAQtoid

FAQtoid — это простая универсальная help-система для вашего сайта или приложения. Она помогает уменьшить затраты на клиентскую поддержку, предоставляя посетителям инструменты для решения их проблем.

  • FAQ с live-поиском — пользователи видят ответы по мере ввода запроса;
  • Туры — проводят пользователей по элементам каждой страницы;
  • Видеогалерея — пользователи могут смотреть видео, оставаясь на странице, которая в нем поясняется;
  • Умная email-форма — обрабатывает нежелательные сообщения. Автоматически включает подробную информацию о вашем пользователе, о том, что они пытались сделать, и любых ошибках на странице.

9. JQuery Tour Bus

JQuery Tour Bus

Это плагин для разработчиков, позволяющий создавать онлайн-туры. Он весьма ограничен в плане автоматизации и больше походит на набор инструментов.

10. Feature Walkthrough

Feature Walkthrough

Это JS-плагин для добавления пошагового руководства на веб-странице. В настройках вы можете выбрать позиционирование сообщений: слева, справа, вверху или внизу от элемента, который описывается. Для размещения элемента справа/слева вам нужно указать ширину, вверху/внизу — высоту.

11. Chaperone.js

Chaperone.js

Chaperone — это простой плагин, позволяющий создавать экскурсии по сайту. Подобно Joyride он использует список элементов и проводит пользователей по ним с помощью сообщений.

12. Hopscotch

Hopscotch

Hopscotch — это фреймворк, который позволяет разработчикам без особых усилий добавлять туры на страницы своего сайта. Hopscotch использует JSON объекты в качестве входных данных и предоставляет вам API для управления отображением тура и его прогрессом.

13. Pageguide.js

Pageguide.js

Pageguide.js — интерактивное визуальное руководство для элементов веб-страниц. Вместо того чтобы загромождать ваш интерфейс статическими вспомогательными сообщениями или пояснительным текстом, добавьте на сайт Pageguide и позвольте вашим пользователям изучать новые возможности и функции.

14. aSimple Tour Plugin

aSimple Tour Plugin

В то время как всплывающая панель aSimple Tour Plugin позволяют управлять туром, подсказки, которые могут размещаться где угодно, помогают вам фокусироваться на элементах сайта.

15. Bootstrap Tour

Bootstrap Tour

Этот плагин проводит пользователей по сервису с помощью всплывающих окон Bootstrap и отличается гибкими настройками.

16. TourTip – jQuery Overlay Tour

TourTip – jQuery Overlay Tour

TourTip — это простая библиотека для создания туров по сложным одностраничным веб-приложениям. Она дает вам возможность настраивать шаги процесса таким образом, чтобы переходы между ними выполнялись не только спустя несколько секунд, но и после того, как пользователь завершит поставленную задачу.

17. JQuery Tour

JQuery Tour

С помощью этого плагина вы можете создавать отличные туры по продукту. Если вы попросите пользователя выполнить конкретное действие, прежде чем он перейдет к следующему шагу, JQuery Tour автоматически скроет все второстепенные элементы страницы.

18. Website tours with jQuery UI

Website tours with jQuery UI

Этот плагин позволяет вам разрабатывать туры по сайтам за счет инструментов для экспонирования и аннотации элементов на веб-страницах. При необходимости процесс можно автоматизировать.

19. Bon Vojage

Bon Vojage

Bon Vojage — это крохотный JQuery плагин, с помощью которого вы сможете создать простейший тур по сайту.

20. ddTour

ddTour

Это несложное решение для онлайн-туров, которое было создано Дэвидом Дэвисом (David Davis).

  • В отличие от других плагинов, здесь ваш код находится в одном месте. Всплывающая подсказка появляется именно там, где у вас есть ее описание.
  • Перемещайтесь к любому элементу с помощью обозначенного селектора класса.

21. Quicktour.js

Quicktour.js

Quicktour.js использует итеративный цикл, чтобы выделять элементы тура в том порядке, в котором вы их добавляете. На затененной странице появляется рамка с заголовком (если он указан), и пользователь продолжает выполнять процесс с каждым кликом.

22. LightsOff.js

LightsOff.js

«Легкий» плагин (всего 6 кб), который позволяет создавать отличные настраиваемые пояснения к различным элементам веб-страницы.

23. Usertour.js

Usertour.js

Этот jQuery виджет подходит для веб-приложений, которые хотят предоставить своим пользователям пошаговое руководство.

24. VTour.js

VTour.js

Эта библиотека используется для создания пошаговых инструкций для страниц сайта и его функций.

25. jQuery-guide

jQuery-guide

jQuery-guide позволяет объяснять пользователям новые макеты и функции, подсвечивая важные элементы страницы на затененном фоне.

26. Concierge

Concierge

Еще один плагин, которые создает пошаговые инструкции для различных элементов страницы. 

27. Anno.js

Anno.js

Этот плагин также используется для создания эффективных руководств к мощным веб-приложениям.

28. EnjoyHint

EnjoyHint

Это бесплатный веб-инструмент, который помогает пользователям ориентироваться на сайте легко и интуитивно. Он позволяет вам создавать интерактивные туториалы с подсказками и внедрять их в приложение, тем самым улучшая его юзабилити и эффективность.

Делайте бизнес на основе данных!

По материалам: ninodezign.com

Научите посетителей вашего сайта покупать
с навигатором интерфейсов Experrto