Adobe Xd勉強会 inセブ島 参加レポート!

こんにちは、びび(@vivilog_)です!

2019年12月8日、セブ島で初のAdobe Xdオンライン勉強会が開催されました!

最近Cocoda!というサイトなどでXDを使ってUIデザインを集中的に勉強している私にとって、これ以上ないイベント・・・!

首を長ーくしてこの日を待ちわびておりました〜!

今回は、そのイベントレポートを簡単にですがまとめたいと思います。

参考UIを勉強するために実践したことと便利なサイト10選!

Adobe Xd勉強会inセブ島 イベント内容

イベントの内容はこちらです。

講演#1:「僕がXDに魅了されたワケ」
中井誠也(なかい・せいや)
Adobe XD ユーザーグループ広島 代表
———–
講演#2:「XDでウェブ制作、基本的な使い方」
田中 由花(Tantan)(たなか・ゆか)
ウェブ制作会社にてパート勤務 / フリーランスWebデザイナー
———–
講演#3:「基本からプラグイン活用まで。120%リピートグリッドを活用して強いデザインを作ろう」
湯口 りさ(ゆぐち・りさ)
Adobe Community Evangelist
———–
講演#4:「XDゲームで学ぶアニメーションとトリガーのポイント〜圧縮版〜(仮)」
北村 崇(きたむら・たかし)
popIn株式会社デザイナー / フリーランスデザイナー / Adobe Community Evangelist
———–
飛び込みLT(各5m) ※決定分のみ
「こんなところで使えるの?!XD活用法」
神守 由理子(かみーゆ)(かみもり・ゆりこ)
NexSeed エンジニア講師 / フロントエンドエンジニア「踏み込めないあなたにお届けする XDの踏み込み方」
やんこ
iaiデザイナー /AdobeXDユーザーグループ広島運営スタッフ

「XDでウェブ共同開発チーム作り・プロジェクト事例」
柳谷 武(やなぎや・たけし)
デザイナー

Facebookページからお借りしました。

4部構成で、LTまで盛り込まれた欲張りプログラムです。

実は当日勉強会を受けるまでプログラムをよく確認していなかったので、当日盛りだくさんすぎて少し驚きました😂

#1:僕がXDに魅了されたワケ

1人目は中井さんの講演です。

XDを使っている、XDが好き!と周りに言っているとXDの講演をしてほしいとお願いされるまでになったよ!というお話でした。

発信することや、自分の好きなもの・得意なものを周りに伝えることの大事さが改めてよく分かるお話ですね。

話は少し逸れますが、私は最近はUIデザインを重点的に学んでおりまして・・・!

毎日あるお題に対してUIデザインをAdobe Xdで作る『Daily Cocoda!』というプログラムを毎日続けてツイッターで報告しているのですが、最近は周りの方に『デザイン出来るんだね!』と言われることが多くなりました。

そこから頂いたお仕事のお話や人とお会い出来る機会も増えたので、発信・継続は大事だなあと本当に身をもって感じております。

参考Cocoda!:デザイナーへのパスポート

よければ上記のアカウントもフォローしてくださいね✨


#2:XDでウェブ制作、基本的な使い方

登壇者はTantanさん。

XDで出来ることを、基本操作含めて10つのステップでご紹介して下さりました!

その時のスライドを公開して頂いたので、よければ見てみてください!

参考XDでウェブ制作の基本的な使い方

個人的には、この講義の内容が一番期待していた内容だったので、とても勉強になりました。

XDを使ってデザインしていたものの、まだ使いこなせていない機能やテクニックがたくさんあって、さらにXDが好きになりました。

特に#7のコンポーネントの保存からの一括編集や、#10のホバーアクションの動きを再現できるのは本当にすごい!

目からウロコなものばかりでとっても勉強になりました。

ただ1つだけワガママを言うなら、参加者側も一緒に操作して操作方法を確認できたらもっとよかったな、と思いました😢

1人約20分と時間が限られているため、紹介だけで終わってしまったのと、最後はかなり駆け足になってしまいどこをどうやって操作しているのか分からなかったのが非常に残念でした・・・

今回はXDの魅力を知ってもらおうというような会だったと思うので、またこのような勉強会があることに期待します!

#3:基本からプラグイン活用まで。120%リピートグリッドを活用して強いデザインを作ろう

登壇者は湯口さん。

XDの魅力的な機能である、リピートグリッドに焦点を当てた講義です。

私はまだこの世界に入ってすぐのぺーぺーですが、デザイン業界が長い方はこのリピートグリッドの機能は驚くほどに革新的なんだそう。

たしかに普段からよく使うので、とても重宝しています。

WORKROOMのシェアメイトも、帰ってリピートグリッドの説明と実際に見せたら、かなり驚いていました。

参考【体験記】WORKROOM in セブ島でシェアハウスしてきました【口コミ】

後半は、リピートグリッドに活用できる便利なプラグインをご紹介して頂いたので一部をここでも紹介します。

Google sheets

グーグルのスプレッドシートからデータを読み込んでくれる超優秀プラグイン。

