baoyu-design آپریشن میں

baoyu-design باؤیو کا اوپن سورس پروجیکٹ ہے، جو claude.ai کے ڈیزائن انجن کو قابلِ منتقلی Agent Skill میں پیک کرتا ہے، تاکہ Cursor، Claude Code، Codex سمیت 70 سے زیادہ مقامی Agent براہِ راست اعلیٰ معیار کے UI ڈیزائن، پروٹوٹائپس، سلائیڈز، ڈیزائن سسٹمز اور ڈیٹا ڈیش بورڈز تیار کر سکیں۔ تیار کردہ مواد مقامی خالص فائلوں پر مشتمل ہوتا ہے، جسے Git ورژن کنٹرول میں شامل کیا جا سکتا ہے؛ یہ مقامی نیٹ ورک پر متعدد کرداروں کے اشتراک اور ورژن ہسٹری کو سپورٹ کرتا ہے، اور DeepSeek Harness پلگ اِن فراہم کرتا ہے۔

WeChat پر فالو کریں اور “اوپن سورس” کا جواب دے کر AI اوپن سورس پروجیکٹس کے گروپ میں شامل ہوں
سلائیڈز کی تیاری (claude-slides): قدرتی زبان سے مکمل سلائیڈ ڈیک تیار کریں؛ مقامی ایڈیٹر میں پریزنٹیشن چلانے، متن تبدیل کرنے اور ڈریگ اینڈ ڈراپ کی سہولت ہے، اور PDF/HTML/PPTX میں ایکسپورٹ کیا جا سکتا ہے۔
متعدد آرٹ بورڈز کا ڈیزائن کینوس (claude-design): متعدد آرٹ بورڈز کو ساتھ ساتھ منظم کریں، انٹرایکٹو پروٹوٹائپس چلائیں، اور HTML/PDF/PNG میں ایکسپورٹ کریں۔
ڈیزائن سسٹم کی تعمیر (claude-design-system): tokens، برانڈ گائیڈ اور اجزا کا پیش منظر تیار کریں؛ ایڈیٹر میں رنگ، فونٹس اور اجزا براہِ راست دیکھ کر ایڈٹ کیے جا سکتے ہیں۔
ڈیٹا ڈیش بورڈ (claude-dashboard): CSV/TSV/JSON ڈیٹاسیٹس کو حقیقی وقت کے چارٹ صفحات میں تبدیل کریں، اور ہر عدد کو اصل ڈیٹا قطار تک ٹریس کریں۔
چارٹ ڈیزائن گائیڈ (dataviz): ہر چارٹ بنانے سے پہلے Agent کے لیے لازمی رہنما اصول، تاکہ رنگوں کی پڑھنے کی اہلیت اور کلر بلائنڈ افراد کے لیے موزونیت یقینی ہو۔
پیش منظر میں کلک کرکے ایڈیٹنگ: Agent کے براؤزر پیش منظر میں کسی عنصر پر کلک کرکے براہِ راست ترمیمی رائے دیں، اور ماخذ کوڈ میں خودکار طور پر درست مقام پر تبدیلی کریں۔
مقامی نیٹ ورک پر تعاون: کردار کے مطابق مقامی نیٹ ورک لنکس ایک کلک میں بنائیں؛ اکاؤنٹ کے بغیر تعاون میں شامل ہوں۔

ماحولیاتی تیاری: Node.js 20+ انسٹال کریں، اور یقینی بنائیں کہ مقامی طور پر Cursor، Claude Code، Codex میں سے کوئی ایک Agent موجود ہے۔
اسکل انسٹال کریں: npx skills add JimLiu/baoyu-design چلائیں؛ CLI خودکار طور پر Agent کا پتا لگا کر اسکل کو متعلقہ ڈائریکٹری میں انسٹال کر دے گا۔
ماڈل منتخب کریں: بہترین ڈیزائن نتائج کے لیے Agent میں ماڈل کو Claude Opus 5.5 پر سیٹ کریں۔
ضرورت بیان کریں: مطلوبہ مواد کو قدرتی زبان میں بیان کریں، مثلاً ”میرے لیے سہ ماہی رپورٹ کی سلائیڈز تیار کریں“، یا براہِ راست /claude-slides، /claude-design جیسے سلیش کمانڈز درج کرکے مطلوبہ اسکل منتخب کریں۔
تیاری کا انتظار کریں: Agent designs// ڈائریکٹری میں فائلیں تیار کرے گا اور مقامی ایڈیٹر شروع کرے گا، پھر آپ کو http://127.0.0.1 کا پتا دے گا۔
پیش منظر اور ایڈیٹنگ: براؤزر میں ایڈیٹر کھولیں؛ عناصر پر کلک کرکے ترمیم کریں، لے آؤٹ کے لیے ڈریگ اینڈ ڈراپ کریں اور پروٹوٹائپ چلائیں۔ تبدیلیاں حقیقی وقت میں فائل میں محفوظ ہو جائیں گی۔
اشتراک (اختیاری): artifact.mjs share designs/ چلائیں تاکہ مقامی نیٹ ورک لنک تیار ہو؛ ٹیم کے ارکان کردار کے مطابق ایڈیٹنگ یا تبصرہ کرنے کے لیے شامل ہو سکتے ہیں۔
ورژن مینجمنٹ (اختیاری): تیار کردہ مواد عام فائلوں پر مشتمل ہے، اس لیے ڈیزائن فائلوں کو Git کے ذریعے براہِ راست commit، branch اور PR کے ذریعے منظم کیا جا سکتا ہے۔
ایکسپورٹ اور حوالگی: ایڈیٹر میں ایک کلک سے PDF، HTML، PPTX یا PNG میں ایکسپورٹ کریں، اور اسے کلائنٹ کو دیں یا پریزنٹیشن میں استعمال کریں۔

