2024年6月12日更新
こんにちは。現役デザイナーのaki(@aki_0415a)です!
WEB制作ツールのFigmaですがどのように学習していったらいいのか、これから始める方は迷いますよね。
今回はデザイナー歴15年の私が実際に行って効率がよかったFigmaの勉強方法を紹介したいと思います。
紹介するFigmaの学習方法は、無料で学べる方法を多く紹介しているので、ぜひ参考にしてみてくださいね。
Figmaについては、下記の記事で詳しく紹介していますので参考にしてね。
では、下記からFigmaを学ぼうと考えている方に独学で役立つ勉強方法紹介していきます。
目次
Figmaの勉強方法
Figmaの学習は主に
Step1.Figmaの操作性を学ぶ
Step2.実際にWEBサイトをトレースする
Step3.デザインの基礎やWEBデザインについて学ぶ
この3つになります。
Step1.Figmaの操作を学ぶ
実際にFigmaの操作性を覚えます。
Figmaのサイトのチュートリアルなどを使用して実際の使い方を学んでいきましょう。
ただFigamに限らず、すべてのデザインのソフトは実際にもの(今回ならWEBサイト)を作りながら覚えた方が圧倒的に覚えるのが早いです。
動画での学習はおすすめですが、ある程度見て、大まかな使用方法がわかったら、次のステップであるトレースの練習に移るのがおすすめです。
Step2.実際にWEBサイトをトレースする
個人的にはこれがめちゃくちゃおすすめです。
気になったサイトやおしゃれだと感じたサイトをスクリーンショットなどで撮ってとにかくトレース(模写)していきましょう。
この方法とにかくFigmaの操作がめちゃくちゃ早くマスターできます。
またトレースするときもただトレースするだけでなく、サイトの良いところ、自分ならこうするなどいろいろな方面からWEBサイトを観察・研究することで、WEBデザインについても学ぶことができます。
Step3.デザインの基礎やWEBデザインについて学ぶ
デザインは理論で成り立っているので、多くの本や動画で基礎的なことから最近のトレンドまで色々と学ぶのが大切です。
全てのデザインに当てはまることですが、日々の積み重ねなので「デザインの理論・基礎」はしっかりとマスターするといいですよ。
Figmaについて学べるサイト・サービス
ここからは実際に学べる、サイトやサービスを紹介します。
Figmaの公式リソースとチュートリアル
まずは、Figma公式サイトのチュートリアルで学ぶ方法です。
Figmaの公式サイトには多くのドキュメントやチュートリアルがあり、Figmaの機能や操作方法について詳しく説明されています。
また、「Learn Figma」というセクションでは、ビデオ形式やテキスト形式のチュートリアルが提供されています。
ビデオ形式なので実際に操作している様子を見ることができるのでわかりやすいです。
公式サイトのチュートリアルは全て無料で学ぶことができるのも嬉しい点ですね。
またFigmaは公式のYouTubeチャンネルがあるので合わせて確認してみるのも良いですね。
また、公式サイトが提供している無いよの為、信頼性の高い情報と最新の機能を学ぶことができます。
書籍
最近は、Figmaを学ぶための書籍が数多く発売されています。
書籍は信頼性の高い内容はもちろん自分に必要な内容を取捨選択して学ぶことができますし、イラストなどでわかりやすく解説されており勉強には最適です。
初心者におすすめの書籍ですが、「これからはじめるFigma Web・UIデザイン入門」という書籍は、Figmaの基本的な機能やワークフローからWEBデザインの基礎まで詳しく解説しています。
基礎から上級者になっても使えるテクニックが満載のおすすめの1冊です。
Youtube
YouTubeにはFigmaの使い方を解説したチュートリアルがたくさんあります。
Figmaの公式YouTubeチャンネルもありますが、公式以外にも多くのYoutuberがFigmaの紹介をしています。
信頼性のあるチャンネルを見つけ、基本操作から高度なテクニックまで学んでみてください。
ビデオ形式のチュートリアルは視覚的でわかりやすく、実際の作業手順を見ることができます。
- ❶カイクン-デザイン解説@BONO
- ❷HIROCODE.ヒロコード
- ❸Mayuko Soga
20本以上のチュートリアル動画を投稿されています。
丁寧な解説で初心者でもわかりやすく理解することができます。
効率的に機能を紹介してくださりとてもわかりやすいです。
デザインの制作過程を丁寧に解説くださりとても実践的で変わりやすいです。
オンライン学習(おすすめ!)
Udemyでは、オンライン講座には、Figmaに関する専門的なコースがあります。
講師の方が解説する動画はとても変わりやすくオススメです。また、書籍・ネットなどで網羅できなかった点を捕捉的に学ぶこともできます。
例えば、下記の「Figma for UX/UI Design」というコースでは、実践的なプロジェクトを通じてFigmaの スキルを磨くことができるのでオススメです。
自分の学習スタイルや目標に合わせて、最適なコースを選びましょう。
Udemyの公式チュートリアルは下記になります。
Udemy公式サイトのチュートリアル
LinkedIn Learningの公式チュートリアルは下記になります。
Udemy公式サイトのチュートリアル
おすすめの学習サービスのUdemyについては以下の記事で解説しています。
デザインコミュニティの活用
Figmaのデザインコミュニティはデザイナーが制作物やプラグインを公開・共有しコミュニケーションを取れる場です。
非常に活発で、多くのデザイナーとの交流や情報共有が可能です。
TwitterやInstagramなどのソーシャルメ ディアプラットフォームでも、Figmaに関する有益な情報が共有されています。
デザインコミュニティに参加し、他のデザイナーの作品 やチュートリアルを見つけることで、新しいアイデアを得たり異なるデザインアプローチを学んだりすることができます。
とにかく触ってみよう‼︎
いろいろと紹介さえていただきましたが、最終はとにかく触ってみましょう。
百聞は一見にしかず‼︎
Figmaを学ぶ上で重要なのは、実践的なプロジェクトに取り組むことです。
自分のやってみたいデザインや流行に合わせたデザインを選び、Figmaを使ってデザインをどんどん作成してみましょう。
実際のプロジェクトに取り組むことで、Figmaの操作方法やWEBデザインを実践的に学ぶことができます。
また、継続的にFigmaを使い、新しいテクニックや機能を試してみましょう。
作成したデザインなどは、SNSやコミュニティなどで公開してフィードバックもらうと自分では築けていない点がわかったりします。
初心者のうちはデザインを公開することに抵抗があるかもしれませんが、誰でも最初は初心者ですので、気にせず作業に慣れてきたら挑戦してみましょう。
以上が、Figmaを効果的に学ぶための手法です。
これらの手法を組み合わせて、自分の学習スタイルや目標に合った方法でFigmaを学んでみてくださいね。継続的な学習と実践に取り組むことで、より高いレベルのスキルを身につけることができます。
読んでいただきありがとうございます。
また次回もよろしくお願いします^^