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

大量の入力を一気にさせようと思うとユーザは引いてしまうものです。そこでちょっとずつ、段階を踏まえて入力してもらうとスムーズにいくことがあります。ウィザード形式の入力はまさにそうです。

Fort.jsを使うとWeb上でも同じような入力ができるようになります。いつになったら終わるのかも分かるのでユーザストレスの低い入力操作ができるようになるでしょう。

Fort.jsの使い方

例です。画面上部にある薄い線がステータスを表しています。
例です。画面上部にある薄い線がステータスを表しています。

最後までいくとバーが右端までいきます。
最後までいくとバーが右端までいきます。

進み具合によって色を変えることもできます。
進み具合によって色を変えることもできます。

完了すれば青になります。
完了すれば青になります。

段階ごとに色を変えることもできます。
段階ごとに色を変えることもできます。

ステータスをスタイリッシュに表現しています。Eコマースでは決済情報、送付先、請求先など細かく入力したりすることがあるので、Fort.jsを使って状態がわかるようになると良いかも知れません。YouTubeなどでも画面上部のステータスバーは使われるようになっていますので、この先も活用法が見つかるかも知れませんね。

Fort.jsはJavaScript製のオープンソース・ソフトウェア(MIT License)です。

Colourity/Fort.js

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2