مشترکین عزیز، امروز میخواهم یک قسمت جدید را با فلیکس لی به اشتراک بگذارم. فلیکس به 1000 طراح آموزش داده است که چگونه با Claude Code و Figma MCP کدنویسی کنند. از او خواستم تا به من نشان دهد که چگونه یک طرح Figma را به یک وب سایت کارآمد تبدیل می کند و یک وب سایت را به لایه های قابل ویرایش در Figma تبدیل می کند. طراحانی که می توانند ارسال کنند، یکی از با ارزش ترین افرادی است که امروزه در فناوری استخدام می شوند — با تماشای این قسمت چگونه یاد بگیرید. اکنون در YouTube، Apple و Spotify تماشا کنید. من و فلیکس در مورد: (00:00) 3 محصول طراحی و ساخت فلیکس در کلود کد (06:36) ساخت یک نقشه جهانی متحرک سه بعدی در یک شات (07:50) برنامه فلیکس که سطح صفحه فرود شما را تجزیه و تحلیل می کند (13:17) نسخه نمایشی: طراحی Figma برای وب سایت کارکرده 23چار تا 17 دقیقه بازی (31:30) مهارت بازبینی UX برای بازخورد طراحی (40:19) نحوه بازگرداندن کد به Figma به عنوان طرحهای قابل ویرایش (45:10) چرا اکثر طراحان به اندازه کافی سریع تطبیق نمیدهند من مفتخرم که با ReplitReplit's Agent 4 همکاری میکنم بهترین راه برای تیمها برای کار با عوامل هوش مصنوعی است. میتوانید از آن برای:کاوش تغییرات طراحی روی بوم بینهایت با استفاده از چندین عامل هوش مصنوعی با استفاده از یک صفحه کار استفاده کنید. اسلایدهای زیبا، انیمیشنها و موارد دیگر را در یک عکس ایجاد کنید. با استفاده از کد من PYANG26 در هنگام پرداخت، Agent 4 را به مدت 3 ماه رایگان امتحان کنید. دریافت Replit برای 3 ماه FreeTop 10 پیشنهادی که از این قسمت یاد گرفتم اگر از Figma استفاده می کنید، Figma MCP بهترین راه برای رفتن از طراحی به کد است: نصب. در ترمینال خود، “claude mcp add --transport http figma https://mcp.figma.com/mcp”Authenticate را اجرا کنید. Claude Code را باز کنید، "/mcp" را تایپ کنید و سپس Figma را انتخاب کنید. مرورگر شما را برای شما باز می کند تا MCP را با حساب Figma خود احراز هویت کنید. یک فریم Figma را کپی کنید. حالا به یکی از طرح های Figma خود بروید و روی هر قاب یا لایه کلیک راست کنید. "Copy link to selection" را انتخاب کنید و سپس پیوند را در Claude Code با اعلان قرار دهید: "Build this design". به همین سادگی است. برای بررسی تغییرات طراحی بیشتر، کد را به لایه های قابل ویرایش Figma تبدیل کنید. در اینجا نحوه انجام این کار گام به گام پس از راه اندازی Figma MCP آورده شده است: ادامه مطلب
نحوه طراحی و کدنویسی با Claude Code و Figma MCP در 50 دقیقه | فلیکس لی
By Creator Economy
·
·
2 min read
·
294 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