فهم العناصر الأساسية للمربّع استخدِم نماذج المربّعات والتنسيقات والمكوّنات لتصميم وبناء مربّعات فريدة لتطبيقاتك.
العناصر الأساسية
شريحة مضغوطة سفلية
داخل الزر، استخدم كلمة قصيرة ولكنها خاصة بإجراء أو وجهة معيّنة. يجب أن تتوافق ترجمة نص الحث على اتخاذ إجراء هذا مع عدد الأحرف المسموح به. كقيمة تلقائية أو احتياطية، يمكنك استخدام "المزيد". كنص الحث على اتخاذ إجراء.
اللون
تطبيق مظهر العلامة التجارية
تتوفر العديد من ألوان العلامة التجارية التي يمكنك الاختيار من بينها. ويمكن أيضًا تخصيصها وتغييرها لتناسب شكل تطبيقك ومضمونه.
استخدم أدوات وإرشادات موضوع Material لإنشاء ألوان بها مستويات تباين ألوان كافية، باستخدام اللون الأساسي كلون مصدر استخدم لوحة الألوان التي تم إنشاؤها لاستبدال الألوان الأساسية والمتغير الأساسي واللون الأساسي والسطحي والسطحي في لوحتك في Figma لوضع مربعك بشكل صحيح. جميع الألوان الأخرى غير قابلة للتخصيص لتحقيق اتّساق بين المربّعات.
أدوات أخرى لإنشاء مظاهر متعددة:
- الموقع الإلكتروني لأداة إنشاء المظاهر المتعددة الأبعاد
- المكوّن الإضافي Material Theme Builder في Figma
تطبيق الألوان
أسلوب الخط
Roboto هو الخط الأساسي المستخدم في Wear OS. يوصى باستخدام النص الأساسي 2 كإعداد افتراضي وأصغر حجم خط، بينما العرض 2 هو أكبر نمط متاح للمربعات في كل نوع.
التصنيف الأساسي
يبعد نص التصنيف الأساسي دائمًا 16.64% من الحافة العلوية ومساحة متروكة داخلية بنسبة 6.3%. يظل اللون والخط متسقين أيضًا طوال الوقت.
لمزيد من المعلومات حول الخط والوزن والمقاس، يُرجى الاطّلاع على أسلوب الخط.
المكوّنات
تتوفّر عدّة مكوّنات لإنشاء مربّعات تطبيقك. وتتوافق هذه المكوّنات مع التصميم المتعدد الأبعاد.
زر الرمز
زر لون النص
شريحة عادية
شريحة العنوان (الملء الأساسي فقط)
شريحة مضغوطة
مؤشر التقدم
مجموعة أدوات تصميم Figma
نزِّل مجموعة أدوات تصميم "البلاط" على Wear OS لبدء استخدام تصاميم المربعات مع المكوّنات المدمَجة والخيارات والاقتراحات لإنشاء تصاميم مختلفة تناسب احتياجاتك، مع اتّباع الإرشادات الواردة في نماذج ProtoLayout.