Kära prenumeranter, Idag vill jag dela ett nytt avsnitt med Felix Lee. Felix har lärt 1000-tals designers hur man kodar med Claude Code och Figma MCP. Jag fick honom att visa mig hur han konverterar en Figma-design till en fungerande webbplats och konverterar en webbplats tillbaka till redigerbara lager i Figma. En designer som kan skicka är en av de mest värdefulla anställningarna inom tekniken idag – lär dig hur genom att titta på det här avsnittet. Se nu på YouTube, Apple och Spotify. Felix och jag pratade om:(00:00) 3 produkter Felix designade och byggde i Claude Code(06:36) Bygga en 3D-animerad världskarta i ett skott(07:50) Felix app som analyserar hur bra din landningssida är(13:17) Demo: Figma design till fungerande webbplats på 15 min(23:07) flöde Fig. spel(31:30) En UX-granskare skicklighet för designfeedback(40:19) Hur man exporterar kod tillbaka till Figma som redigerbara designs(45:10) Varför de flesta designers inte anpassar sig tillräckligt snabbt Jag är stolt över att samarbeta med ReplitReplits Agent 4 är det bästa sättet för team att arbeta med AI-agenter. Du kan använda den för att:Utforska designvarianter på en oändlig dukBygga med flera AI-agenter samtidigt med hjälp av en aktivitetstavla.Skapa vackra bildspel, animationer och mer i en bild.Testa Agent 4 i 3 månader gratis genom att använda min kod PYANG26 i kassan. Få Replit i 3 månader gratisTop 10 takeaways jag lärde mig från det här avsnittet Om du använder Figma är Figma MCP det bästa sättet att gå från design till kod: Installera. I din terminal, kör "claude mcp add --transport http figma https://mcp.figma.com/mcp"Authenticate. Öppna Claude Code, skriv "/mcp" och välj sedan Figma. Det öppnar din webbläsare så att du kan autentisera MCP med ditt Figma-konto. Kopiera en Figma-ram. Gå nu till en av dina Figma-designer och högerklicka på valfri ram eller lager. Välj "Kopiera länk till urval" och klistra sedan in länken i Claude Code med uppmaningen: "Bygg den här designen." Så enkelt är det. Konvertera tillbaka koden till redigerbara Figma-lager för att utforska fler designvarianter. Så här gör du detta steg för steg efter att du har konfigurerat Figma MCP: Läs mer
Hur man designar och kodar med Claude Code och Figma MCP på 50 min | Felix Lee
By Creator Economy
·
·
2 min read
·
201 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