Codeply
CodeplyはBootstrapやFoundationなどのRWDに対応したフレームワークをベースに、jQueryやBackbone.js、Underscore.js、Angular.jsなどのライブラリの動作テストも出来るWebサービスです。
左上がjsエリア、右上がCSSと言ったように、jsfiddleっぽい仕様なのに加えてHTMLエリアではコードを書かなくても済むようにナビゲーションやボタン等の汎用的なUIコンポーネントやタグが用意されており、簡単に挿入する事が出来ます。
また、各モバイルデバイスのモニタサイズにリサイズして表示を確認する事も出来ます。ひと通り書いたらロゴの横のRANを押せば表示の確認が出来ます。個人的にはもっとシンプルな方が使いやすくて好みですけど、これはこれでなかなか凄い。
Other Snippets
- レスポンシブWebデザインに対応している各CSSフレームワークや人気のライブラリの動作テストを手軽に行える・「Codeply」
- FoundationやBootstrapを使用しているWebサイト上にグリッドを表示するブックマークレット・「Grid displayer」
- llustratorで作成したAIファイルをHTMLにコンバートするスクリプト・「ai2html」
- emやpx、remなど、CSSで使う単位のサイズを比較出来る・「CSS Ruler」
- Sketchのプラグインやリソースをまとめている・「sketch.land」
- 2色を選んでマテリアルデザイン向けのカラースキームを作成してくれる・「Material Palette」
- ブラウザで使えるモダンデザインなインタラクションデザインツール・「Plexi」
- Webサイトのスタイルガイド作成の為のリソースをまとめている・「Website Style Guide Resources」
- 【 Webデザイン補助 】のリソース一覧