【厳選】Udemyで Figma を学べるおすすめ講座3選

フリーランスエンジニアをしているヨノと申します。

独学でプログラミングを学び、ソシャゲ・SaaS開発などを経て、2018年からフリーランスエンジニアとして活動しています。

主にバックエンド中心の案件を獲っていますが、たまにはフロントエンドも。
主な使用言語・FWは、Ruby/Rails/Go言語/JavaScript/TypeScript/React/Vue.js

• PCの画面や資料を映しながら説明してくれるのでわかりやすく、書籍より早く学べる
• 講師に質問でき、他の人の質問とその回答も見れる
• スマホでも見れるので、スキマ時間を活用できる
• 復習として2周目、3周目するときは倍速再生を使うことで効率よく学べる
• 満足できなかった場合、30日以内であれば返金してくれる

Figmaは誰でも無料で使えるデザインツールであり、プロの現場でも使われる素晴らしいソフトウェアです。Mac / Windows / Webブラウザを使って誰でもデザインを始められ、その柔軟さと機能性でユーザー数を伸ばしていますが、日本語の体系的な教材がまだ少ない印象です。

この講座では、Appleのデザインを題材に本格的なUIデザインを学習します。
また、Figmaの強力なインタラクション機能とプラグインを使って、ハイレベルなプロトタイプを作成します。※ プロトタイプとはアプリ開発の際に、できるだけ早い段階でデザインに欠陥がないかをテストする手法です。

モバイルアプリをデザインする際のルール、一貫性のあるデザインの大切さ、感覚に頼らないデザインなど、デザイナーの思考法を解説しながら一緒にUIを作り上げていきますので、初学者はもちろん、エンジニアやマネージャーなど、普段デザインに関わらない方にもお勧めです！
学習した知識とテクニックは、Webデザイン制作にも活かすことができます。

また、最終的なデザインは公開されており、自由に確認、編集することができます。

ご挨拶

皆さん初めまして、 8年間デザイナーをしておりますヤスダ先生と申します。

私は今まで100本以上の大手企業様・中小企業様のWEBサイト/スマホアプリ/バナー等のデザインに携わってきました。

自身でHP制作会社を運営している傍らWEBデザインスクールの立ち上げを行い、多くのWEBデザイナーを輩出してきました。

figmaは近年もっとも注目されているデザインツールです。

今figmaを学ぼうと思っている方、本当にラッキーです。

何故なら「figma」はPhotoshopやillustratorを全く触ったことない人でも簡単にWEBサイトが作れるようになります。

私もfigmaを使うようになってからfigmaの虜になり

今ではWEBサイトやスマホアプリなどほとんどfigmaを使用しています。

最新デザインツールで難しそう..と思っているそこのあなた！全く心配いりません。

figmaはめちゃくちゃ簡単なんです。

本講座では0から一緒にWEBサイトを作成していきます。

また実務で使えるガイドラインやコンポーネント管理など本格的な技術も習得できます。

是非この機会に動画をご覧いただき、一緒にfigmaの基本を学んで実際の制作現場で使っていけるよう使いこなしましょう！

igma はオンラインで実行可能な強力なアプリケーションです。
Figmaは、Webブラウザー内で設計したり、WindowsおよびMac用のデスクトップアプリケーションを使用したりできるため、どのプラットフォームでも利用できます。FigmaはSketchやAdobeXDに似ていますが、チームのコラボレーションと応答性の高いペースの速いデザインに関してはFigmaの方が便利です。

このコースでは、Figma内の便利なツールを使用したUI設計について説明します。最初のセクションでは、Figmaの使い方について説明します。ここでは、デザインを応答性の高いものにするための制約や、プロジェクト全体で使用するデザイン要素を構築するコンポーネントなどの便利なツールについて学びます。また、リアルタイムのチーム内での共同作業や同じプロジェクト内の他のユーザーと緊密に連携する方法についても説明します。

後半は、複数のアートボード、カスタムアイコンのデザイン、画像やテキストの編集など、洗練されたデザイン作成に必要な要素を学ぶために、アプリのデザインとプロトタイプ作成について説明します。

デザインの初心者や、SketchやAdobeXDなどの他のツールから切り替えたいUI / UXデザイナー の方はぜひ受講してみてください。

Figmaを使用して、美しいモバイルおよびWebユーザーインターフェイスを作成する方法を学習します。Figmaは、チームや個人がより速く、より効率的に設計を作成できるようにするデザインツールです。 Figmaは無料でWebブラウザー、Mac、Windowsで使用できます。

このコースはどんな人に適していますか？
次の項目に当てはまる場合は、受講してみてください。

• UI / UX に興味があるが、何から始めればよいかわからない
• アプリのアイデアをモックアップとプロトタイプにしたい
• デザインスキルを磨きたい
• Figmaを身につけて、次のレベルに上がりたいと思っているデザイナー
• フリーランスのデザイナーになることに興味がある
• 単に新しいキャリアパスに進みたいと思っている

このコースを終えた頃には？
Figmaの優れた機能を学び、魅力的なモバイルおよびWebモックアップを設計できるようになります。

このコースの受講に必要なもの
このコースは、スキルを伸ばしたい初心者と経験豊富なデザイナーの両方を対象としています。
必要なのはパソコンとWebブラウザーだけです。

コースの概要
このコースは、「Figmaについて学ぶ」、「モバイルモックアップの設計」、「シンプルなWebアプリモックアップの設計」という3つのセクションに分かれています。

① Figmaについて学ぶ

• Figmaが優れている理由を理解する
• Figmaにサインアップする
• ソフトウェアの基本を確認する
• Sketchからファイルをインポートする
• フレーム、シェイプの作成、および描画ツールを使用した探索

② モバイルモックアップの設計

• Clean Kangarooと呼ばれる洗濯配送サービスのモバイルアプリUIの設計
• 再利用可能なデザインコンポーネントの作成
• 制約を使用したモバイルデバイス向けのレスポンシブデザインを作成する
• 色やタイポグラフィを変更しやすい適用方法
• モックアップをインタラクティブなプロトタイプに変える
• 実際のデバイスでプロトタイプをテストする
• デザインの共有とエクスポート
• Figma内のチームと同時に作業する

③ 単純なWebモックアップの設計

• Clean Kangaroo用の3ページのWebアプリUIの設計
• 自動レイアウトを使って、スマートで動的なデザインを作成する
• プラグインを使用してサンプルデータをデザインに入力する

Figmaを使用して実際のプロジェクトをデザインする方法を学び、デザインスキルを新しいレベルに引き上げましょう。