강의

멘토링

로드맵

Inflearn brand logo image
BEST
Design

/

UI/UX

[MASTER] Figma UI デザインを学びながら作成する

Pigma を扱うことはできますが、コンポーネントの活用にまだ慣れていない場合は、このチュートリアルが役に立つと思います。

  • agilelabs
Figma
Web Design
Mobile App Design

学習した受講者のレビュー

こんなことが学べます

  • ピグマを活用した完璧なコンポーネント管理

  • Figma を活用したプロトタイピング

  • PIGMA オートレイアウトとカードコンポーネントのデザイン

  • Figma コンポーネントとレスポンシブ コンポーネント デザイン

  • Figma 共有機能とZeplin完全分析活用

Figma、コンポーネント活用まで完璧に!

🙆🏻‍♀ Welcome aboard our Figma Class Flight 🙆🏻‍♂

ようこそ:)私たちのピグマクラスの旅は今から始まります。

こんにちは。ピグマクラスを一緒にする「ヨンナムドンイジェヨン」です。 YouTubeでクリエイターとして活動しており、現在様々なデザインクラスでオンオフラインでデザイナーたちにFIGMA、SKETCH、ADOBE XDとUI/UXを講義しています。

オフライン講義のメリットは呼吸して進行できるというメリットがありますが、遠くにいる方との呼吸は一緒にできないという残念が常に残っているようです。 Inflearnでは、いつでもどこでも簡単かつ便利にピグマレクチャーを聴くことができます。

「始まる人と始まっていない人の違いは空と地の違いです」


🗒アメリカで流行するアメリカの水の中にはFIGMAがあります

Figmaは最近、さまざまな海外デザイナーの間でスケッチ、AdobeXDを置き換えるデザインツールとして注目されています。 Framerのように難しいコーディングや複雑なUIから抜け出し、簡単な操作だけで完成度の高いプロトタイピングを構成できるからです。プラグインを使わなくても高レベルのデザイン結果を作ることができ、ブラウザベースのツールでリアルタイムコラボレーション、リアルタイム同期、Hand off機能でデザイナーと開発者間のコラボレーションもスムーズに可能です。

海外のYouTubeもピグマに切り替えています。


🌈ピグマクラスマスター

こんにちは。ピグマはブラウザベースの新しいデザインツールです。すでに発売されてから数年が経ちましたが、国内ではきちんと扱っていないデザインツールでもあります。

新しいデザインツールに対するさまざまなニーズが存在し、今強制的に慣れるべき時代ではなく、私に合ったツールを直接均等にデザインできる時代が到来しました。

良いデザインツール自体がデザインのクオリティを高めたり、実力を向上させたりすることはできませんが、ツールをうまく活用すればデザイナーの不足部分を補完する役割を果たします。

多様なツールがあふれ、会社、個人、環境とコラボレーション関係によってどのようなツールを選択するか悩みが多くなる時期でもあります。文字通りデザインツールの春秋戦国時代です。

このような過渡期に実力を築き、その実力を完全に私のものにしつつ、遅れないこと、もう一緒に始めて一緒に完成してみましょう。

  • 🎓クラス01 - ピグマのコンポーネント100%を活用する


MATERIAL DESIGNに基づいた画面構成の過程で、さまざまなケースを1つのコンポーネントとして処理して、アプリの全体的なトーン&マナーを一定に保つ方法を学びます。

  • 🎓クラス02 - レスポンシブデザインとコンポーネント

コンポーネントを状況に合わせて自由にサイズを変形して使用できるようにレスポンシブコンポーネントとして開発します。

グリッドシステムについては、フレームごとに個別に適用できるグリッド機能を活用して、コンポーネント別のグリッドを適用し、組み合わせて使用​​できる方法まで調べる過程です。

  • 🎓クラス03 - オートレイアウト

ピグマで紹介するオートレイアウトは、簡単なボタンを簡単に作成することから、カードコンポーネントを簡単に構築するための新しい方法を提案します。

  • 🎓クラス04 - 仕事をより迅速かつ効率的に! - プラグインも一緒

ピグマを活用したデザインをより簡単かつ迅速にするさまざまなプラグインも学びます。

  • 🎓クラス05 - コンポーネントとプロトタイピングオーバーレイ

さまざまなプロトタイピング機能を学び、コンポーネントにプロトタイピングを適用する方法を学びます。

🙌この講義を受講するために必要なもの!

ピグマを搭載したパソコン、ノートパソコンが必要です。

