Bootstrapベースのサイトに素敵なチュートリアルを「Bootstro.js」
Bootstro.jsはBootstrapを使ったWebサイトにチュートリアル機能を提供するライブラリです。
Bootstrapを使ったWebサイトを作って、そこにチュートリアルによる説明を追加したいならば使って欲しいのがBootstro.jsです。カスタマイズも対応した素敵なチュートリアルが実現します。
[](http://images.moongift.jp/2013/03/Screenshot 2013-03-19 12.14.13.1363700022.png)
チュートリアル開始です。ここで終わることも次に進むこともできます。
[](http://images.moongift.jp/2013/03/Screenshot 2013-03-19 12.14.20.1363700026.png)
説明の出る場所は上下左右にできるようです。
[](http://images.moongift.jp/2013/03/Screenshot 2013-03-19 12.14.29.1363700030.png)
表示場所は適切に設定されます。
[](http://images.moongift.jp/2013/03/Screenshot 2013-03-19 12.14.38.1363700033.png)
キーボードショートカットにも対応しています。
Bootstro.jsはタイトル、説明文、幅、ステップなどをdata-*として指定します。また、次のステップや終わらせた場合などのイベントに合わせて別なコードを実行することもできます。サイズは3.0KB程度で軽量なのも魅力です。
Bootstro.jsはJavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。
MOONGIFTはこう見る
Webアプリケーションではその使い方をチュートリアルできちんと説明する方が良いとされています。最近ではローカルアプリケーションでもチュートリアルを提供することが増えています。昔はTips程度だったので随分とユーザビリティが上がってきているようです。
恐らくスマートフォンアプリが増えたのがその背景にあると思われます。いずれにせよチュートリアルを通じてユーザが迷うことなく操作できるようにしてあげるのはユーザ離れや隠れた不満を解消するのに役立つはずです。積極的に取り入れていくべきです。