グラフや表を作るときに特に便利だと思います。

Data populator

JSONのリアルなデータを用いたプロトタイプを作成することが可能なプラグイン。

ダミーテキストを入れる必要がなくなります。

Repeat Grid data Uniti

湯口さん本人が開発されたリピートグリッド用のプラグイン。

例えばリピートグリッドでグループ化した中のデータの順番や内容などをとっても柔軟に変更できるという、まさに痒いところに手が届くような機能!

icons 4 design

このプラグインは講義で紹介されてなかったのですが、私が普段XDを使っていてとても便利なのでついでにご紹介!

アイコンをわざわざFont awesomeなどから引っ張ってこなくても、手軽にアイコンを検索・編集・XD内で使用できる神プラグインです。

対応サイトはFont awesome、METRO、FEATHER、IONICなど約10サイトに対応しているので、必須レベルのプラグインです!

こんな感じで、アイコンの名前とピクセルサイズを入れると、いろんなサイトからhomeのアイコンが表示されます。

あとはそのまま選択して、アートボード内で自由に編集するだけです!

デザインやっている方ならかなり重宝すると思うのでぜひ使ってみてくださいー!

#4:XDゲームで学ぶアニメーションとトリガーのポイント〜圧縮版〜

最後の登壇者は北村さん。

はじめに度肝を抜かれたのですが、なんとXDでドラ○エ風のゲーム(しかもドットなのでかなり初期の頃のやつ)を作ったという猛者です。

アニメーションもつけてあって、ピコピコ動いているようなところはアートボードを2枚作って秒数で切り替わるように設定しているのだとか・・・

制作に10時間以上かかったみたいです😂

何事も突き詰めるとあそこまで完成させられるんだなと・・・もう凄すぎて『はえ〜』という感想しか出ないくらいです。

ずっと口を開けて聞いていました笑

XDはかなり軽いソフトのはずなのに、アートボードの数が異常すぎてカックカクだったのはめちゃくちゃ面白かったです😂

まさに職人技でした!

LT:こんなところで使えるの?!XD活用法

ここからは5分程度のLTです。

余談ですが、LTが『Lightning Talks』ということは知っていたのですが、その意味が『キラキラした人たちが話す小話』だと昨日まで思っていました・・・

シェアメイトに笑われたので出直してきます。(本当は稲妻のような短いプレゼンって意味らしいです!)

登壇者は主催者のかみーゆさん。

XDで退職届を書いた話で全部持って行かれました、おもしろすぎる😂

5分でかみーゆさんの世界に引き込まれるくらいお話上手な方で、調べてみたらNexSeedさんの講師をされている方でした。(無知ですみません)

かみーゆさんの授業、おもしろそうだなあと思ったのと、そんな方の授業を受けられてるNexSeedの方がうらやましくなりました。

LT:踏み込めないあなたにお届けする XDの踏み込み方

デザイナーや、web業界で長い人はなぜか新しいツールを取り入れるのを嫌がると仰っていたやんこさん。

この話は私のような世代にはあまり馴染みがなかったかも?と個人的には思いました。

理由として、まだITに触れている時期が浅いのでこれがいい!これが使いやすい!のようなツールが明確に定まっていないのと、いわゆる『スマホ世代』なので新しいものに触ることや取り入れることに対してあまり抵抗を持ったことがないからです。

毛嫌いせずに、それぞれのツールが持つ特徴とかもあるしいろんなツールを使えるようにしないとですね・・・!

LT:XDでウェブ共同開発チーム作り・プロジェクト事例

一番最後にめちゃくちゃいいお話を聞けました。

登壇者は柳谷さん。

もうスライドの1枚目からすっっごくオシャレで、写真撮るのに必死だったくらい素敵なデザインでした。

web制作でXDをどう制作フローに混ぜて使っていくかの説明、例えばヘッダー・フッターをfixedで固定した時の動きの確認やスライドショーの動きの確認などを、事前にコーディングする前にXDで調整できるよという内容でした。

プロトタイプも実際にスマホに繋いでボタンの大きさは適切か、など確認できるのも良いですね。

個人的に、Tantanさんの講義同様に期待していた内容で、正直5分じゃ全く足りなかったのでみっちり時間をかけてお話ししていただきたいくらい。

本当にスライドのアニメーションやデザインがすっごく素敵で、私もああいうデザイナーを目指したいなと心から思ったくらいには素晴らしすぎました・・・

あとがき

XDの魅力がよくわかるイベントでした!

元々好きだったけど、さらにXDが大好きになったし、モチベーションもあがる素敵な会でした。

個人的な課題として、実際のweb制作で活かせるような機能である固定やアニメーションのつけ方がまだ全然できないので、その勉強をもっとしていこうと思いました。

そして素敵なイベントを開催してくれた主催者の方やVananazの方に感謝です!

Vananazの方、冷房がとっても寒かったのだけど温度調節してくれたり、いろいろ気遣ってくださってとても嬉しかったです😊

そしてみなさんもぜひXDユーザーに!なりましょう!

web用アカウント:@yurina_web

ブログ用アカウント:@vivilog_