bruck - コーディングベースのプロトタイプシステム // MOONGIFT Archived

Webサイトのプロトタイプを作成する際には、こだわり過ぎないくらいのデザインに留めておくのが大事です。文字の大きさや画像の内容など、本来関係ない部分までデザインしてしまうと余計な議論に繋がりかねません。そこで使ってみたいのがbruckです。HTMLタグベースでプロトタイプをさくさくと作れます。

bruckの使い方

左側がエディタ、右側にプロトタイプが描かれます。Webコンポーネントベースになっています。

パラメータを変更すれば、内容が即座に反映されます。

画像部分の大きさを変更するのも簡単です。

bruckは専用のタグさえ覚えてしまえばプロトタイプをコーディングベースでどんどん作成できます。ミーティングをしながら、その場で反映するのも問題なくできるでしょう。常に同じ結果ではなく、テキストの区切り部分が異なるのも面白いです。

技術的にはHoudini Paint API（CSSペイントAPI）が使われており、Google Chromeなどでしか動きません。そういった技術的なチャレンジにも注目です。

bruckはJavaScript製のオープンソース・ソフトウェア（ISC License）です。