Përdorim Google Analytics për statistikat e trafikut. Cookie-t e analitikës vendosen vetëm nëse i pranon. Pa pëlqim, statistikat vlerësohen nga sinjale pa cookie. Politika e cookie-ve.
PDS · Design System
PDS është gjuha e dizajnit e vetë Protocore, e nxjerrë nga produktet që ndërtojmë dhe e forcuar në prodhim. Dark-first, e bazuar në tokena dhe e dokumentuar plotësisht — të njëjtët komponentë që shfaqin produktet tona dhe dashboard-et e klientëve, të paketuar që një ekip t'i adoptojë brenda një pasditeje.
Veçoritë
Nga primitivët te kompozimet e plota të faqeve — 101 komponentë, secili i nxjerrë nga një produkt që e dorëzojmë, jo i dizajnuar në izolim. Nëse një komponent është në PDS, ka bërë tashmë punë të vërtetë: kjo faqe, demot e produkteve dhe dashboard-et e klientëve tanë ndërtohen mbi të.
Ngjyra, tipografia, hapësira dhe lëvizja vijnë nga një shtresë e vetme token-ësh. Ndrysho një token dhe çdo komponent e ndjek — pa mbishkrime për komponent, pa shmangie mes produkteve.
Një temë e errët dhe një e çelët, pesë ngjyra theksi, të gjitha të drejtuara nga të njëjtat token-e. Ndryshimi i brendit është një këmbim token-ësh, jo një fork — çdo produkt i familjes ndërtohet nga i njëjti sistem.
Kontrasti, ngritja dhe ngjyra punohen së pari në temën e errët; tema e çelët rrjedh nga të njëjtat token-e. Rezultati është një dark mode që ndihet natyral, jo i përmbysur.
Butona, fusha, select-e, switch-e, slider-a dhe skeleti i fushave — me etiketa, ndihma dhe gabime. Gjendjet janë dizajnuar tashmë: focus, disabled, invalid dhe loading sillen njësoj në çdo produkt.
Stack-e, grid-e, ndarës dhe guaska faqesh ndërtojnë ekranet pa CSS ad-hoc. Komponentët më të mëdhenj janë kompozime të plota faqesh — modele hero, seksioni dhe footer-i marrë nga faqet që dorëzojmë.
Header-a, tab-e, breadcrumb-e dhe menu me sjelljen responsive dhe të tastierës të integruar. Navigimi i kësaj faqeje është vetë komponenti, jo një imitim i tij.
Modale, sheet-e, drawer-a, popover-a dhe tooltip-e në një model të vetëm shtresimi — kapja e fokusit, mbyllja dhe renditja zgjidhen një herë, qendrësisht. Asnjë produkt nuk ka aritmetikën e vet të z-index.
Tabela, lista, pllaka statistikash, badge-e dhe timeline për produkte që jetojnë mbi numra. Dendësia e konsolave të operatorëve në të gjithë familjen vjen nga këta komponentë.
Toast-e, banner-a, gjendje bosh, progres dhe skeleton-e — gjendjet e pavëmendshme, të dizajnuara që në fillim. Një produkt i ndërtuar mbi PDS ka një përgjigje të menduar për ngarkim, bosh dhe dështim.
Një shkallë tipografike editoriale me etiketa mono për regjistrin teknik — zëri që e sheh në çdo sipërfaqe të Protocore. Shkalla është token-e, ndaj produktet e akordojnë pa dalë nga sistemi.
Kohëzgjatjet dhe easing-et vijnë si token-e, me komponentët që i përdorin tashmë. Ndërfaqet lëvizin njësoj në çdo produkt, sepse askush nuk e rivendos animacionin me dorë.
Kontrasti, gjendjet e fokusit dhe sjellja e tastierës janë të integruara në komponentë, jo të lëna si ushtrim. Dorëzo parazgjedhjet dhe aksesueshmëria vjen me to.
Stilizimi është CSS statik i zgjidhur gjatë build-it — pa runtime CSS-in-JS, pa asgjë të llogaritur në shfletues. Shtresa e stilizimit shton zero JavaScript në faqe.
Sistemi vjen edhe si paketë e thjeshtë CSS — token-e dhe klasa utility pa nevojë për React. Faqet e renderuara në server, email-et dhe stack-et pa React marrin nga e njëjta burim të vërtete.
Token-et eksportohen për web si variabla CSS, si preset Tailwind dhe në formate native për platformat mobile. Një përkufizim i vetëm i brendit, i përdorur kudo ku punon produkti.
Shtresa React e mbështjell aplikacionin me një provider dhe i ekspozon token-et përmes hooks — komponentët lexojnë temën dhe theksin aktiv në vend që të ngulin vlera. Ndërrimi i temës është gjendje, jo rindërtim.
Mekanizmi që i jep PDS pesë theksa i jep një produkti whitelabel brendin e vet: ndërro vlerat e token-eve, mbaji komponentët. Çdo aplikacion whitelabel i familjes është provë që funksionon.
Një hartë e lexueshme nga makina e të gjithë sistemit — komponentë, token-e, modele — e publikuar si llms.txt. Drejtoje një LLM drejt saj dhe kodi i gjeneruar përdor komponentë realë të PDS, jo të shpikur që duken të besueshëm.
Një server MCP e ekspozon sistemin drejtpërdrejt te agjentët e kodimit: komponentë, props dhe token-e, të kërkueshme ndërsa agjenti ndërton. Sistemi i dizajnit përgjigjet në pyetje, në vend që të ngjitet në prompte.
Çdo komponent jeton te pds.protocore.io me shembuj live, props dhe kod për kopjim. Dokumentimi ndërtohet mbi vetë PDS — çfarë lexon është çfarë dorëzon.
PDS vjen si paketa me versione semantike dhe changelog. Përditësimet janë të qëllimshme: ekipi kalon kur zgjedh vetë, dhe changelog-u thotë saktësisht çfarë ndryshoi.
Paketat instalohen nga regjistri privat npm i Protocore me një token për ekip në .npmrc — rrjedha standarde e npm, e kufizuar te ekipet me licencë. Pa skedarë zip të ngulur, pa instalime me kopjim.
Një çelës licence i nënshkruar verifikohet lokalisht — pa phone-home, pa kontroll rrjeti në build. Problemet e licencimit shfaqen si paralajmërime gjatë zhvillimit dhe nuk prishin kurrë një aplikacion në produksion.
PDS është pronësor dhe licencohet për ekip. Kërko qasje dhe të konfigurojmë — paketa, dokumentim dhe burime token-ësh — që një ekip ta adoptojë brenda një pasditeje.
FAQ
Për ekip — jo për përdorues apo projekt. Një licencë mbulon të gjithë ata që ndërtojnë me PDS brenda një ekipi: tokenat, komponentët dhe dokumentacionin. Kostoja rritet vetëm me numrin e ekipeve që e adoptojnë, asgjë tjetër, dhe produktet whitelabel që ndërtojmë për ju funksionojnë tashmë mbi të.
Nga regjistri privat në npm.protocore.io. Kredencialet e qasjes i lejojnë build-it tuaj të tërheqë paketat @protocore; pastaj tokenat dhe komponentët instalohen si çdo varësi tjetër.
Tokenat gjenerohen për web, .NET dhe native, kështu që një ngjyrë ose rreth këndesh nënkupton të njëjtën gjë në çdo platformë që publikoni. Komponentët jepen për React, dhe një shtresë CSS e pavarur nga framework-u mbart të njëjtët tokena dhe klasa për ekipet që nuk përdorin React.
Dark-first dhe i aksesueshëm si parazgjedhje — dy tema, pesë theksa, të gjitha të drejtuara nga tokenat, me CSS zero-runtime që stilizimi të mos kushtojë asgjë gjatë ngarkimit. Të njëjtët komponentë ndërtojnë produktet tona dhe dashboard-et e klientëve.
Është ndërtuar për këtë: një hartë llms.txt dhe një server MCP u lejojnë agjentëve ta lexojnë sistemin dhe të ndërtojnë saktë me të, ndërsa pds.protocore.io ka shembuj live, props dhe kod për kopjim për çdo komponent dhe token.
ÇMIMET
PDS licencohet për ekip, jo për përdorues apo projekt — një licencë mbulon të gjithë ata që ndërtojnë me të brenda ekipit: tokenat, komponentët dhe dokumentacionin.
Filloni me një ekip dhe zgjerojeni te të tjerët ndërsa adoptimi rritet. Kostoja varet vetëm nga numri i ekipeve që ndërtojnë mbi PDS, asgjë tjetër.
Produktet whitelabel që ndërtojmë për ju funksionojnë tashmë mbi PDS — licenca e pavarur është për ekipet që e adoptojnë në produktet e veta.
Licencimi ndjek ekipet, jo numrin e punonjësve apo përdorimin. Kërkoni qasje dhe do ta përcaktojmë sipas ekipeve që do të ndërtojnë me të.
Vlerësoni
Shfletoni sistemin e plotë në pds.protocore.io — shembuj live, props dhe kod për kopjim për çdo komponent dhe token.
Tokenat e dizajnit të gjeneruar për web, .NET dhe native, që një ngjyrë ose rreth këndesh të nënkuptojë të njëjtën gjë në çdo platformë që publikoni.
PDS licencohet për ekip — një licencë mbulon të gjithë ata që ndërtojnë me të, si tokenat, komponentët, ashtu edhe dokumentacionin.
Kredencialet për regjistrin privat në npm.protocore.io, për të instaluar paketat @protocore që build-i juaj tërheq.
PDS është pronësore dhe licencohet për çdo ekip. Kërkoni qasje dhe do ta konfigurojmë për ju.
Gjithçka më sipër funksionon në demo prodhimi që mund t'jua shfaqim — të pavarura, whitelabel, ose si një platformë e vetme. Na tregoni çfarë po ndërtoni dhe do t'ju tregojmë rrugën më të shkurtër.