GitHub ریپوزٹری: https://github.com/JimLiu/baoyu-design

مکمل طور پر مقامی طور پر چلتا ہے: claude.ai کے ڈیزائن انجن کو مقامی Agent میں منتقل کرتا ہے، اور تیار کردہ مواد براہِ راست آپ کی اپنی ریپوزٹری میں محفوظ ہوتا ہے، اس لیے کلاؤڈ پر انحصار نہیں رہتا۔
Agent ایکو سسٹم کے لیے عمومی معاونت: Cursor، Claude Code، Codex، Cline سمیت 70 سے زیادہ Agent انسٹال کرتے ہی قابلِ استعمال ہو جاتے ہیں، اور کسی ایک پلیٹ فارم تک محدود نہیں رہتے۔
مواد ہی ماخذ کوڈ ہے: تیار کردہ مواد خود کفیل HTML سمیت خالص فائلوں پر مشتمل ہوتا ہے، جسے براہِ راست Git ورژن کنٹرول، PR اور پروجیکٹ ریپوزٹری میں شامل کیا جا سکتا ہے۔
ڈیزائن اور ڈیولپمنٹ کے درمیان کوئی سوئچنگ نہیں: اسی سیشن میں ڈیزائن کو براہِ راست Agent کے حوالے کرکے فیچر نافذ کیا جا سکتا ہے، ایکسپورٹ یا اپ لوڈ کی ضرورت نہیں۔
جہاں اشارہ کریں، وہیں ترمیم: براؤزر پیش منظر میں کسی عنصر پر کلک کرکے Agent سے درست ترمیم کروائیں؛ یہ کلاؤڈ ورژن میں ایڈیٹر کے درمیان بار بار سوئچ کرنے سے کئی گنا زیادہ مؤثر ہے۔
مقامی نیٹ ورک پر متعدد افراد کا تعاون: کردار کے مطابق مقامی نیٹ ورک لنکس ایک کلک میں بنائیں، اکاؤنٹ لاگ اِن کی ضرورت نہیں۔

پروڈکٹ پروٹوٹائپ ڈیزائن: پروڈکٹ مینیجر یا آزاد ڈویلپر قدرتی زبان کے ذریعے تیزی سے اعلیٰ معیار کے App انٹرفیس اور قابلِ تعامل پروٹوٹائپس تیار کر سکتا ہے، اور میٹنگ سے آدھا گھنٹہ پہلے جائزے کے لیے 3 تجاویز پیش کر سکتا ہے۔
روڈ شو اور رپورٹنگ سلائیڈز: کاروباری افراد یا ملازمین PRD اور مالیاتی رپورٹ کا ڈیٹا Agent کو دے کر چند منٹ میں ڈیزائن گائیڈ کے مطابق سہ ماہی رپورٹ یا سرمایہ کاری روڈ شو deck تیار کر سکتے ہیں، جسے براہِ راست PPTX/PDF میں ایکسپورٹ کیا جا سکتا ہے۔
ڈیٹا ڈیش بورڈ کی تعمیر: آپریشنز یا تجزیہ کار CSV/JSON کاروباری ڈیٹا claude-dashboard کو دے کر خودکار طور پر حقیقی وقت میں اپ ڈیٹ ہونے والا ڈیٹا ڈیش بورڈ تیار کر سکتے ہیں، جہاں ہر اشاریے کو اصل ڈیٹا قطار تک کھول کر دیکھا جا سکتا ہے۔
ڈیزائن سسٹم کی تدوین: ٹیم منتشر ڈیزائن فیصلوں کو برانڈ گائیڈ والے design-system میں منظم کرکے Git ریپوزٹری کے ذریعے تمام پروجیکٹس میں تقسیم کر سکتی ہے، جس سے متعدد پروڈکٹ لائنز میں بصری یکسانیت برقرار رہتی ہے۔