購読者の皆様、今日はフェリックス・リーとの新しいエピソードを共有したいと思います。 Felix は、何千人ものデザイナーに Claude Code と Figma MCP を使ったコーディング方法を教えてきました。私は彼に、Figma のデザインを実際に動作する Web サイトに変換する方法と、Web サイトを Figma で編集可能なレイヤーに戻す方法を見せてもらいました。出荷できるデザイナーは、今日のテクノロジー業界で最も貴重な人材の 1 人です。このエピソードを見てその方法を学びましょう。YouTube、Apple、Spotify で今すぐ視聴できます。 Felix と私は次のことについて話しました:(00:00) Felix が設計し、Claude Code で構築した 3 つの製品(06:36) ワンショットで 3D アニメーション世界地図を構築(07:50) ランディング ページがどれほど優れているかを分析する Felix のアプリ(13:17) デモ: Figma のデザインから 15 分で動作する Web サイトまで(23:07) デモ: FigJam のフローチャートから動作するゲーム(31:30) UXデザイン フィードバックのためのレビュー担当者のスキル(40:19) コードを編集可能なデザインとして Figma にエクスポートする方法(45:10) ほとんどのデザイナーが十分な速さで適応していない理由Replit と提携できることを誇りに思いますReplit の Agent 4 は、チームが AI エージェントと連携するための最良の方法です。これを使用すると、次のことが可能になります。 無限のキャンバスでデザインのバリエーションを探索する タスク ボードを使用して、複数の AI エージェントを同時に使用して構築する。 美しいスライド デッキ、アニメーションなどを 1 回のショットで生成する。 チェックアウト時にコード PYANG26 を使用して、Agent 4 を 3 か月間無料でお試しください。 Replit を 3 か月間無料で入手するこのエピソードから学んだトップ 10 のポイントFigma を使用する場合、設計からコードに移行する最良の方法は Figma MCP です。インストールします。ターミナルで「claude mcp add --transport http figma https://mcp.figma.com/mcp」を実行して認証します。 Claude Code を開き、「/mcp」と入力して、Figma を選択します。ブラウザが開き、Figma アカウントで MCP を認証できます。Figma フレームをコピーします。次に、Figma デザインの 1 つに移動し、任意のフレームまたはレイヤーを右クリックします。 「リンクを選択範囲にコピー」を選択し、「このデザインをビルドしてください」というプロンプトとともにリンクをクロード コードに貼り付けます。とてもシンプルです。コードを編集可能な Figma レイヤーに変換して戻し、より多くのデザインのバリエーションを探索します。 Figma MCP のセットアップ後にこれを段階的に行う方法は次のとおりです。 続きを読む
Claude Code と Figma MCP を使用して 50 分で設計およびコーディングする方法 |フェリックス・リー
By Creator Economy
·
·
2 min read
·
230 views
Read in:
aa
ace
af
ak
alz
am
ar
as
awa
ay
az
ba
ban
be
bew
+191 more
bg
bho
bik
bm
bn
brx
bs
bug
ca
ceb
cgg
ckb
co
crh
cs
cv
cy
da
de
din
doi
dv
dyu
dz
ee
el
en
eo
es
et
eu
fa
ff
fi
fj
fo
fr
fur
fy
ga
gd
gl
gom
gn
gu
ha
haw
he
hi
hil
hne
hmn
hr
hrx
ht
hu
hy
id
ig
ilo
is
it
ja
jam
jv
ka
kab
kbp
kg
kha
kk
kl
km
kn
ko
kri
ku
ktu
ky
la
lb
lg
li
lij
ln
lo
lmo
lt
ltg
lua
luo
lus
lv
mai
mak
mg
mi
min
mk
ml
mn
mni-mtei
mos
mr
ms
mt
my
nd
ne
nl
nn
no
nr
nso
nus
ny
oc
om
or
pa
pag
pam
pap
pl
ps
pt
pt-br
qu
rn
ro
ru
rw
sa
sah
sat
sc
scn
sg
si
sk
sl
sm
sn
so
sq
sr
ss
st
su
sus
sv
sw
szl
ta
tcy
te
tg
th
ti
tiv
tk
tl
tn
to
tpi
tr
trp
ts
tt
tum
ty
udm
ug
uk
ur
uz
ve
vec
vi
war
wo
xh
yi
yo
yua
yue
zap
zh
zh-hk
zh-tw
zu
