نظرة عامة
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
Material 3 Expressive هو أحدث نظام تصميم لأصغر
شاشة لدينا: الساعة. تم تحسينه ليناسب شكل الجهاز المستدير، ويقدّم تصميمًا
معدّلاً يُبرز الطابع المميّز ويمنح مستوى أعلى من التعبير. تصميم و
إنشاء تطبيقات ساعات جميلة ومعبّرة باستخدام Material 3 Expressive
مبادئ التصميم التعبيري
يُبرز التصميم المعبّر كل طبقة من طبقات واجهة المستخدم من خلال أشكال وصور متحركة و
ألوان وخطوط مدروسة.
جولة Embrace
يقدّم المظهر Material 3 Expressive إطار عمل للأشكال مصمّمًا للشاشات المستديرة. ويستخدم اللوحة بأكملها لتحسين إمكانية الاطّلاع على المحتوى والتوازن البصري.
تأثيرات الحركة والنوابض المميّزة
تجعل التعديلات على واجهة Material 3 Expressive عملية التنقّل طبيعية ومميّزة ومتسقة في جميع عمليات النقل. تربط الآن الحركة بين مساحات العرض.
وتستجيب هذه الأجهزة بشكل أكثر دقة لإشارات المستخدمين، ما يسهّل عملية التنقّل.
تغيير الشكل
توفّر علامة Material 3 Expressive إطار عمل لتحويل الأشكال في القوائم وبزرَّات الاختيار، وتم تحسينها لتوفير تجربة أكثر رقيًا. تتضمّن القوائم ميزة التمرير
السلس على شكل جهاز مستدير.
الألوان الغنية
تم توسيع نطاق نظام الألوان ليشمل لوحات الألوان ذات الدرجات اللونية الأكثر عمقًا ومجموعة رموزال أوسع مضمّنة في Material 3 Expressive. تضيف إضافة لون ثالث
مميّز، إلى جانب المزيد من صيغ الرموز ووظائف الألوان الأكثر تحديدًا،
عمقًا وتنوعًا إلى نظام التصميم.
الخطوط المتغيّرة
يستبدل طراز Material 3 Expressive جميع مثيلات Roboto بـ Roboto Flex.
يتم تصميم مقياس لنوع الخطوط الأساسية وتحسينه ليناسب الشاشة المستديرة للساعة.
يخضع كل من المحتوى وعيّنات التعليمات البرمجية في هذه الصفحة للتراخيص الموضحّة في ترخيص استخدام المحتوى. إنّ Java وOpenJDK هما علامتان تجاريتان مسجَّلتان لشركة Oracle و/أو الشركات التابعة لها.
تاريخ التعديل الأخير: 2025-07-26 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2025-07-26 (حسب التوقيت العالمي المتفَّق عليه)"],[],[],null,["# Overview\n\nMaterial 3 Expressive is the latest design system for our smallest\nscreen: the watch. Optimized for the round form factor, it brings a design\nupdate which emphasizes premium and a greater level of expression. Design and\nbuild beautiful and expressive watch apps with Material 3 Expressive.\n\nExpressive design principles\n----------------------------\n\nExpressive design elevates each UI layer with thoughtful shape, animation,\ncolor, and typography treatments.\n\n### Embrace round\n\n\nMaterial 3 Expressive introduces a shape framework designed for round\nscreens. It uses the entire canvas to optimize glanceability and visual\nbalance. \n\n\u003cbr /\u003e\n\n### Premium motion and springs\n\n\nMaterial 3 Expressive updates make navigation feel natural, premium, and\nconsistent across all transitions. Motion now spatially connects surfaces.\nThey respond more accurately to user gestures, making navigation more\nintuitive. \n\n\u003cbr /\u003e\n\n### Shape morphing\n\n\nMaterial 3 Expressive introduces a shape morphing framework for lists and\nselect buttons, optimized for a more premium feel. Lists feature smooth\nscrolling on a round form factor. \n\n\u003cbr /\u003e\n\n### Rich color\n\n\nThe color system expands to adopt the deeper tonal palettes and wider\ntoken set included with Material 3 Expressive. The addition of a third\naccent color, along with more token variants and more specific color roles,\nbrings both depth and variety to the design system. \n\n\u003cbr /\u003e\n\n### Variable fonts\n\n\nMaterial 3 Expressive replaces all instances of Roboto with Roboto Flex.\nA baseline type scale is tailored and optimized for the watch's rounded screen. \n\n\u003cbr /\u003e"]]
