أول مرة رسم فيها Claude Code شيئًا في ملفي على Figma، فكّرت: هذا سيفتح أمامي فرصًا كثيرة. وهكذا كان. أصبح Figma اليوم المكان الذي يجري فيه معظم عمل وكيلي: خلال شهرين، استأثرت مهارة Figma لديه بـ480 من 528 استدعاءً للمهارات. المزيد عن إعدادي في مقال Claude Code ليس للبرمجة.
لماذا Figma وليس توليد الصور
لأنني أحتاجها بصيغة متجهية. الصورة المولّدة لوحة مسطّحة، أما ملف Figma فشيء أستطيع مواصلة العمل عليه:
- طبقات ونص حقيقي. أستطيع تصحيح خطأ إملائي أو تبديل رقم أو ترجمة شريحة دون إعادة رسم أي شيء.
- نظام التصميم الخاص بي. الألوان والخطوط والمكوّنات تأتي من رموزي التصميمية، فيتناسق كل عمل جديد مع ما سبقه.
- الطباعة والويب من مصدر واحد. الإطارات نفسها تُصدَّر ملفاتٍ للطباعة لأجنحة المعارض، وبصيغة SVG لموقعي.
- يداي تبقيان في العمل. أستطيع فتح الملف وتغيير أي شيء بنفسي.
ما الذي يوجد في Figma لديّ
- متجري لقوالب Notion. يضم نظام تصميمه 55 متغيرًا و13 نمطًا للنص و6 مجموعات مكوّنات، إضافة إلى الأغلفة والرسوم التوضيحية للدفعة الأولى من مقالات المدونة، وعددها 28 مقالًا، ولكلٍّ منها نسخة للهاتف.
- عروض الشركة بثلاث لغات. عرض واحد عن مراكز البيانات الحاوية يضم 15 شريحة بالإنجليزية والروسية والتركية، تبقى متزامنة.
- أجنحة المعارض والمطبوعات. لوحات الأجنحة، واللافتات، وكتيّب ثلاثي الطيّات، والقسائم، والشهادات، مُصدَّرة للطباعة.
- هذا الموقع. أيقونات الأقسام في الصفحة الرئيسية لـ zoyak.tech بدأت في Figma.
متجر القوالب هو العمل الذي أنا فخورة به أكثر من غيره. إنه ممتاز لا من حيث التصميم فحسب، بل من حيث المحتوى أيضًا، وأخطط لاستخدام محتواه في دراساتي الخاصة.
الحلقة: الوكيل يرسم المسودة، وأنا أعدّل، والموقع يحصل على نسختي
لا يرسل الوكيل أي تصميم إلى الموقع مباشرة أبدًا. يرسم في ملفي، فأنظر وأعدّل بيدي، وعندها فقط تُصدَّر النتيجة.
أيقونات الصفحة الرئيسية مثال جيد. رسم الوكيل عدة اتجاهات جنبًا إلى جنب، فاخترتُ واحدًا وصقلتُ التفاصيل بنفسي، حتى إنني رقّقتُ كتلة الصفحات في كتاب قسم الدراسات. ملفات SVG على الموقع صُدِّرت من إطاراتي المعدَّلة، فظهر كل تغيير أجريته بيدي على الموقع تمامًا كما تركته.
ما كان على الوكيل أن يتعلمه عن Figma
العمل عبر واجهة Figma API ليس كالعمل في Figma يدويًا. تضم ذاكرة وكيلي الآن 17 ملاحظة عن Figma وحده. بعض الدروس:
- عرض النص يجب أن يُقاس. لا يمكن تخمينه من عدد الحروف.
- الإطارات تقصّ محتواها. العنصر «الموجود» قد يكون غير مرئي.
- الشفافية لها مكانان. شفافية التعبئة وشفافية الطبقة شيئان مختلفان.
- معرّفات العُقد تتقادم. المرجع الذي كان يعمل بالأمس قد لا يشير إلى أي شيء اليوم.
- الشعارات لا تنتقل بين الملفات عبر API، لذا يُعاد بناؤها أو تُنسخ يدويًا.
- لتصدير SVG خصوصياته، لذا تُفحص الملفات المُصدَّرة قبل نشرها.
- لا يمكن إنشاء الرسوم المتحركة عبر API.
قواعدي لأعمال التصميم
يتبع الوكيل أيضًا قواعد وضعتُها له لكل ما هو مرئي:
- اعرضه في Figma أولًا، لا على الموقع المباشر.
- مجموعات أيقونات حقيقية، لا رموز تعبيرية أبدًا، في كل ما يُنشر.
- عندما يكون الموضوع أداة بعينها، استخدم شعارها الحقيقي، مُعادًا رسمه بأسلوبي، لا استعارة بصرية.
- الرسوم المعلوماتية تبقى خفيفة ورحبة: خلفيات فاتحة، وتدرّجات ناعمة، ولون مميِّز واحد.
لماذا يهم ذلك
الصيغة المتجهية تعني أن العمل يبقى ملكي. يوصلني الوكيل إلى نسخة أولى في دقائق، وكل ما يأتي بعدها يبقى قابلًا للتعديل، من قِبله أو من قِبلي. ولمن تفكّر بصريًا لكن لم يكن لديها يومًا فريق تصميم تحت الطلب، هذه هي الفرصة التي رأيتها منذ اليوم الأول.