inflearn logo
知識共有
inflearn logo

ピグマ・アトミック・コンポヌネント蚭蚈システムでMVPを䜜成

アトミックコンポヌネントシステムを掻甚し、MVPを䌁画からデザむンたで完了しおみるクラスです。

難易床 初玚

受講期間 無制限

Figma
Figma
Atomic Design
Atomic Design
Design System
Design System
Mobile App Design
Mobile App Design
Figma
Figma
Atomic Design
Atomic Design
Design System
Design System
Mobile App Design
Mobile App Design

受講埌に埗られるこず

  • ピグマの基瀎

  • コンポヌネントシステム

  • MVP䌁画

  • アゞャむルプロセス

  • アトミックデザむン

ピグマアトミックデザむンコンポヌネントシステムでMVPを䜜成する



AIが1秒でデザむン、コピヌ、コヌドを織る時代です。
デザむンだけをするこずを知っおいるデザむナヌ/䌁画だけをするこずを知っおいる䌁画者/開発だけをするこずを知っおいる開発者は
もはやAI時代に勝おたせん。


どうすれば「代替䞍可胜な人」になるのでしょうか
迅速か぀効率的にMVPを䜜成し、仮説を怜蚌するアゞャむル方法論を孊ぶこずです。

結局のずころ、蚈画的思考が裏付けられおいないプロダクトmvpは殻だけです。 10のうち7぀のサヌビスが5幎以内に消えたす。䌁画、デザむン、開発、ビゞネスモデルが別々に遊んでいるからです。


figmaのコンポヌネントシステムを掻甚しお玠早くMVPを補䜜するスキルを埗るこずができれば
月に䞀぀ず぀プロダクトを䜜れるようになりたす
私も私が䜜ったピグマコンポヌネントセットを掻甚しお短くは䞀ヶ月、長くおも第1四半期内のプロダクトを連続的に立ち䞊げおいたす。 ぞのmvpを芋る

こんな方におすすめです

ピグマずコンポヌネントの掻甚を孊びたい予備/珟UIデザむナヌ

プロダクト制䜜前のコヌスを孊び、䜓の䟡倀を高めたいメヌカヌ

MVPを制䜜しおみたい予備/県スタヌトアップ埓事者


受講埌は

  • FigmaでモバむルデザむンMVPを䌁画しおデザむンできるようになりたす。

  • 単に同じように埓うのではなく、なぜそうするのか理由がわかりたす。

  • Figmaならではの機胜を100%掻甚し、野賀田はやめたす。

  • UIラむブラリずアトミックデザむンシステムを理解し掻甚できるようになりたす。

  • アゞャむル/リヌンスタヌトアップサヌビスの䌁画やデザむン党過皋の゚ッセンスを玠早く把握できたす。

  • デザむナヌでなくおもワむダヌフレヌムをピグマで描くこずができるようになりたす。

  • ピグマコミュニティのテンプレヌト゜ヌスをもっず自由に掻甚できるようになりたす。

この講矩の特城

10幎目のデザむナヌの問題の定矩 - ワむダフレヌム - デザむンプロセスのノりハりを取りたす。

理論ず実務の比率は適切です。

デザむン䟋が矎しいです

すぐにmvpを䜜成できるコンポヌネントテンプレヌトを提䟛したす。

このようなこずを孊びたす。

たさかただレむダヌベヌスにしおいるんじゃないですか

フレヌムを最初にオブゞェクトを眮いおいたすかそれでもストロヌクを䜿っおデザむンしおいたせんかオヌトレむアりトを曞いお曞くのに100理解しおいないならハチミツチップを埗るこずができたす。

RやAではなく、shift + aで始たりたす。

バリアント、スワップむンスタンス、呌ばれる、アトミックコンポヌネント

コンポヌネントの基本であるバリアントの䜿い方ずスワップむンスタンス、呌ばれおflexible component、コンポヌネントの䞭のコンポヌネントであるアトミックデザむンシステムを孊びたす。アトミックコンポヌネントずは、1぀のコンポヌネントを原子単䜍、分子単䜍で分割するこずをいいたす。極鋌の効率を远求する開発方法論の䞀぀を孊びたしょう *泚意アトミックシステムはデザむン/開発方法論の1぀であり、究極の技術ではありたせん

他のコンポヌネント゜ヌスを理解しお制埡できるようになりたす

段階的にデザむンする過皋を繰り返し芋せおくれたす。

ステップ1はレむダヌベヌスでデザむンする
ステップ2はオヌトレむアりトでデザむンする
3段階はバリアントず呌ばれる掻甚
ステップ4はコンポヌネントの䞭にコンポヌネントを入れる。 (アトミックデザむン)

100%コンポヌネントベヌスでデザむンできるように食っおみたした。 UIラむブラリがなぜ必芁なのか、コンポヌネントベヌスでデザむンするずいうのが䞀䜓䜕の音なのか分かるのはおたけです。

100コンポヌネントベヌスデザむン

10幎目デザむナヌ出身のPO/Designpreneur。

  • 初期のスタヌトアップず゚ヌゞェンシヌの経隓を通じお、芏暡に適したサヌビス䌁画/デザむン方法論が別々にあるこずに気づき、独自のノりハりでmvp補䜜法を開発したした。

  • 初期メンバヌずしおシリヌズB、創業メンバヌずしおbep達成、デザむン創業家ずしお䌁画からデザむン、マヌケティングたでオヌルむンワンプロセスでブヌトストラップ旅皋䞭です。

  • 平均第1四半期に1぀の補品を立ち䞊げたす。

  • ブランチからの曞き蟌み。

質問がありたすか

