Adobe Live 2015 - レスポンシブサイト制作に効くデザインTipsあれこれ

Takaaki Sugiyama 💉x7 @zinbe

スライドがIllustrator #AdobeLive pic.twitter.com/aAbcgoDLVD

拡大

Takaaki Sugiyama 💉x7 @zinbe

web-3:「レスポンシブサイト制作に効くデザインTipsあれこれ」を受講します。 #AdobeLive

Risa Yuguchi / 湯口りさ @risay

Web-3 の黒野さんの！ #adobeLive pic.twitter.com/q533Onhsr8

拡大

yuuki/yuma @chocodoughnut

Psでプレゼンしてる・・・！ #adobelive

鹿野 壮 Takeshi Kano @tonkotsuboy_com

crema designの黒野 明子氏による「レスポンシブサイト制作に効くデザインTipsあれこれ」を受講します。 #AdobeLive pic.twitter.com/8vQ4aMIz7d

拡大

鹿野 壮 Takeshi Kano @tonkotsuboy_com

Q.レスポンシブWebデザインのサイト作ったことありますか？ A.会場の7割ほどが挙手 #AdobeLive

今村かずき @kaizumaki

Photoshop CCのアートボード良さそうだな。 #AdobeLive

鹿野 壮 Takeshi Kano @tonkotsuboy_com

Ethan Marcotte氏の定義によると、レスポンシブWebデザインは以下で定義される。 1. フレキシブルなグリッド 2. フレキシブルな画像 3. メディアクリの使用 #AdobeLive pic.twitter.com/Ax02WnQpfd

拡大

izuizu@🍓*⋆✈︎山本和泉 @izuizu

みっつめはE会場でくれまちゃんのレスポンシブなお話に参加 #AdobeLive

鹿野 壮 Takeshi Kano @tonkotsuboy_com

黒野さんのプレゼン資料は、Illustratorのアートボードです。初めて見たｗ #AdobeLive pic.twitter.com/WgpGKKmD1b

拡大

鹿野 壮 Takeshi Kano @tonkotsuboy_com

Q. Photoshopのアートボード機能を使っている人は？ A. 会場の１割ほどが挙手。 あれ、意外に使われていないのですね。まだ認知度が低いのかな #AdobeLive

Takaaki Sugiyama 💉x7 @zinbe

今日のデモでは480pxをブレイクポイントにして、モバイル向けとそれ以外でデザインを分ける。Photoshopのアートボードを使う。 #AdobeLive

沖 良矢｜世路庵 @448jp

黒野さん、やっぱ声と滑舌がいいから聞きやすいんだなー。内容はもちろんよいこと前提で。 #AdobeLive

Takaaki Sugiyama 💉x7 @zinbe

12グリッドをベースにしてデザインする。12は2/3/4でそれぞれ割り切れるので、いりいろな幅のグリッドが作りやすい。 #AdobeLive

鹿野 壮 Takeshi Kano @tonkotsuboy_com

BootStrapのレスポンシブWebデザインで採用されている12グリッドのデザイン。 #AdobeLive pic.twitter.com/B9LHstyEGI

拡大

鹿野 壮 Takeshi Kano @tonkotsuboy_com

黒野さんセッション、画面右から時々ぴょんぴょんするiTunesアイコンが気になるｗ #AdobeLive

大須賀 淳(スタジオねこやなぎ) @jun_oosuga

黒野明子さんのセッション。内容の素晴らしさはもちろん、パワポやKeynoteではなくIllustratorでスライドを出しているのが萌えポイント！ #AdobeLive pic.twitter.com/HNsKAp0Wnw

拡大

鹿野 壮 Takeshi Kano @tonkotsuboy_com

「新規ガイドレイアウトの作成」 12グリッドデザインのためのガイドを自動で計算している。便利ですね。 #AdobeLive pic.twitter.com/ZxNN34JcwR

拡大

Takaaki Sugiyama 💉x7 @zinbe

1200pxの幅に対して、マージン付きで12カラムのガイドを設定する。「新規ガイドレイアウトの作成」機能で簡単に作れる。 #AdobeLive

yuuki/yuma @chocodoughnut

デザインってああやって作ってるんだ #adobelive

今村かずき @kaizumaki

コンポーネント機能ってPhotoshop CCからなの？ #AdobeLive

沖 良矢｜世路庵 @448jp

ドラッグ＆ドロップをくれまさん語で翻訳すると「引きずり出す」。うん、直訳に近いし間違ってない！ #AdobeLive

Takaaki Sugiyama 💉x7 @zinbe

コンポーネント作成のポイント。1カラムでも成立するデザインにしておく。カラム数が変わっても問題ないように。 #AdobeLive

鹿野 壮 Takeshi Kano @tonkotsuboy_com

まさか、コンポーネントの横幅を縮めたら自動でコンポーネント内のレイアウトがよしなに変わるのか？と思ったら、そんなわけはありませんでしたw #AdobeLive pic.twitter.com/10otmdhvZZ

拡大

北村たあ @tah_timing

くろのさんのれすぽんすぶ！！ 満員す！ #AdobeLive pic.twitter.com/X4zBAwdzbp

拡大