Figmaは無料のデザインツールです。
無料でダウンロードして会員登録を急いでください!


🙋🏻‍♂️質問あり洋服!!

Q. デザインを初めて学びます 難しくないでしょうか?

A. デザイン非専攻者も簡単に聞ける講義です。本クラスは基礎から中級までのレベルで提供されています。

B. 本マスターコースは、ピグマの基本的な内容を理解しているという前提のもとに行われるコースであり、基本コースに続く連続コースです。

Q. なぜピグマを学ぶのが良いのですか?

A. ピグマは古いデザインツールではありません。アートボードではなくフレームを使うというのは、ピグマが既存のデザインツールとは違って「動き」をデザインするということです。マイクロインタラクションが重要になり、トレンジション(画面切り替え)効果により、より高いユーザビリティを提供することができます。

Q. Windows PCも可能ですか?

A. Figmaはブラウザベースのツールです。さまざまなOSですべて利用可能です。 Mac、Linux、Windows、Chromeなどはすべて可能です:)

Hello!エブリボディ「ヨンナムドンイジェヨン」

私は2017年に「おいしいスケッチ」というスケッチアプリの本を書きました。ボール入りの時間ほど売れない卒作だが 😢😢 IT会社を運営しながらデザインツールに触れ、デザイナーとしてそして直接デザインした内容を実物アプリサービスに仕上げていきながら蓄積されたノウハウを共有し、より良いアイデアを作っていくことに喜びを感じています。

最近はFIGMAガイドブックという本を執筆するようになり、本にある内容を説明させていただきます:) 著者直講なんですよ!

ピグマに初めて触れながら幕屋のその気持ちを十分に理解します。ゆっくりとじっくりとしたらいつのまにか専門家のように慣れているはずです。

今始めましょう。始まった人と始まっていない人は、大きな違いを表します。

こんな方に
おすすめです

学習対象は
誰でしょう?

  • ピグマを使うことを知っていますが、コンポーネントの活用を頻繁にしない場合

  • コンポーネントデザインに興味のある方

  • デザイン システムを構築したい方

  • チーム ライブラリの使用方法が知りたい方

前提知識、
必要でしょうか?

  • PIGMA の基本的な操作を理解しておくと便利です。

こんにちは
です。

1,006

受講生

105

受講レビュー

7

回答

4.7

講座評価

8

講座

 

현직 스타트업 PO 13년차

현) 라이프스타일 플랫폼 PO

전) 헬스케어 플랫폼 Lead PO

전) 헬스케어 CRM 시스템 PO

전) 광고 플랫폼 PO

 

현) 리메인 디자인툴 테크닉 클래스 강사

현) 서울시 청년취업사관학교 서비스 기획 강사

전) 패스트캠퍼스 UI/UX디자인 스쿨 강사

전) LG전자 디자인팀 Sketch 디자인 강의

 

저서

프로덕트 개발의 모든 것

맛있는 스케치 디자인

피그마 가이드북 

カリキュラム

全体

10件 ∙ (2時間 32分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

22件

4.5

22件の受講レビュー

  • 김혜진님의 프로필 이미지
    김혜진

    受講レビュー 2

    平均評価 5.0

    5

    100% 受講後に作成

    감사합니다.

    • 박희진님의 프로필 이미지
      박희진

      受講レビュー 1

      平均評価 5.0

      5

      90% 受講後に作成

      실무에 활용하기 좋고, 매우 유익합니다.

      • sangyulchoi님의 프로필 이미지
        sangyulchoi

        受講レビュー 4

        平均評価 4.5

        5

        100% 受講後に作成

        꼼꼼하게 한 단계씩 나아가는, 쏙쏙 들어오는 강의였어요. 마침 이런 기능 없나 하던 참이라 개인적으로도 안성맞춤인 강의였습니다. 감사합니다!

        • 최영화님의 프로필 이미지
          최영화

          受講レビュー 1

          平均評価 5.0

          5

          100% 受講後に作成

          좋았습니다.

          • uitoxic님의 프로필 이미지
            uitoxic

            受講レビュー 8

            平均評価 3.9

            5

            100% 受講後に作成

            만들면서가 좀더 연습이 아닌 실전 예제스러웠으면 좋겠고, 디자인과 화면설계를 구분하면 더 좋을듯합니다.

            期間限定セール

            ¥41,800

            24%

            ¥6,526

            agilelabsの他の講座

            知識共有者の他の講座を見てみましょう!

            似ている講座

            同じ分野の他の講座を見てみましょう!