このレッスンは、2024幎6月以降の最新のピグマむンタヌフェヌスを反映しおいたせん。 講矩曎新蚈画もありたせん 初めおピグマに觊れる人よりは、アトミックコンポヌネントを実務でどのように䜜っお掻甚するかに孊習が気になる方のみ受講しおください

Q. デザむナヌではないのに聞いお理解できたすか

デザむナヌ重点ではありたすが、mvpを制䜜したい人を察象に䌁画したした。自ら補品を䌁画しお立ち䞊げおみるブヌトストラップ、初期/創業メンバヌに興味のある方、アゞャむル方法論でプロダクトを開発しおみたい方が聞けば良いです。入門者向けなので理論講矩はブロヌドで、誰でも簡単に理解できたす。 䞭玚者の方が聞くず困りたす

Q. 理論が重点ですか、ピグマ実務講矩が重点ですか

ピグマ実務講矩が重点です。理論だけを挙げる講矩ではなく、ピグマの基本は確かに教えなければならないず思いたした。コンポヌネントセクションは、ピグマに初めお接した人が難易床1段階から5段階アトミックデザむンたで繰り返し孊習を通じおコンポヌネント理解床を高めるずいう仮定で構成したした。聞くだけで終わる楜な理論講矩だけを期埅された方は難しいず感じるこずができたす。実習をしないず手に入れるこずが少ないです

Q. 他のピグマ講矩ずは䜕が違うのですか

「なぜそうすべきか」理由をお知らせするのにフォヌカスしたした。ただ「フォロヌしおください」ではなく、これを行う理由はこれであり、これを行う必芁がある結果を埗たす - ずいうように説明したす

受講前の泚意

準備

  • 新しい領域を開拓したい奜奇心ず情熱だけを持っおきおください。ああ、むンタヌネットになるコンピュヌタも。

孊習資料

  • ブランチコラムずYouTubeアりトリンクを提䟛しおいたす。

  • ビデオに䜿甚されるpdf玠材をダりンロヌドできたす。

遞手の知識ず泚意事項

  • 提䟛されおいるuiテンプレヌトは、バリ゚ヌションず加工で自由に䜿甚できたす。

  • uiテンプレヌトを共有するこずはできたせん。

  • 自分の基瀎知識やレベル、孊習意志によっお、講矩の難易床が異なっお感じられる堎合がありたす。

  • ずおもフレンドリヌで簡単なレベルではありたせん。速床も少し速いかもしれたせん。

こんな方に
おすすめです

孊習察象は
誰でしょう

  • ピグマに初めお觊れる人

  • MVP䌁画やデザむンを䞀床にやりたい人

  • なぜそれを䜜らなければならないのか疑問に思う人

  • 実務デザむンプロセスが気になる䌁画者、開発者、マヌケティング担圓者

  • アゞャむルプロセスの実務を理解したい人

こんにちは
Hagiroです。

55

受講生

3

受講レビュヌ

3

回答

5.0

講座評䟡

1

講座

10幎目のデザむナヌ出身PO / デザむンプレナヌ。

  • 初期スタヌトアップず゚ヌゞェンシヌでの経隓を通じお、芏暡に適したサヌビス䌁画・デザむンのメ゜ッドが別にあるこずに気づき、独自のノりハりでMVP補䜜手法を開発したした。

  • 初期メンバヌずしおシリヌズB、創業メンバヌずしおBEP達成、デザむン起業家ずしお䌁画からデザむン、マヌケティングたでオヌルむンワンプロセスでブヌトストラップの過皋を歩んでいたす。

  • 平均1四半期に1぀のプロダクトをロヌンチしおいたす。 ハギロのMVP One Thing Memo

  • Brunchで執筆しおいたす。..

もっず芋る

カリキュラム

党䜓

31件 ∙ (5時間 27分)

講座資料こうぎしりょう:

授業資料
講座掲茉日: 
最終曎新日: 

受講レビュヌ

党䜓

3ä»¶

5.0

3件の受講レビュヌ

  • cornet님의 프로필 읎믞지
    cornet

    受講レビュヌ 3

    ∙

    平均評䟡 5.0

    5

    100% 受講埌に䜜成

    単にデザむンだけを話さなくおよかったです。

    • hagironow6901
      知識共有者

      完成埌にレビュヌを残しおいただきありがずうございたす:))

    • 講矩内容に比べお受講評がずおも淡癜でしたね。 パブリッシャヌ出身で新たにアむテム開発しながらピグマに぀いお深く知りたくお講矩を聞きたした。実力あるデザむナヌずしお画面デザむンは難しいでしょうが、開発に必芁な画面構成は難しくないずいう自信が生たれたすね。 ピグマ川の内容も圓然良かったのですが、デザむンや実務進行内容ず連携しお説明しおいただき、ずおも良かったですね。 この講矩を聞くず、ピグマ䜿甚しながら最も根幹ずなるラむブラリヌのセットが䜜られるのもよかったです。 先生の無駄なきちんずした講矩や説明も圹に立ちたした。 他の講矩も甚意しおいれば期埅になりたす。 ありがずう

  • blackwinter01052297님의 프로필 읎믞지
    blackwinter01052297

    受講レビュヌ 4

    ∙

    平均評䟡 5.0

    5

    100% 受講埌に䜜成

    • jiyeonkang3950님의 프로필 읎믞지
      jiyeonkang3950

      受講レビュヌ 4

      ∙

      平均評䟡 5.0

      5

      100% 受講埌に䜜成

      䌌おいる講座

      同じ分野の他の講座を芋おみたしょう

      新芏䌚員登録で25%OFF

      ï¿¥9,072

      25%

      ï¿¥12,102