レスポンシブWebデザインのモックアップが手軽に作れるサービス「FROONT」
レスポンシブなウェブサイトを簡単作成
FROONTはレスポンシブなウェブサイトを簡単に作成できるサービスです。
レスポンシブなサイトのモックを作るときに便利そうです。
ドラッグ&ドロップで絵を描くようにしてサイトを作っていくだけ。
その場でウィンドウサイズを変えたときの表示の変化も確認できます。
作成したモックのHTML, CSSはダウンロード可能です。
以下に使ってみた様子を載せておきます。
レスポンシブなサイトのモックを作るときに便利そうです。
ドラッグ&ドロップで絵を描くようにしてサイトを作っていくだけ。
その場でウィンドウサイズを変えたときの表示の変化も確認できます。
作成したモックのHTML, CSSはダウンロード可能です。
以下に使ってみた様子を載せておきます。
レスポンシブなサイトを作る
まず「FROONT」にアクセスしましょう。
利用するには無料登録が必要です。すぐに終わるので登録してみましょう。
こちらが作成画面。
左側にコンテンツのメニューがあります。
画像をいれたり枠をいれたり。
右側はそのコンテンツの詳細メニューですね。
最上部にウィンドウサイズを切り替えられるバーがあります。
先ほどのデザインをスマートフォン用のサイズにすると、上記のようにデザインが変わりました。
レスポンシブデザインの確認が容易にできるのは嬉しいですね。
最後にHTMLとCSSをダウンロードして完了です。
レスポンシブデザインのモック作成などに活用してみましょう!
利用するには無料登録が必要です。すぐに終わるので登録してみましょう。
こちらが作成画面。
左側にコンテンツのメニューがあります。
画像をいれたり枠をいれたり。
右側はそのコンテンツの詳細メニューですね。
最上部にウィンドウサイズを切り替えられるバーがあります。
先ほどのデザインをスマートフォン用のサイズにすると、上記のようにデザインが変わりました。
レスポンシブデザインの確認が容易にできるのは嬉しいですね。
最後にHTMLとCSSをダウンロードして完了です。
レスポンシブデザインのモック作成などに活用してみましょう!
本記事で紹介したサイト
この記事をみた人はこんな記事も見ています
前後の記事もどうぞ
この記事をブックマーク/共有する
トラックバックURL
このブログを購読しますか?
FeedlyなどのRSSリーダーを使うと、このブログの更新情報をいち早くキャッチできます。このブログのRSS(http://20kaido.com/index.rdf)を登録すれば、更新されるたびに概要(記事タイトル・冒頭)が手に入ります。
また、Twitterによる更新情報の配信もおこなっております。
@20kaido をフォローしていただければ最新の情報をお届けします。
さらに、Facebookでも更新情報を流しています。ファンページがありますので、「いいね!」するだけで購読できますよ!
また、Twitterによる更新情報の配信もおこなっております。
@20kaido をフォローしていただければ最新の情報をお届けします。
さらに、Facebookでも更新情報を流しています。ファンページがありますので、「いいね!」するだけで購読できますよ!
管理人へ連絡する
・メール
20kaido@gmail.com
・Twitter
@kamekiti
・お問い合わせフォーム
http://ws.formzu.net/fgen/S70651833/
何か気になることがありましたら、お気軽にご連絡ください。
20kaido@gmail.com
@kamekiti
・お問い合わせフォーム
http://ws.formzu.net/fgen/S70651833/
何か気になることがありましたら、お気軽にご連絡ください。
記事公開日:2013年05月12日 コメント(0)
Twitterの声
はてなブックマークの声
Facebookの声
この記事についたコメント
コメントする