Tweet
Tweet

Slide 1

Slide 1 text

スタメンデザイナーオープン勉強会 Figmaプラグイン 開発してみた

Slide 2

Slide 2 text

#スタメンオープン勉強会 初めて触った デザイン関連ソフトは なんですか？

Slide 3

Slide 3 text

Wikipediaより引用

Slide 4

Slide 4 text

スタメンデザイナーオープン勉強会 Figmaプラグイン 開発してみた

Slide 5

Slide 5 text

Demo

Slide 6

Slide 6 text

嘘つけ！ コード書けないだろ！

Slide 7

Slide 7 text

そうです

Slide 8

Slide 8 text

何周か学習はしたけど 実務で自分がコードを 書いたことはほぼない！

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

じゃあどうやってつくったん？

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

きっかけ

Slide 13

Slide 13 text

Figmaプラグインってどうやって作るん ですか？

Slide 14

Slide 14 text

Figmaプラグインってどうやって作るん ですか？ Figmaプラグインを作るのは、プログラミン グの経験が少しあればそれほど難しくありま せん。特にJavaScriptに慣れていればス ムーズに進められます。

 Figmaプラグインは、Figmaが提供してい るPlugin APIを使って開発します。 


Slide 15

Slide 15 text

ざっくり手順

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

No content

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

No content

Slide 25

Slide 25 text

No content

Slide 26

Slide 26 text

No content

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

もちろん いろんなことに つまづく

Slide 30

Slide 30 text

ど゛う゛し゛て゛だ゛よ゛ぉ゛ぉ゛!゛!゛

Slide 31

Slide 31 text

エラーのサマリと対処法を教えて このファイルあんまいじらない方がいいっぽいから極力編集 せずやってみて このディレクトリ構成で合ってるよね？（写真添付） うまくいく自信は何%?理由は？ うまく指示・質問をして前に進める

Slide 32

Slide 32 text

このカラーコード変えたから次出力するために覚えておいて レイアウトはこんな感じで！ 本当に正しい？ハルシネーションはやめてね ほかにもこんな指示をしたよ

Slide 33

Slide 33 text

なぜ楽しくやれた？

Slide 34

Slide 34 text

わたしの2大苦手ポイント

Slide 35

Slide 35 text

わたしの2大苦手ポイント 説明書読めない コマンドラインこわい

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

これを対処でき、 知識や経験などのハードスキルもAIで補えば あとは作るだけ！楽しい！

Slide 38

Slide 38 text

気をつけたこと

Slide 39

Slide 39 text

「何をしているか」は 理解しておく

Slide 40

Slide 40 text

コマンドの意味とか語源をわかりやすく教えて さっきからnpm run buildを何回もさせられてるけど何やっ てるの？やらないとどうなるの？ それってデザイナー業界で置き換えるとなに？ スマートオブジェクトってこと？

Slide 41

Slide 41 text

ツールのクセを理解する

Slide 42

Slide 42 text

No content

Slide 43

Slide 43 text

やってみて 気づいたこと

Slide 44

Slide 44 text

このやり方で必要なのは、ある程度の前提知識と

Slide 45

Slide 45 text

このやり方で必要なのは、ある程度の前提知識と 問題解決力と質問力

Slide 46

Slide 46 text

ビジネスマンなら、誰でも 挑戦してみることはできる！

Slide 47

Slide 47 text

世の中にプラグインはすでにたくさんあるが、 自分たちのかゆいところは 自分たちでしかかけない！

Slide 48

Slide 48 text

これから

Slide 49

Slide 49 text

もっとうまく付き合える AIと出会う

Slide 50

Slide 50 text

自動化できるタスクは 全部自動化したい！

Slide 51

Slide 51 text

生産性を高めて 短期で爆デカ成果 あげようぜ！