Liebe Abonnenten, heute möchte ich eine neue Folge mit Felix Lee teilen. Felix hat Tausenden von Designern beigebracht, wie man mit Claude Code und Figma MCP programmiert. Ich habe ihn gebeten, mir zu zeigen, wie er ein Figma-Design in eine funktionierende Website umwandelt und eine Website in Figma wieder in bearbeitbare Ebenen umwandelt. Ein Designer, der liefern kann, ist heute einer der wertvollsten Mitarbeiter in der Technologiebranche – erfahren Sie, wie das geht, indem Sie sich diese Episode ansehen. Jetzt auf YouTube, Apple und Spotify ansehen. Felix und ich haben über Folgendes gesprochen: (00:00) 3 Produkte, die Felix in Claude Code entworfen und gebaut hat (06:36) Erstellen einer 3D-animierten Weltkarte in einem Schlag (07:50) Felix' App, die analysiert, wie gut Ihre Zielseite ist (13:17) Demo: Figma-Design in 15 Minuten zur funktionierenden Website (23:07) Demo: FigJam-Flussdiagramm zu einem funktionierenden Spiel (31:30) Eine UX-Reviewer-Fähigkeit für Design Feedback (40:19) So exportieren Sie Code als bearbeitbare Designs zurück nach Figma (45:10) Warum sich die meisten Designer nicht schnell genug anpassenIch bin stolz auf die Partnerschaft mit ReplitReplits Agent 4 ist die beste Möglichkeit für Teams, mit KI-Agenten zusammenzuarbeiten. Sie können es verwenden, um:Designvariationen auf einer unendlichen Leinwand zu erkunden.Mit mehreren KI-Agenten gleichzeitig über ein Taskboard zu erstellen.Schöne Foliendecks, Animationen und mehr auf einmal zu erstellen.Testen Sie Agent 4 3 Monate lang kostenlos, indem Sie an der Kasse meinen Code PYANG26 verwenden. Erhalten Sie Replit 3 Monate lang kostenlos. Die 10 wichtigsten Erkenntnisse, die ich aus dieser Episode gelernt habe. Wenn Sie Figma verwenden, ist Figma MCP der beste Weg, um vom Design zum Code zu gelangen: Installieren. Führen Sie in Ihrem Terminal „claude mcp add --transport http figma https://mcp.figma.com/mcp“ aus. Öffnen Sie Claude Code, geben Sie „/mcp“ ein und wählen Sie dann Figma. Es öffnet Ihren Browser, damit Sie den MCP mit Ihrem Figma-Konto authentifizieren können. Kopieren Sie einen Figma-Frame. Gehen Sie nun zu einem Ihrer Figma-Designs und klicken Sie mit der rechten Maustaste auf einen beliebigen Rahmen oder eine beliebige Ebene. Wählen Sie „Link zur Auswahl kopieren“ und fügen Sie dann den Link mit der Aufforderung „Dieses Design erstellen“ in Claude Code ein. So einfach ist das: Konvertieren Sie Code zurück in bearbeitbare Figma-Ebenen, um weitere Designvarianten zu erkunden. So gehen Sie nach der Einrichtung von Figma MCP Schritt für Schritt vor: Lesen Sie mehr
So entwerfen und programmieren Sie mit Claude Code und Figma MCP in 50 Minuten | Felix Lee
By Creator Economy
·
·
2 min read
·
169 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
