最近Figmaを使い始めたばかりの人にも、ある程度使い慣れてきた中級者・上級者にも、改めておすすめしたいチュートリアル動画があります。それが、**AwwwardsのAcademyで公開されているMirko Santangeloによる「Learn Figma from 0 to 100」**です。

この講座、7時間にわたってFigmaの機能を網羅的に解説してくれます。UI設計、プロトタイピング、コンポーネントやオートレイアウト、カラー、タイポグラフィ、さらにはアニメーションやプロジェクト共有まで、実務で使うあらゆる機能が丁寧に紹介されます。まさに「ゼロから100まで」カバーされており、見終えたころにはFigmaの地力がぐっと上がっているはずです。

特に良いのが、普段なんとなく使っていた機能の正しい使い方や便利な応用法まで教えてくれる点。中級者以上の人でも「あれ、そんな使い方ができたのか」という発見が多い内容です。

解説は英語ですが、ゆっくりめのスピードで話してくれるので、TOEIC700点程度のリスニング力があれば問題ありません。少しなまりのある英語ではありますが、字幕もついているので安心です。

価格はたったの$12(約1,800円)。Figmaをもっと深く使いこなしたい人、体系的に復習したい人にとっては非常にコスパの良い教材です。

awwwardsのアカデミーには下のリンクから飛んで下さい。

https://www.awwwards.com/academy/

Lois Paquetのデザイン思考法が学べる以下の講座も非常にオススメ

Innovative Web Design in Figma: A Step-by-Step Process
Offer
By Louis Paquet

この講座はLois PaquetというAwwwardsで何度も受賞歴がある、一流デザイナーがそのデザインを例に出しながら、どういうプロセスを得てデザインを完成していったかを見れる非常に貴重な動画です。プロのデザイナーの方で更なる高みを目指す方には$1499のLoisPaquetに直接、作品を講評してもらったり、質問に答えてもらえる講座も販売されています。私は一流デザイナーでも沢山の情報収集と多くのモックアップを作って最終デザインに辿り着いているのかを私はこの動画で学びました。(Lois Paquetはアニメーションのコーディングまではやらずに、あーとディレクターとしての活動に専念してるようですが、Louis Paquetのようにクオリティの高いデザインを作りつつ、フロントエンドフレームワークとアニメーションのコーディングまで挑戦しようとしている自分が、勉強がなかなか進まず焦りを感じるのも仕方ありません。私はデザインはなるべく既存のものをミックスしてデザインすることで省力化して、アニメーションの動きで魅せるデザインを作ることでその壁を乗り越えようとしています。)

補足: その他の講座について

以上、2つの講座しか見たことがないので他は評価できません。私はLouisPaquetのAfterEffectsを作ったアニメーションモックアップの講座も購入してしまいましたが、AfterEffectsの習得に時間がかかるため見ていません。AfterEffectsの必要な機能だけを短時間で習得出来る方法があればいいのですが、私の調べた限りではJitterというAnimation用のウェブアプリケーションのほうが習得までのスピードは早いようですが、チュートリアルが古いYouTubeビデオしかありませんでした。PrincipleというMacのソフトも結構前からあるようですが、結構高いお値段なので、AfterEffectsの高機能さと比べると見劣りしてしまいます。FigmaでまかないきれないAnimationのモックアップ制作は選択肢が多く難しいですね。