Kære abonnenter, I dag vil jeg dele en ny episode med Felix Lee. Felix har lært 1000-vis af designere, hvordan man koder med Claude Code og Figma MCP. Jeg fik ham til at vise mig, hvordan han konverterer et Figma-design til et fungerende websted og konverterer et websted tilbage til redigerbare lag i Figma. En designer, der kan sende, er en af de mest værdifulde ansættelser inden for teknologi i dag – lær hvordan ved at se denne episode. Se nu på YouTube, Apple og Spotify. Felix og jeg talte om:(00:00) 3 produkter Felix designet og bygget i Claude Code(06:36) Opbygning af et 3D animeret verdenskort i one-shot(07:50) Felix's app, der analyserer hvor god din landingsside er(13:17) Demo: Figma design til fungerende hjemmeside på 15 min. Fig. spil(31:30) En UX-anmelderfærdighed til designfeedback(40:19) Sådan eksporteres kode tilbage til Figma som redigerbare designs(45:10) Hvorfor de fleste designere ikke tilpasser sig hurtigt nok Jeg er stolt af at samarbejde med ReplitReplits Agent 4 er den bedste måde for teams at arbejde med AI-agenter på. Du kan bruge det til at:Udforske designvariationer på et uendeligt lærred.Bygge ved hjælp af flere AI-agenter på én gang ved hjælp af en opgavebræt.Generer smukke slide-decks, animationer og mere i ét skud.Prøv Agent 4 i 3 måneder gratis ved at bruge min kode PYANG26 ved kassen. Få gentagelse i 3 måneder gratisTop 10 takeaways, jeg lærte af denne episode.Hvis du bruger Figma, er Figma MCP den bedste måde at gå fra design til kode:Installer. I din terminal skal du køre "claude mcp add --transport http figma https://mcp.figma.com/mcp"Authenticate. Åbn Claude Code, skriv "/mcp", og vælg derefter Figma. Det åbner din browser, så du kan autentificere MCP'en med din Figma-konto. Kopier en Figma-ramme. Gå nu til et af dine Figma-designs og højreklik på en ramme eller ethvert lag. Vælg "Kopier link til valg", og indsæt derefter linket i Claude Code med prompten: "Byg dette design." Det er så enkelt som det. Konverter kode tilbage til redigerbare Figma-lag for at udforske flere designvarianter. Sådan gør du dette trin for trin efter opsætning af Figma MCP: Læs mere
Sådan designes og kodes med Claude Code og Figma MCP på 50 min. | Felix Lee
By Creator Economy
·
·
2 min read
·
320 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