こんにちは、Livesense Advent Calendar 2014 14日目です。
皆さん、年末用のゲームはもう決めましたか？
おすすめはDragon Age InquistionとMETRO Reduxです。
日々要件が変わっていくアンケートフォーム
今年は業務ツールを作り続ける1年でした。
自分の所属する事業部では日々クライアント様やユーザ様の使い勝手や精度向上のために電話やメール等によるヒアリングを行っています。
と、なるとヒアリング内容をDBに入力するような作業が発生します。
もちろんこの項目は日々ブラッシュアップされていく訳で
新しくこういう項目を入力する場所が欲しいとか、逆にアレはもういらないとか発生します。
その度「じゃあ来季スプリントで検討しますのでチケットを作って下さい！ リリース？ まぁ見てて下さい。 来月の頭にはなんとかしますよ！！」では現場のスピード感的にも合いません。
「リリースされるまではメモ欄に隅括弧で〜」みたいなパワフルな運用が行われてしまいます。
JSON Form
https://github.com/joshfire/jsonform
JSON Formはjson schemaを渡すとフォームを生成してくれるjQuery pluginです。
angularjsと連携したangular-schema-formなんてのもあります。
動作サンプルはangularのコレなんかがわかりやすいと思います。
<script type="text/javascript" src="deps/jquery.min.js"></script>
<script type="text/javascript" src="deps/underscore.js"></script>
<script type="text/javascript" src="deps/opt/jsv.js"></script>
<script type="text/javascript" src="lib/jsonform.js"></script>
<script type="text/javascript">
$('form').jsonForm({
schema: {
name: {
type: 'string',
title: 'Name',
required: true
},
age: {
type: 'number',
title: 'Age'
}
}
});
</script>
上の例ではこんなフォームができるわけですね
ちゃんとNameはrequiredだし、Ageは数字じゃないとバリデートされます。
よし！あとは適当なデータからjsonさえ生成できればOKだ
ドキュメントを見ればinput:text以外のプルダウンやらチェックボックスやらテキストエリアやらなんでも作れることがわかります。
あとはもう楽勝ですね。
「クライアントへのヒアリング内容を保存するフォームに『使い勝手はどうでしたか？』という項目を追加したいです。
プルダウン形式で『未回答』『よい』『ふつう』『わるい』を選択できるようにして下さい」
みたいな依頼もこんな風に入力して、
それをいい感じにjson schemaに変換して
question1: {
title: "使い勝手はどうでしたか？",
type: "string",
enum: [
"未回答",
"良い",
"普通",
"悪い"
]
}
jsonformに食わせたらこんなformが表示されます。
この「フォームの項目が増える程度でコードを触る必要ないだろ？ schemaはデータだ」感が素敵です。
とはいえ問題も結構……
jsなので悪意を持って弄くられたらどうにもなりません。
あと、上の例だとバリデーションがされてません。
細かく設定しようと思うと項目を追加するフォームをごちゃごちゃさせるか、
もしくは項目を追加する人がjson schemaを書ける必要があるのでお手軽運用できるか微妙です。
更に、DB schemaとJSON schemaはもちろん対応してないのでデータの保存はkeyvalueとかスキーマレスな感じになってしまいます。
結局分析する時に大変だったりして……、それ、SurveyMonkeyでいいんじゃないか……。
スピードが重要だったり項目がコロコロ変わる場合などで、社内で限定的に使う分にはお手軽でよいなぁーと思ってます。
時間があればちゃんと作った方が良いですね。