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

BroshoはjQuery/JavaScript製のオープンソース・ソフトウェア。WebサイトのデザインはWebブラウザを使って微調整を行わないと分からない部分が多い。特にシステムがらみで実際にデータを当ててみないとどうなるか分からない時はそうだ。


Screen-shot 11.png

その場でCSSを修正して確認できる

 

実際にデータベースのデータを入れてみて調整する場合、FirefoxであればFirebugを使えば楽だろうが、それ以外のブラウザではどうだろう。そうした時に便利なのがBroshoだ。

BroshoはjQueryプラグインとして提供される。読み込むと画面の下にフローティングウィンドウが表示されるようになる。場所は画面の上下左右に移動させることが可能だ。そしてマウスでDOMを指定してCSS設定を追加することができる。


Screen-shot 12.png

生成されたCSS

 

追加された設定はリアルタイムに反映されるので、分かりやすい。修正が終わったらGenerateボタンを押せばCSSが生成される。なおIEやOperaではテストされていないようなので注意してほしい。Webデザイナーにとって便利なソフトウェアになりそうだ。

 

Use jQuery - Blog - Brosho 'Design in the Browser' jQuery Plugin

 http://usejquery.com/posts/8/brosho-design-in-the-browser-jquery-plugin

mustardamus's brosho-plugin at master - GitHub

 http://github.com/mustardamus/brosho-plugin

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2