الوصف
pen.dev هو لوحة تصميم وكيلة من High Agency Inc.، الشركة المصنعة المعروفة سابقًا باسم Pencil (pencil.dev). يصف المنتج نفسه الآن بأنه مصمم لبناء البرمجيات بدلاً من مجرد الشاشات الثابتة: يعمل المصممون والمطورون على لوحة مفتوحة حيث يمكن لوكلاء الذكاء الاصطناعي التصميم بجانبهم، وتحسين العمل القائم، أو بناء شاشات جديدة من خلال تحفيز.
قراءة المزيد
تحتفظ اللوحة بالتصاميم في تنسيق ملف مفتوح يسمى .pen، وهو ملف JSON عادي يمكن لكل من الأشخاص والوكلاء قراءته وتحريره، مخزن داخل نفس قاعدة الشيفرة مثل المنتج الذي يصفه. يتم العمل إما يدويًا، باستخدام أدوات مألوفة من Figma وSketch مثل أداة القلم، والتدرجات، والمكونات، وتخطيط المرونة، أو من خلال توجيه وكيل لصياغة أو تحسين أو توسيع شاشة. تتيح متصفح مدمج وإضافة Chrome للمستخدمين استيراد أي صفحة ويب أو تطبيق أو تصميم مباشرة إلى اللوحة كطبقات قابلة للتحرير، وتستورد ملفات Figma، بما في ذلك المتجهات والنصوص والأنماط، مباشرة.
يجلب المستخدمون نموذجهم الخاص إلى اللوحة: يعمل pen.dev مع Claude وGPT وGrok وQwen وGemini وKimi وDeepSeek وMinimax، متصلين من خلال اشتراك موجود في ChatGPT أو Claude، أو مفتاح API، أو MCP، أو WebMCP أو سطر الأوامر. يتيح نفس رابط MCP للأدوات مثل Claude Code وCodex وCursor أو Antigravity التصميم بدون رأس من خلال CLI الخاص بـ pen.dev، دون الحاجة لفتح اللوحة على الإطلاق.
تشمل ميزات اللوحة الأخرى تأثيرات الظل في الوقت الحقيقي المعروفة باسم Vibe Shaders، ورسم الأيقونات والتوضيحات بمساعدة الذكاء الاصطناعي المعروف باسم AI Pen، ومكتبات المكونات المشتركة عبر الملفات، وأنبوب عرض WebGL مخصص مصمم للبقاء سلسًا مع آلاف الطبقات أو عشرات الجيجابايت من المحتوى. يتم تصدير العمل المنتهي كـ PNG أو JPEG أو WEBP أو PDF بأي مقياس، كـ HTML وCSS أو Tailwind بنقرة واحدة، أو كرابط قابل للمشاركة يفتح أحدث إصدار في أي متصفح. تم تضمين وضع الشرائح والعرض لتحويل العمل على اللوحة إلى مجموعة.
pen.dev مجاني حاليًا؛ تقول الشركة إنها ستصف أي خطة مدفوعة بوضوح قبل فرض رسوم عليها. يتم شحنه كتطبيق سطح مكتب قابل للتنزيل بالإضافة إلى إضافات المتصفح والمحرر لـ Chrome وVS Code وCursor وOpenVSX، ويدعمه برنامج Speedrun من a16z. يناسب مصممي المنتجات والفرق البرمجية الصغيرة الذين يرغبون في الانتقال بين التصميم المرئي والشيفرة العاملة دون تبديل الأدوات، أكثر من الفرق التي تبحث عن منتج تصميم جرافيكي بحت.
- الفئةأدوات تصميم واجهة وتجربة المستخدم بالذكاء الاصطناعي
- نموذج التسعيرمجاني مع ميزات مدفوعة
- النشرسطح المكتب، ملحق IDE، CLI
- المنصاتmacOS، Windows، Linux
الميزات الأساسية لـ pen.dev
تنسيق ملف .pen المفتوح الذي يمكن للوكلاء قراءته وتحريره بشكل أصلي
دعم جلب النموذج الخاص بك لـ Claude وGPT وGemini وGrok وQwen وKimi وDeepSeek وMinimax
اتصالات MCP وWebMCP وCLI للتصميم بدون رأس من Claude Code أو Cursor أو Codex
متصفح مدمج وإضافة Chrome لاستيراد أي صفحة ويب كطبقات قابلة للتحرير
استيراد Figma الذي يحافظ على المتجهات والنصوص والأنماط
لوحة WebGL مخصصة مصممة للبقاء سلسة مع آلاف الطبقات
Vibe Shaders لتأثيرات بصرية وتدرجات في الوقت الحقيقي
AI Pen لتوليد الأيقونات والتوضيحات مع الوكلاء
تصدير بنقرة واحدة إلى HTML/CSS/Tailwind أو PNG/JPEG/WEBP/PDF
وضع الشرائح والعرض لتحويل العمل على اللوحة إلى مجموعة
كيفية استخدام pen.dev؟
تنزيل: احصل على تطبيق سطح المكتب pen.dev أو أضف إضافة Chrome أو Cursor أو VS Code.
بدء لوحة: افتح لوحة فارغة أو استورد تصميمًا من Figma أو صفحة ويب أو قاعدة الشيفرة الخاصة بك.
ربط نموذج: قم بتسجيل الدخول باستخدام اشتراك Claude أو ChatGPT، أو أضف مفتاح API، أو اربط وكيلًا من خلال MCP.
تصميم أو تحفيز: ارسم يدويًا باستخدام أداة القلم والمكونات، أو اطلب من وكيل بناء أو تحسين شاشة.
إضافة تأثيرات: طبق الظلال والتدرجات والأيقونات المرسومة بالذكاء الاصطناعي حيثما دعت الحاجة.
تصدير أو مشاركة: صدّر إلى HTML/CSS أو تنسيقات الصور أو PDF، أو أرسل رابطًا لأحدث إصدار.
حالات استخدام pen.dev
- تصميم واجهة وكيلة
- نقل التصميم إلى الشيفرة
- استنساخ صفحة ويب
- تصميم بدون رأس عبر MCP
