こんにちは、虎の穴ラボデザイナーのWRです。
現在スキル向上の一環として、VOD型オンライン教育サービス「Coloso」でGoogleデザイナーから学ぶUI/UXの講座を受講しています。
今回からそちらの感想を全2回にわたり掲載していきますので、どうぞよろしくお願いします！

「Coloso」とは

Colosoはイラスト・デザイン・映像など様々なクリエイティブジャンルで活躍する、業界トップクラスの専門家の方たちの実務ノウハウをオンラインで学ぶことが出来る教育サービスです。
各オンライン講座は一度の購入で無期限視聴可能。焦らず時間のある時に自分のペースで進められます。

今回選んだ講座

講師はGoogle本社のYoutubeチームでUXデザイナーとして働いているGilbert Hanという方。
こちらの講座のメリットは以下になります。

世界で使用されるFigma、ProtoPieを段階別に難易度による実習で着実にマスターできる
IT・金融・Eコマースなど主要産業のUI/UXプロジェクトの全過程を学べる
「優秀なデザイナー」として実力と自分の価値を両方上げるためのノウハウを学ぶ

受講した目的

世界で活躍するUI / UX デザイナーのデザインプロセスの過程を知りたい
プロダクトデザインスキルを上げたい
生成AIをデザインに役立てるTipsを知りたい

いざ受講！

デザイナーの心得

まずは、デザイナーとはどうあるべきかという、マインドをレクチャーされます。

当たり前のことだが、デザイナーはデザインが上手であることが求められる。
理論で強調するプロセスとデザインシンキングが重要ではないという意味ではないが、どの提案もデザインが優れていることが前提になる。

また、優秀なデザイナーの原則を提示されます。

1. アイデアを一早くハイクオリティのデザインに作り出すことができる

思考をビジュアルで解きほぐす能力
ビジュアルデザインに対する理解度
デザインシステムに対する理解度
デザインのエンジニアリングの可能性

2. 大部分のデザインには理由がある。

常にデザインを作り出した理由があり、上手く説明できる。
デザインが本人のためのデザイン、本人の思考から出たデザインではなく、常にユーザーのためのデザインであることにフォーカスを合わせている。
可能な時にユーザーデータ、あるいはリサーチデータでデザインを裏付けする。

3. 優れたストーリーテリングのスキル

私たちがなぜこのデザインに集中しなければならないのか、ストーリーで解説できる。
デザインのクオリティが優れているだけでなく、なぜそのようなデザインをしたのか、そしてなぜそのデザインにフォーカスを当てなければならないのか、皆がストーリーで理解できるように説明する。

4. デザインを作り出す量が多い

様々な角度からユーザーの問題を解決しようと試みる。
デザインのアイデアが豊かである。
デザインを作り出す速度が速い。
その反面、多くのデザインの中で本人が最も好むデザインがあり、好まないデザインは見せない。

5. 大きな絵と小さな絵を一緒に見る

今、私たちのプロダクトが、マーケットにおいていかなる位置をに立っており、どの部分の機能、またはデザインを強化してこそ優位をもたらすことができるかを説明する。
デザインプロジェクトを行う時、常にビジョンと現在可能なデザインを同時に提示する。そして今すぐできることをPMやエンジニアに明確なコミュニケーションを図る。

デザイナーとして活動するうえで、日々なんとなく意識していることを改めて明確にされた感じでした。

Figma(Basic~Advanced）

Figmaの講座では、初心者向けの基本的な使い方から、上級者向けの実践的なテクニックまで幅広く学ぶことができました。
日頃の業務でFigmaを使っているので、すでに知っている内容もありましたが、何点か実践で使えそうなTipsがありました。

デザインコンポーネント

Figmaのコンポーネントのプロパティを使いこなすことで、コンポーネント管理が便利になります。

ブール値の活用

コンポーネント化したら、ブール値を選択します。

次に、アイコンを選択し、アイコンの外見のプロパティに現れる設定のアイコンを選択します。

Iconの値を設定すると、アイコンのある・なしをコンポーネントで簡単に管理できます。

テキストの活用

使いまわしたいフォームのパーツを、コンポーネント化します。

次に、フォーカスの当たったテキストの横に表示されるボタンを押して、プロパティ化を行います。

これにより、フォームのコンポーネントのテキストを簡単に変更できるようになります。

より効率的なコンポーネント化のティップスを学ぶことで、デザインの管理がこれまで以上に効率的になると感じ、大変驚きました。
Figmaの公式マニュアルにもコンポーネントの便利な使い方が説明されていますが、実例を挙げて動画で実際に使用している様子を見ることができるのは、講座ならではの大きな強みだと思いました。