ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Bootstro.jsはBootstrapを使ったWebサイトにチュートリアル機能を提供するライブラリです。

Bootstrapを使ったWebサイトを作って、そこにチュートリアルによる説明を追加したいならば使って欲しいのがBootstro.jsです。カスタマイズも対応した素敵なチュートリアルが実現します。


チュートリアル開始です。ここで終わることも次に進むこともできます。


説明の出る場所は上下左右にできるようです。


表示場所は適切に設定されます。


キーボードショートカットにも対応しています。

Bootstro.jsはタイトル、説明文、幅、ステップなどをdata-*として指定します。また、次のステップや終わらせた場合などのイベントに合わせて別なコードを実行することもできます。サイズは3.0KB程度で軽量なのも魅力です。

Bootstro.jsはJavaScript製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。


MOONGIFTはこう見る

Webアプリケーションではその使い方をチュートリアルできちんと説明する方が良いとされています。最近ではローカルアプリケーションでもチュートリアルを提供することが増えています。昔はTips程度だったので随分とユーザビリティが上がってきているようです。

恐らくスマートフォンアプリが増えたのがその背景にあると思われます。いずれにせよチュートリアルを通じてユーザが迷うことなく操作できるようにしてあげるのはユーザ離れや隠れた不満を解消するのに役立つはずです。積極的に取り入れていくべきです。

Bootstro.js Bootstrap Intro.js

clu3/bootstro.js · GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2