المكوّنات
أعد استخدام مكوّنات محددة للتوقيعات والإرشادات وأدوات المنتج. لكل منها وظيفة مختلفة.
فكرة واحدة واضحة01 / 03البنية قبل الزخرفة
ساعد المستخدم على معرفة الخطوة التالية. أعد استخدام الأدوات والألوان والمسافات وقيم الانحناء الحالية. حافظ على وضوح التركيز والأخطاء والحالات المعطّلة.
في التطبيق
01 / 03فكرة واحدة واضحة
حوّل فكرة واضحة إلى مسار تعلّم. امنح الخطوة التالية مساحة لتصبح مفيدة.
شكرًا لإفساح المجال لفكرة جديدة. اجعل الرسالة واضحة، وامنح الخطوة التالية مساحتها.
تحفظ البطاقة العنوان والسياق والفعل التالي معًا. يتوسع ملخصها دون تغيير تركيز الصفحة.
أبقِ التسميات ظاهرة. اربط رسالة الخطأ بحقلها واشرح طريقة تصحيحه. استخدم النص إلى جانب اللون.
التالي: شكّل الدرس
أكّد الإكمال بعلامة وكلمة وتغيير في حالة الإجراء. عطّل الإجراء فقط عندما يكون غير متاح.
نظام صغير بحالات حقيقية
القواعد والمصدر
عناصر العلامة
استخدم الشعارات واللوحات اللونية وتسميات الرموز ولوحات الإرشاد والأنماط وقوالب التطبيقات المعتمدة. احتفظ بمرجع المصدر مع الأصول.
واجهة المنتج تبقى واجهة منتج
أعد استخدام عناصر الأزرار والتحكم القائمة والميسّرة. تعرض صفحة العلامة قواعد الهوية؛ ولا تعيد تلوين كل أسطح المنتج.
افعل
ابنِ من رموز مشتركة ومكوّنات صغيرة محددة المسؤولية.
لا تفعل
لا تستبدل أيقونة إجراء أو شعارًا بجزء زخرفي.
افتح مصدر Figma القابل للتحريرصفحات المصدر 12, 15, 27