انتقل إلى المحتوى

أنظمة التصميم

نظام واحد، لكل شاشة.

مكتبات مكونات ورموز تصميم ثنائية اللغة تراعي إمكانية الوصول، وتحافظ على اتساق مئات الشاشات عبر الويب والجوال والتلفزيون.

ما تتضمنه الخدمة

مخرجات يمكنك التخطيط على أساسها.

  • تدقيق الواجهات وحصر المكونات
  • رموز التصميم (Design Tokens) للألوان والخطوط والمسافات وانحناء الزوايا والحركة
  • مكتبة مكونات على Figma بجميع المتغيرات والحالات
  • قواعد عكس الاتجاه للواجهات العربية (RTL) وأنظمة خطوط ثنائية اللغة
  • إمكانية الوصول مدمجة في كل مكوّن
  • التوثيق وإرشادات الاستخدام
  • نموذج حوكمة وآلية للمساهمة
  • التنسيق مع المطورين والتسليم للتنفيذ البرمجي

النتائج

ما الذي يتغيّر عند الانتهاء.

اتساق على نطاق واسع

مئات الشاشات عبر المنتجات والمنصات تبدو وتعمل كمنتج واحد، لأنها مبنية من مصدر واحد.

تسليم أسرع

المصممون يركّبون بدل أن يعيدوا الرسم، والمهندسون يعيدون الاستخدام بدل أن يعيدوا البناء، والمراجعات تركز على المشكلة لا على البكسلات.

ثنائي اللغة افتراضياً

كل مكوّن يأتي بسلوك محدد من اليمين إلى اليسار، فلا تكون العربية أبداً تعديلاً متأخراً في نهاية المشروع.

كيف نعمل

منهجية مبنية على الوضوح.

  1. 01

    الحصر

    نراجع ما هو موجود، ونرصد التكرارات، ونتفق على ما يجب أن يغطيه النظام أولاً.

  2. 02

    الأسس

    رموز التصميم والخطوط والألوان والمسافات والأيقونات والحركة، موثّقة للخطين العربي واللاتيني.

  3. 03

    المكونات

    مكتبة تُبنى حسب الأولوية، لكل مكوّن فيها حالاته وقواعده وملاحظات إمكانية الوصول الخاصة به.

  4. 04

    التوثيق

    إرشادات تجيب عن الأسئلة التي يطرحها المصممون والمطورون فعلاً.

  5. 05

    التبنّي

    خطة إطلاق وحوكمة وتدريب، ليواصل النظام التطور بعد أن نسلّم الدفة لفريقك.

الأنظمة قبل الشاشات

نصمم البنية قبل أن نلمس أي بكسل. ونظام التصميم هو هذا المبدأ مطبقاً على نطاق واسع: رموز التصميم والمكونات والقواعد التي تتيح للفريق إطلاق مئة شاشة تبدو كأنها منتج واحد.

مصمم للعربية واللاتينية معاً

تتعامل معظم أنظمة التصميم مع العربية كخطوة ترجمة. أما أنظمتنا فتحدد سلوك الواجهة من اليمين إلى اليسار على مستوى المكوّن نفسه، من التنقل المعكوس والأيقونات الاتجاهية إلى النصوص ثنائية الاتجاه في الجداول وقوائم المعاملات، لتحظى الشاشات العربية والإنجليزية بالقدر نفسه من العناية والاختبار.

توثيق يقرؤه الناس

لا ينجح النظام إلا إذا استخدمه الناس. لذلك نكتب التوثيق حول الأسئلة التي يطرحها المصممون والمطورون فعلاً، ونوضح الطريقة الصحيحة والخاطئة لاستخدام كل مكوّن، ونترك لفريقك نموذج حوكمة يُبقي النظام في تطور مستمر لوقت طويل بعد التسليم.

الأسئلة الشائعة

أسئلة حول أنظمة التصميم.

متى يستحق نظام التصميم الاستثمار فيه؟

عندما يعمل أكثر من فريق أو منصة على المنتج نفسه، أو عندما تبدأ الشاشات بالتباعد عن بعضها، أو عندما تبدأ كل ميزة جديدة من صفحة بيضاء. إذا وجدت في وضعك أمرين من هذه الثلاثة، فسيغطي النظام تكلفته خلال بضعة إصدارات.

هل تبنون النظام على Figma أم بالشيفرة البرمجية؟

نصمم النظام ونوثقه على Figma، ونعمل مع مهندسيك لتتطابق رموز التصميم والمكونات تطابقاً تاماً مع الشيفرة. وإذا لم تكن لدى العميل مكتبة واجهات أمامية بعد، يمكننا أن نوصي بإحداها ونتوافق معها.

هل يمكنكم إصلاح نظام تصميم موجود لدينا؟

نعم. تبدأ مشاريع كثيرة بتدقيق مكتبة قائمة: إزالة التكرارات، وسد الثغرات، وإضافة الحالات الناقصة وسلوك الواجهة العربية، وإعادة كتابة التوثيق ليستخدمه الناس فعلاً.

كيف تتعاملون مع العربية والإنجليزية في نظام واحد؟

يحمل كل مكوّن قواعد عكس الاتجاه الخاصة به، وسلوك النصوص ثنائية الاتجاه، وسلّم أحجام الخطوط لكلا الخطين. والأيقونات التي توحي باتجاه معين تُعرَّف في أزواج. وللأرقام والتواريخ والعملات قواعد صريحة، فتتصرف الشاشات ثنائية اللغة بشكل متوقع.

كيف تحافظون على حيوية النظام بعد التسليم؟

بنموذج حوكمة خفيف: من يملك النظام، وكيف تُقترح التغييرات وتُراجع، وإيقاع منتظم للإصدارات. ويمكننا البقاء أمناء على النظام خلال الدورات الأولى إذا فضّل فريقك ذلك.

خدمات أخرى

اكتشف بقية خدماتنا.

تواصل معنا

سواء كانت لديك فكرة أو تحدٍّ، فنحن جاهزون للانطلاق معك.

أخبرنا أين وصل منتجك اليوم، وسنعود إليك خلال يومي عمل بتصوّرنا لطريقة العمل عليه.