Adobe、レスポンシブなWEBサイトを視覚的にデザインすることが出来る「Adobe Edge Reflow」のプレビュー版を公開 無償で利用可能

2013.2.16

EdgeReflowProject*_-_Edge_Reflow

AdobeがレスポンシブなWEBサイトを簡単にデザイン出来るようにするツール、Adobe Edge Reflow」のプレビュー版を公開しました。Adobe Creative Cloud会員(無料会員でもOK)なら無償でダウンロードし使用することをが可能です。

レスポンシブデザインはこのブログでも採用していますが、ブラウザの幅によってデザインが変化するデザインです。これを一からCSSで書いていくのはなかなか骨が折れる作業なのですが、このEdge Reflowを使うとある程度視覚にデザインしていくことが可能です。

EdgeReflowProject*_-_Edge_Reflow-2

上記のスクリーンキャプチャはこのブログのデザインを元にして、試しに書いて見たものです。上にあるバー(480とか768とか書いてある部分)が基点となる横幅になります。このブログだとフルサイズの横幅は900pxでデザインしていますが、ブラウザがそれ以下の幅しかない場合、768px〜900pxの間は768px、480px〜768pxの間は480px、480px以下なら100%指定としています。

これをCSSで書いてアップロードしてブラウザで表示、実際にブラウザの横幅を変更して確認……ということをすると手間がかかってしかたがないんのですが、Edge Reflowなら右端のバーをずらして横幅を変えることで、表示確認を行うことが可能です。

EdgeReflowProject_preview.html

また、Chrome限定のようですが、実際にブラウザでの表示確認も行えます。

残念ながらプレビュー版ということでHTMLやCSSのソースの書き出しなどを行うことが出来ず、単にデザインの確認に使えるだけなのですが、Chromeで表示させたあと、Developper toolでCSSファイルを抜き出すことも可能なのでかなりの手間を省くことが出来そうです。

(source Adobe)

タグ: , ,

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

HUAWEI nova liteの安いけどおススメのケース ケースで迷ってたらとりあえず買って損はしない

現在一押しのミドルクラス端末、HUAWEI nova liteのケースを購入してみました。 買ったのは、NILLKINというブランドのケース。 TopAce Huawei Nova Lite 専用ケー

ウェアラブル翻訳機「ili」を持って台湾に行こう! ログバーがiliのモニターを募集中

話した言葉を瞬時に翻訳してくれる旅行に特化したウェアラブル翻訳機「ili」が、モニターを募集をしています。 関連:話した言葉を瞬時に翻訳!ウェアラブル翻訳機「ili(イリー)」は海外旅行をもっと身近に

あなたの一票でシリーズ化! Amazonがオリジナル作品でシリーズ化してほしいものを選ぶアンケート調査を実施中

Amazonプライムビデオで、日本未公開のAmazonオリジナル作品のパイロット版(第1話)を観て、今後その続きを観たい(シリーズ化してほしい)と思った作品を選ぶというアンケート調査を行っています。

Android O Developer Preview 1をNexus 5Xに焼いてみた 今のところ違いはよくわからない

公開されたAndroid Oの開発者プレビュー1を早速Nexus 5Xに入れてみました。正直なところ、新機能についてはまだ実感できないというか、対応しているアプリがないので試せてはいないのですが、なん

Prime Musicを聴くだけ! 抽選で5,000円のAmazonギフト券が当たるキャンペーンがスタート

AmazonがPrime Musicを聞くと2000名に5000円のAmazonギフト券が当たるというキャンペーンを開催しています。 プライム会員限定のキャンペーンですが、無料期間中でも参加OKとなっ

スマホの画面をテレビに出力できるMiracast(ミラキャスト)の使い方

スマホの画面をテレビに出力できるMiracast(ミラキャスト)の使い方

名前だけは聞いたことはあるものの、使っている、活用しているという話をあまり聞かないMiracast(ミラキャスト)、どんなものかと思って実際に使ってみました。 ...

HUAWEI nova liteのコスパは異常 同価格帯の端末では競合がいない

HUAWEI nova liteのコスパは異常 同価格帯の端末では競合がいない

HUAWEIが若者向けのシリーズとしてあらたに投入したのnova、その下位モデルという位置づけのnova liteを購入してみました。 nova liteは公式ショップや量販店では販売しておらず、...

HUAWEI P10 lite発表 スペックはnova liteよりもやや上で価格は約3万5000円

HUAWEI P10 lite発表 スペックはnova liteよりもやや上で価格は約3万5000円

HUAWEIがMWCで発表したフラッグシップ、P10/P10 Plusに続き、廉価版となるP10 liteを発表しました(ただし、HUAWEIのサイト上では確認できず、画像やスペックはGSMAre...

Androidを搭載したVAIO Phone A発表 24800円で4月7日発売

Androidを搭載したVAIO Phone A発表 24800円で4月7日発売

VAIOはWindows 10 mobileを搭載したVAIO Phone Bizを発売中ですが、同じ筐体にAndroidを搭載したVAIO Phone Aを発表しました。 発売は4月7日。VAI...

HUAWEI nova liteの安いけどおススメのケース ケースで迷ってたらとりあえず買って損はしない

HUAWEI nova liteの安いけどおススメのケース ケースで迷ってたらとりあえず買って損はしない

現在一押しのミドルクラス端末、HUAWEI nova liteのケースを購入してみました。 買ったのは、NILLKINというブランドのケース。 ...

MENU

back to top