ট্রাফিক পরিসংখ্যানের জন্য আমরা Google Analytics ব্যবহার করি। আপনি সম্মতি দিলেই কেবল অ্যানালিটিক্স কুকি সেট হয়। সম্মতি না দিলে কুকিবিহীন সিগন্যাল থেকে পরিসংখ্যান অনুমান করা হয়। কুকি নীতি.
PDS · ডিজাইন সিস্টেম
PDS হলো Protocore-এর নিজস্ব ডিজাইন ল্যাংগুয়েজ, যা আমাদের বানানো প্রোডাক্ট থেকে নেওয়া এবং প্রোডাকশনে পোক্ত হয়েছে। Dark-first, টোকেন-চালিত এবং শুরু থেকে শেষ পর্যন্ত ডকুমেন্টেড — আমাদের প্রোডাক্ট ও ক্লায়েন্ট ড্যাশবোর্ডে যে কম্পোনেন্ট চলে, সেগুলোই এমনভাবে প্যাকেজ করা যে একটি টিম এক বিকেলেই গ্রহণ করতে পারে।
ফিচার
প্রিমিটিভ থেকে পূর্ণ পেজ কম্পোজিশন পর্যন্ত — ১০১টি কম্পোনেন্ট, প্রতিটি আলাদাভাবে ডিজাইন না করে আমাদের ship করা প্রোডাক্ট থেকে নেওয়া। কোনো কম্পোনেন্ট PDS-এ থাকলে সে ইতিমধ্যে বাস্তব কাজ করেছে: এই সাইট, প্রোডাক্ট ডেমো ও আমাদের ক্লায়েন্ট ড্যাশবোর্ড সবই এর ওপর রেন্ডার হয়।
রঙ, টাইপ, স্পেস ও মোশন একটি token লেয়ার থেকে নির্ধারিত হয়। একটি token বদলালে প্রতিটি কম্পোনেন্ট তা অনুসরণ করে — কম্পোনেন্টভিত্তিক ওভাররাইড নেই, প্রোডাক্টে প্রোডাক্টে drift নেই।
একটি ডার্ক ও একটি লাইট থিম, পাঁচটি অ্যাকসেন্ট রঙ, সবই একই token দ্বারা চালিত। ব্র্যান্ড ভেদ মানে token বদল, fork নয় — পরিবারের প্রতিটি প্রোডাক্ট একই সিস্টেম থেকে রেন্ডার হয়।
কনট্রাস্ট, elevation ও রঙ আগে ডার্ক থিমে ঠিক করা হয়; লাইট থিম একই token থেকে তৈরি হয়। ফলে ডার্ক মোড হয় স্বাভাবিক, উল্টে দেওয়া নয়।
বাটন, ইনপুট, সিলেক্ট, সুইচ, স্লাইডার ও ফিল্ড কাঠামো — লেবেল, হিন্ট ও এরর সহ। স্টেটগুলো আগেই ডিজাইন করা: focus, disabled, invalid ও loading প্রতিটি প্রোডাক্টে একইভাবে আচরণ করে।
Stack, grid, ডিভাইডার ও পেজ শেল দিয়ে অ্যাড-হক CSS ছাড়াই স্ক্রিন গড়া যায়। সবচেয়ে বড় কম্পোনেন্টগুলো পূর্ণ পেজ কম্পোজিশন — আমাদের ship করা পেজ থেকে নেওয়া hero, section ও footer প্যাটার্ন।
হেডার, ট্যাব, ব্রেডক্রাম্ব ও মেনু, রেসপন্সিভ ও কীবোর্ড আচরণ সহ। এই সাইটের নেভিগেশনই আসল কম্পোনেন্ট, তার অনুকরণ নয়।
মোডাল, শিট, ড্রয়ার, পপওভার ও টুলটিপ একটি layering মডেলে — focus trapping, dismissal ও stacking একবারই, কেন্দ্রীয়ভাবে সামলানো। কোনো প্রোডাক্টকে নিজের z-index হিসাব করতে হয় না।
টেবিল, লিস্ট, স্ট্যাট টাইল, ব্যাজ ও টাইমলাইন — যেসব প্রোডাক্ট সংখ্যার ওপর চলে তাদের জন্য। পরিবারজুড়ে অপারেটর কনসোলের ঘনত্ব এই কম্পোনেন্টগুলো থেকেই আসে।
Toast, ব্যানার, এম্পটি স্টেট, প্রগ্রেস ও skeleton — যেসব স্টেট চটকদার নয় কিন্তু শুরুতেই ডিজাইন করা। PDS-এ তৈরি প্রোডাক্টের loading, empty ও failed-এর জন্য ভেবেচিন্তে করা উত্তর থাকে।
টেকনিক্যাল রেজিস্টারের জন্য mono লেবেলসহ একটি editorial টাইপ স্কেল — Protocore-এর প্রতিটি সারফেসে যে কণ্ঠস্বর দেখা যায়। স্কেলটি token, তাই প্রোডাক্ট সিস্টেম ছেড়ে না বেরিয়েই তা টিউন করতে পারে।
Duration ও easing token হিসেবে আসে, কম্পোনেন্টগুলো আগে থেকেই সেগুলো ব্যবহার করে। প্রোডাক্টজুড়ে ইন্টারফেস একইভাবে নড়ে, কারণ কেউ হাতে অ্যানিমেশনের টাইমিং নতুন করে ঠিক করে না।
কনট্রাস্ট, focus স্টেট ও কীবোর্ড আচরণ কম্পোনেন্টের ভেতরেই তৈরি, আলাদা করে ভাবার বিষয় নয়। ডিফল্ট ship করুন, অ্যাক্সেসিবিলিটি সঙ্গে আসবে।
স্টাইলিং হলো বিল্ড টাইমে সমাধান হওয়া স্ট্যাটিক CSS — কোনো CSS-in-JS runtime নেই, ব্রাউজারে কিছু গণনা হয় না। স্টাইলিং লেয়ার পেজে শূন্য JavaScript যোগ করে।
সিস্টেমটি সাধারণ CSS প্যাকেজ হিসেবেও পাওয়া যায় — token ও utility class, React ছাড়াই। সার্ভার-রেন্ডার্ড পেজ, ইমেইল ও নন-React স্ট্যাক একই source of truth থেকে নেয়।
Token ওয়েবের জন্য CSS variable ও Tailwind preset হিসেবে এবং মোবাইল প্ল্যাটফর্মের জন্য নেটিভ ফরম্যাটে এক্সপোর্ট হয়। ব্র্যান্ডের একটিই সংজ্ঞা, প্রোডাক্ট যেখানেই চলুক সেখানে ব্যবহৃত।
React লেয়ার অ্যাপকে provider দিয়ে মোড়ে এবং hook-এর মাধ্যমে token দেয় — কম্পোনেন্ট মান হার্ডকোড না করে সক্রিয় থিম ও অ্যাকসেন্ট পড়ে। থিম বদলানো মানে state বদল, rebuild নয়।
যে ব্যবস্থা PDS-কে পাঁচটি অ্যাকসেন্ট দেয়, সেটিই একটি whitelabel প্রোডাক্টকে তার ব্র্যান্ড দেয়: token-এর মান বদলান, কম্পোনেন্ট রাখুন। পরিবারের প্রতিটি whitelabel অ্যাপ প্রমাণ যে এটি কাজ করে।
পুরো সিস্টেমের একটি machine-readable ম্যাপ — কম্পোনেন্ট, token, প্যাটার্ন — llms.txt হিসেবে প্রকাশিত। কোনো LLM-কে এটি দেখান, তাহলে জেনারেট করা কোড বিশ্বাসযোগ্য-দেখতে বানানো কম্পোনেন্টের বদলে আসল PDS কম্পোনেন্ট ব্যবহার করবে।
একটি MCP server সিস্টেমটি সরাসরি কোডিং এজেন্টের কাছে উন্মুক্ত করে: কম্পোনেন্ট, props ও token, এজেন্ট বানানোর সময়ই query করা যায়। ডিজাইন সিস্টেম প্রম্পটে পেস্ট হয় না, প্রশ্নের উত্তর দেয়।
প্রতিটি কম্পোনেন্ট pds.protocore.io-তে আছে লাইভ উদাহরণ, props ও কপি-পেস্ট কোডসহ। ডক্স নিজেও PDS-এ রেন্ডার হয় — যা পড়েন, তাই ship করেন।
PDS ship হয় সেমান্টিক ভার্সন ও চেঞ্জলগসহ ভার্সনড প্যাকেজ হিসেবে। আপগ্রেড হয় ভেবেচিন্তে: টিম যখন চায় তখনই সরে, আর চেঞ্জলগ ঠিক বলে দেয় কী বদলেছে।
প্যাকেজ ইনস্টল হয় Protocore-এর প্রাইভেট npm রেজিস্ট্রি থেকে, .npmrc-তে প্রতি টিমের token দিয়ে — স্ট্যান্ডার্ড npm workflow, লাইসেন্সপ্রাপ্ত টিমের জন্য সীমাবদ্ধ। কোনো vendored zip ফাইল নেই, কপি-পেস্ট ইনস্টল নেই।
স্বাক্ষরিত লাইসেন্স কী লোকালি যাচাই হয় — phone-home নেই, আপনার বিল্ডে নেটওয়ার্ক চেক নেই। লাইসেন্সিং সমস্যা ডেভেলপমেন্ট-টাইমে সতর্কবার্তা হিসেবে আসে, প্রোডাকশন অ্যাপ কখনো ভাঙে না।
PDS প্রোপ্রাইটারি এবং প্রতি টিমের জন্য লাইসেন্স করা হয়। অ্যাক্সেসের অনুরোধ করুন, আমরা সেটআপ করে দিই — প্যাকেজ, ডক্স ও token সোর্স — যাতে একটি টিম এক বিকেলেই গ্রহণ করতে পারে।
FAQ
টিম অনুযায়ী, সিট বা প্রজেক্ট অনুযায়ী নয়। একটি লাইসেন্সে একটি টিমের ভেতরে যারা PDS দিয়ে কাজ করেন সবাই কভার হন: token, component ও ডক। খরচ বাড়ে শুধু PDS ব্যবহারকারী টিমের সংখ্যা অনুযায়ী, আর আমরা আপনার জন্য যে whitelabel প্রোডাক্ট বানাই সেগুলো আগে থেকেই এতে রেন্ডার হয়।
npm.protocore.io-র প্রাইভেট registry থেকে। অ্যাক্সেস ক্রেডেনশিয়াল দিয়ে আপনার বিল্ড @protocore প্যাকেজগুলো নামাতে পারে; এরপর token ও component অন্য যেকোনো dependency-র মতোই ইনস্টল হয়।
Token তৈরি হয় ওয়েব, .NET ও নেটিভের জন্য, তাই একটি রং বা radius আপনার প্রতিটি প্ল্যাটফর্মে একই অর্থ বহন করে। Component পাওয়া যায় React-এর জন্য, আর যেসব টিম React ব্যবহার করে না তাদের জন্য একটি framework-agnostic CSS লেয়ার একই token ও class বহন করে।
ডিফল্টভাবেই dark-first ও accessible: দুটি থিম, পাঁচটি accent, সবই token দিয়ে চালিত, আর zero-runtime CSS-এর কারণে লোডের সময় স্টাইলিংয়ে কোনো খরচ নেই। একই component আমাদের প্রোডাক্ট ও ক্লায়েন্ট ড্যাশবোর্ড দুটোই রেন্ডার করে।
ঠিক এজন্যই এটি তৈরি: একটি llms.txt ম্যাপ ও একটি MCP সার্ভার এজেন্টদের সিস্টেমটি পড়ে সঠিকভাবে বিল্ড করতে দেয়, আর pds.protocore.io-তে প্রতিটি component ও token-এর লাইভ উদাহরণ, props এবং কপি-পেস্ট কোড আছে।
প্রাইসিং
PDS-এর লাইসেন্স টিম অনুযায়ী, সিট বা প্রজেক্ট অনুযায়ী নয়। একটি লাইসেন্সে ওই টিমের যারা PDS দিয়ে কাজ করেন সবাই কভার হন: token, component ও ডকুমেন্টেশন।
একটি টিম দিয়ে শুরু করুন, গ্রহণ বাড়ার সঙ্গে আরও টিমে ছড়িয়ে দিন। খরচ নির্ভর করে PDS-এ কাজ করা টিমের সংখ্যার ওপর, আর কিছুর ওপর নয়।
আমরা আপনার জন্য যে whitelabel প্রোডাক্ট বানাই, সেগুলো আগে থেকেই PDS-এ রেন্ডার হয়। স্ট্যান্ডঅ্যালোন লাইসেন্স সেইসব টিমের জন্য, যারা নিজেদের প্রোডাক্টে PDS ব্যবহার করছে।
লাইসেন্সিং টিমের ওপর নির্ভর করে, হেডকাউন্ট বা ব্যবহারের ওপর নয়। অ্যাক্সেসের অনুরোধ করুন, যে টিমগুলো PDS দিয়ে কাজ করবে আমরা সেই অনুযায়ী স্কোপ ঠিক করে দেব।
যাচাই করুন
পুরো সিস্টেম দেখুন pds.protocore.io-তে: প্রতিটি component ও token-এর লাইভ উদাহরণ, props এবং কপি-পেস্ট কোড।
ওয়েব, .NET ও নেটিভের জন্য তৈরি design token, যাতে একটি রং বা radius আপনার প্রতিটি প্ল্যাটফর্মে একই অর্থ বহন করে।
PDS-এর লাইসেন্স টিম অনুযায়ী। একটি লাইসেন্সে যারা PDS দিয়ে কাজ করেন সবাই কভার হন: token, component ও ডক, সবই।
npm.protocore.io-র প্রাইভেট registry-র ক্রেডেনশিয়াল, যাতে আপনার বিল্ড প্রয়োজনীয় @protocore প্যাকেজগুলো ইনস্টল করতে পারে।
PDS মালিকানাধীন (proprietary) এবং টিম অনুযায়ী লাইসেন্স করা হয়। অ্যাক্সেসের অনুরোধ করুন, আমরা সেটআপ করে দেব।
উপরের সবকিছু প্রোডাকশন ডেমোতে চলছে, যা আমরা আপনাকে ঘুরিয়ে দেখাতে পারি: স্ট্যান্ডঅ্যালোন, whitelabel বা একটি পূর্ণ প্ল্যাটফর্ম হিসেবে। কী বানাচ্ছেন বলুন, আমরা সবচেয়ে ছোট পথটি দেখিয়ে দেব।
