Гэты артыкул спансуецца Penpot Уявіце, што ваш файл Penpot змяшчае поўны набор значкоў у дадатак да самога дызайну, які выкарыстоўвае некаторыя, але не ўсе з гэтых значкоў. Калі б вы папрасілі штучны інтэлект, напрыклад, Клод або Блізняты, экспартаваць толькі значкі, якія выкарыстоўваюцца, ён не змог бы гэтага зрабіць. Ён не можа ўзаемадзейнічаць з файламі Penpot. Аднак сервер Penpot MCP можа. Ён можа выконваць падабраную колькасць аперацый у адпаведнасці з зададзенымі правіламі і дазволамі, тым больш, што Penpot мае шырокі API і тым больш, што гэта з адкрытым зыходным кодам. Задача штучнага інтэлекту проста зразумець ваш намер, выбраць правільную аперацыю для выканання серверам MCP (у дадзеным выпадку экспарт) і перадаць любыя параметры (напрыклад, значкі, якія выкарыстоўваюцца). Затым сервер MCP перакладае гэта ў структураваны запыт API і выконвае яго. Можа дапамагчы ўявіць штучны інтэлект як сервер у рэстаране, які прымае ваш заказ, сервер MCP як меню і шэф-повара, а запыт API як (спадзяюся) гарачы пірог з піцай на цёплай талерцы. Чаму менавіта серверы MCP? Што ж, Penpot не можа зразумець ваш намер, таму што ён не з'яўляецца LLM, а таксама не дазваляе староннім LLM ўзаемадзейнічаць з вашымі файламі Penpot для бяспекі і канфідэнцыяльнасці вашых дадзеных Penpot. Хаця серверы Penpot MCP сапраўды дзейнічаюць як бяспечны мост, пераводзячы намер AI у запыты API з выкарыстаннем вашых файлаў і даных Penpot у якасці кантэксту. Што яшчэ лепш, так гэта тое, што Penpot выкарыстоўвае падыход дызайну, выражанага ў выглядзе кода, дызайн можна праграмна ствараць, рэдагаваць і аналізаваць на дэталёвым узроўні. Гэта больш кантэкстны, больш канкрэтны і, такім чынам, больш магутны ў параўнанні з тым, што прапануюць іншыя серверы MCP, і значна больш прадуманы, чым недарэчны працоўны працэс штучнага інтэлекту «Апісаць → Стварыць», які, я думаю, нікому не патрэбны. У тэхнічным дакуменце Penpot AI гэта апісваецца як дрэнны падыход, а падыход «Пераўтварыць у код» як пачварны падыход, у той час як серверы MCP больш дасканалыя і адаптыўныя. Характарыстыкі і тэхнічныя дэталі Перш чым мы пяройдзем да варыянтаў выкарыстання, вось некаторыя функцыі і тэхнічныя дэталі, якія дадаткова тлумачаць, як працуюць серверы Penpot MCP:
Адпавядае стандартам MCP; Інтэгруецца з Penpot API для праектных дадзеных у рэжыме рэальнага часу; Уключае Python SDK, REST API, сістэму плагінаў і інструменты CLI; Працуе з любым памочнікам штучнага інтэлекту з падтрымкай MCP (Claude у VS Code, Claude у Cursor, Claude Desktop і г.д.); Падтрымлівае абмен кантэкстам дызайну з мадэлямі штучнага інтэлекту і дазваляе ім бачыць і разумець кампаненты; Палягчае зносіны з Penpot з дапамогай натуральнай мовы.
Што тады серверы MCP могуць дазволіць нам рабіць у Penpot і чаго ўжо дасягнулі існуючыя эксперыменты? Давайце паглядзім. Прыклады выкарыстання сервера Penpot MCP Калі вы проста хочаце перайсці да таго, што могуць зрабіць серверы Penpot MCP, у Penpot ёсць некалькі дэманстрацый MCP, схаваных на Google Drive, якія больш чым вартыя прагляду. Генеральны дырэктар Penpot Пабла Руіс-Мускіз адзначыў, што відэа 03, 04, 06, 08 і 12 з'яўляюцца іх любімымі. Яшчэ больш хуткі спосаб абагульніць серверы MCP - гэта паглядзець прэзентацыю Penpot Fest 2025. У адваротным выпадку, давайце паглядзім на некаторыя з больш вытанчаных прыкладаў, якія Penpot прадэманстраваў у сваёй публічнай вітрыне. Дызайн да кода і назад (і многае іншае) Працягваючы тое, што я казаў раней пра тое, як канструкцыі Penpot выяўляюцца ў выглядзе кода, гэта азначае, што серверы MCP могуць выкарыстоўвацца для пераўтварэння дызайну ў код з дапамогай штучнага інтэлекту, а таксама для пераўтварэння кода ў дызайн, дызайну ў дакументацыю, дакументацыі ў элементы сістэмы праектавання, зноў дызайну ў код на аснове згаданай сістэмы праектавання, а затым цалкам новых кампанентаў на аснове згаданай сістэмы праектавання. Гэта гучыць сюррэалістычна, але прыведзеная ніжэй дэманстрацыя дэманструе гэтую магчымасць пераўтварэння, і гэта не з расплывістых інструкцый, а хутчэй з папярэдніх выбараў дызайну, незалежна ад таго, як яны былі выяўлены (дызайн, код або дакументацыя). Тут няма ніякіх сюрпрызаў - гэта проста рашэнні, якія вы ўсё роўна прынялі б на аснове папярэдніх рашэнняў, выкананых хутка. У дэманстрацыі Хуан дэ ла Крус Гарсія, дызайнер Penpot, бесперашкодна трансмутуе некаторыя простыя кампаненты ў дакументацыю, элементы сістэмы дызайну, код, новыя кампаненты і нават поўны праект Storybook, як у Play-Doh: Праектаванне ў код, праверка дызайну/кода і простыя аперацыі У падобнай дэманстрацыі ніжэй Дамінік Джайн, сузаснавальнік Oraios AI, стварае вэб-прыкладанне Node.js на аснове дызайну перад абнаўленнем стыляў інтэрфейсу, захоўвае імёны і ідэнтыфікатары ў памяці, каб забяспечыць плыўны пераклад дызайну ў код, перш чым правяраць яго на ўзгодненасць, дадаекаментарый побач з абранай фігурай у Penpot, а затым замяняе каракулі ў Penpot на адаптаваны кампанент. Тут шмат чаго адбываецца, але вы можаце дакладна бачыць, што Дамінік уводзіць у Claude Desktop, а таксама адказы Клода, і гэта вельмі дакладна: Дарэчы, у папярэдняй дэманстрацыі Claude выкарыстоўваўся ў VS Code, таму я павінен адзначыць, што серверы Penpot MCP не залежаць ад LLM. Ваш набор тэхналогій цалкам залежыць ад вас. IvanTheGeek здолеў наладзіць свой сервер MCP з JetBrains Rider IDE і Junie AI. Іншыя выпадкі выкарыстання Перавядзіце дошку Penpot у гатовы да вытворчасці семантычны HTML і модульны CSS, выкарыстоўваючы любыя токены дызайну Penpot (памятайце, што дызайн Penpot ужо выражаны ў выглядзе кода, так што гэта не стрэл у цемру): Стварыце інтэрактыўны вэб-прататып без змены існуючага HTML: Як было паказана раней, пераўтварыце каракулі ў кампанент, выкарыстоўваючы існуючы дызайн і/або элементы сістэмы дызайну: Стварыце дакументацыю сістэмы праектавання з файла Penpot: А вось яшчэ некалькі варыянтаў выкарыстання ад Penpot і супольнасці:
Пашыраны экспарт, Пошук элементаў дызайну з дапамогай натуральнай мовы, Атрымлівайце даныя са знешніх API з дапамогай натуральнай мовы, Лёгка падключыце Penpot да іншых знешніх інструментаў, Захаванне паўтаральных задач у памяці і іх выкананне, Тэставанне візуальнай рэгрэсіі, Праверка ўзгодненасці дызайну і празмернасці, Аналіз даступнасці і зручнасці выкарыстання і водгукі, Праверка адпаведнасці сістэмы праектавання, Праверка адпаведнасці інструкцыям (брэнд, змест і г.д.), Сачыце за прыняццем і выкарыстаннем з дапамогай аналітыкі дызайну, Аўтаматычна падтрымліваць дакументацыю ў адпаведнасці з дызайнам, Дызайн арганізацыі файлаў (напрыклад, тэгі/катэгарызацыі).
Па сутнасці, серверы Penpot MCP вядуць шлях да бясконцай колькасці працоўных працэсаў дзякуючы эфектыўнасці і лёгкасці абранага вамі кліента LLM/LLM, але не падвяргаючы яму ўздзеяння вашы даныя. Для чаго б вы выкарыстоўвалі серверы MCP? Серверы Penpot MCP нават не знаходзяцца на стадыі бэта-версіі, але гэта актыўны эксперымент, у якім вы можаце прыняць удзел. Карыстальнікі Penpot ужо пачалі вывучаць варыянты выкарыстання сервераў MCP, але Penpot хоча бачыць больш. Каб гарантаваць, што наступнае пакаленне інструментаў дызайну адпавядае патрэбам дызайнераў, распрацоўшчыкаў і груп прадуктаў у цэлым, яны павінны стварацца калектыўна і сумесна, асабліва калі гаворка ідзе пра ІІ. Заўвага: Penpot шукае бэта-тэстэраў, якія жадаюць даследаваць, эксперыментаваць і дапамагаць удасканальваць сервер MCP Penpot. Каб далучыцца, напішыце на support@penpot.app з тэмай «Валанцёр бэта-тэставання MCP». Як вы лічыце, што серверы Penpot MCP могуць зрабіць што-небудзь, што сучасныя інструменты не могуць зрабіць дастаткова добра, дастаткова хутка або наогул не могуць зрабіць? Вы можаце даведацца, як наладзіць сервер Penpot MCP прама тут, і пачаць майстраваць сёння, або, калі ваш мозг ужо кішыць ідэямі, Penpot хоча, каб вы далучыліся да абмеркавання, падзяліліся сваімі водгукамі і пагаварылі аб сваіх варыянтах выкарыстання. У якасці альтэрнатывы, раздзел каментарыяў прама ўнізе таксама не з'яўляецца дрэнным месцам для пачатку!
