CSS Nite in Osaka, vol.45「All About XD」 w/YATのblog

CSS Nite in Osaka @cssnite_osaka

画像はそのまま配置もできますが、あらかじめ用意したオブジェクトでマスクすることもできます。#cssnite #AdobeXD

ヒロ @hiro2

マスクが簡単だー #cssnite

けんじ / UX Designer @kenji_clown5

矩形オブジェクトに画像をドラッグアンドドロップで自動的にマスクされるの、ダブルクリックで位置調整できるようになったのは便利な反面、調整後はマスクから外れることもあるので注意。 #cssnite

けんじ / UX Designer @kenji_clown5

リピートグリッドに画像やテキストをドラッグアンドドロップして一度に流し込むのは「初めてのXD」には鉄板デモ。 #cssnite

CSS Nite in Osaka @cssnite_osaka

リピートグリッドで用意していた枠に、フォルダーから画像やテキストをドラッグすると一気に変えることができます。「おぉ…」「すごい…」という声が色んなところから聞こえます。 #cssnite #AdobeXD

CSS Nite in Osaka @cssnite_osaka

リピートグリッドを応用すると、ストライプも作れちゃいます。#cssnite #AdobeXD

けんじ / UX Designer @kenji_clown5

XDのぼかし効果は使い易くて便利ですが、多用するとさすがに重くなります。 #cssnite

深沢幸治郎｜ウェブデザイナー・UIデザイナー @kojirofukazawa

斜線パターンみたいなものもリピートグリッドでやっちゃうのね…。確かに間隔の調整・色や形の変更につよいデータになるな。これはすてきな工夫。 #cssnite

CSS Nite in Osaka @cssnite_osaka

背景のぼかしですりガラスのような表現ができます。helpx.adobe.com/jp/xd/help/bac… #cssnite #AdobeXD

みゆっこ @miyucco

XD、思ってた以上に、デザイン処理的なこともできるんだね #cssnite

けんじ / UX Designer @kenji_clown5

リピートグリッドで細かい斜線をリピートして網掛けレイヤーみたいなの作ろうと思ったけどめっちゃ重くなったので断念した・・ #cssnite

CSS Nite in Osaka @cssnite_osaka

Behanceからwiresをダウンロード→必要な部分だけ残す→色や画像、テキストをカスタマイズ #cssnite ＃AdobeXD

けんじ / UX Designer @kenji_clown5

栄前田さんのWires jpへの伏線が続々とw #cssnite

3panda@🐼Scrum Master🐼 @3panda

ちょっとWebの人に戻りつつあるのでCSS Nite のハッシュタグは追っておこうー

深沢幸治郎｜ウェブデザイナー・UIデザイナー @kojirofukazawa

お、やってみたらリピードグリッドもシンボル化できた。 なるほど、使えそう。 #cssnite

CSS Nite in Osaka @cssnite_osaka

今回のセッションでは基礎的なことをお話ししていきましたが、次ではさらに踏み込んだ内容にはいります！休憩中に素材をダウンロードしておいてくださいね♪ #cssnite #AdobeXD

CSS Nite in Osaka @cssnite_osaka

デザイン制作、クライアントとのやりとりもスムーズになり時短！ #cssnite #AdobeXD pic.twitter.com/kTCU0jzrFk

拡大

CSS Nite in Osaka @cssnite_osaka

(プロトタイプを見せちゃうと、動くものだからクライアントさんに完成したと思われがち。あくまで見本ですよと言っておくのもポイントです) #cssnite #AdobeXD

みゆっこ @miyucco

今日はどういう層が参加してるんだろな？？？ #cssnite

深沢幸治郎｜ウェブデザイナー・UIデザイナー @kojirofukazawa

XDは当時さらに機能が少なかったのでもう1時間とかからず把握できました。今でも2時間もかからないんじゃないだろうか #cssnite

CSS Nite in Osaka @cssnite_osaka

会場後方ではかっこいいTシャツがスペシャルプライスで販売されていますよ！サイズはS、M、L、XL、XXL！ #cssnite ＃AdobeXD pic.twitter.com/cnQOwK9AMI

拡大

CSS Nite in Osaka @cssnite_osaka

おやつたくさんありますよー！#cssnite

CSS Nite @cssnite

田中ラオウさんのカリカチュア：本日の登壇者バージョン #cssnite pic.twitter.com/X4grHt9yPI

拡大

ﾀｹﾉｺ@とある書店の自然科学担当 @child_takenoko

CSSNiteたのすぃ～！休憩終わりだぁ #cssnite #adobeXD

CSS Nite in Osaka @cssnite_osaka

わからない！こういうときはどうすれば？聞きたいことがあればお気軽に、#cssnite #質問 のハッシュタグをつけてツイートしてくださいね♪