20 مبادئ أساسية لتصميم المواد – لا غراندي ديبر ، ما هو تصميم المواد? تعريف مواد تصميم Google
<h1>تصميم المواد ، واجهة المستخدم وفقًا لـ Google</h1>
<blockquote>في السيناريو الحديث ، إذا كنت ترغب في تضمين حركة ، فسيتعين عليك جعلها حقيقية ، فيما يتعلق بقوانين الفيزياء ووظائف الأشياء في العالم الحقيقي. في الواقع ، اعتاد المستخدمون على الشعور بالحركة في حياتهم اليومية. هذا يجذب انتباههم ويساعدهم على فهم وظائف الأشياء بشكل أفضل.</blockquote>
<h2>20 مبادئ أساسية لتصميم المواد</h2>
<p>تصميم المواد عبارة عن مجموعة من المبادئ والإرشادات التي توجه تصميم واجهات المستخدم الحديثة والأنيقة (IU). تهدف هذه اللغة البصرية التي أطلقتها Google في عام 2014.</p>
<p>يعتمد تصميم المواد على ثلاثة أعمدة رئيسية: الكون المادي واللون والمساحة. يجب أن يمتزج كل مكون واجهة في هذا الكون ، فيما يتعلق بالنسب والألوان الخاصة بكل مادة. يجب أيضًا تحديد المسافات بشكل جيد بحيث يمكن للمستخدم التنقل بسهولة من عنصر إلى آخر.</p>
<h2>ما هو تصميم المواد ?</h2>
<h3>ما هذا ?</h3>
<p>تصميم المواد عبارة عن مجموعة من قواعد التصميم ، التي أنشأتها Google في عام 2014. هذه الأداة تسهل إدارة مكونات المنصة. في الواقع ، لقد فهم مصممو Google أن المكونات يجب أن يكون لها خصائص مادية محددة.</p>
<p>يتضمن تصميم المواد بالتالي توجيهات لكل شيء:</p>
<ul>
<li>العرض</li>
<li>سرعة</li>
<li>الضل</li>
</ul><ul>
<li>الطباعة</li>
<li>الشبكات</li>
<li>فضاء</li>
<li>اللون</li>
<li>المقياس</li>
<li>التصوير</li>
</ul>
<p>وبهذه الطريقة ، يكون لدى المستخدمين انطباع بأنهم على اتصال بالعناصر المادية في العالم الحقيقي.</p>
<p>وبالمثل ، فإن تصميم المواد ليس فقط مسألة عرض المصممين على كيفية العمل على مظاهر المنتجات والخدمات. كما يسمح للمصممين بإنشاء تصميمات متعمدة.</p>
<h3>لماذا تختار تصميم المواد ?</h3>
<p>مثل معظم أنظمة التصميم ، تم إنشاء تصميم المواد لتوفير تجربة مستخدم أفضل على مختلف الأجهزة والمنصات. الهدف هو أن المستخدمين لديهم تجربة متماسكة .</p>
<p>تصميم المواد ليس مجموعة بسيطة من إرشادات الأناقة. هذا نظام تصميم كامل.</p>
<p>على عكس أنظمة التصميم الأقل اكتمالا الأخرى ، يمكنها إدارة حالات التصميم ، مع حالات الاستخدام المعقدة.</p>
<p>وبالمثل ، فإن تصميم المواد هو مكتبة تصميم مرنة إلى حد ما. في التوجيهات ، يتم ترك جزء كبير من خصائص تنفيذ التصميم بالكامل للمصمم.</p>
<h2>قائمة مبادئ تصميم المواد</h2>
<h3>المبدأ 1: تعرف على الموارد الرئيسية</h3>
<p>إذا كنت ترغب في الحصول على معرفة محددة بتصميم المواد ، فإن أفضل حل هو استشارة مورد Google الرسمي.</p>
<p>يتم تحديثه باستمرار ويحتوي على جميع التفاصيل الكاملة والضرورية ، لتصميم تصميمات المواد.</p>
<p>أفضل ميزة فيما يتعلق بهذا المورد هي أنه لا يقتصر فقط على جوانب محددة في Android. على العكس من ذلك ، فإنه يغطي جانب تصميم المواد بالكامل ، في أي مشروع على الإطلاق نوع التطبيق أو على الويب.</p>
<p>يُنصح بتصفح الفصول الأولى من هذا المورد على الأقل ، لتكون قادرًا على التعرف على مبادئها الأساسية.</p>
<h3>المبدأ 2: تعرف على “المواد” في تصميم المواد</h3>
<p>تصميم مواد الأسماء أبعد ما يكون عن غير ضار. تصميم المواد هو تقليد للعالم المادي والعالم المادي. إنها مستوحاة من قوامها ، حتى من انعكاس الضوء وإسقاط الظلال. تعيد أسطح المواد إلى إعادة اختراع الورق ويدعم الحبر.</p>
<p>في الواقع ، تركز الفكرة المركزية لمبادئ التصميم المادي على إنشاء التصميم ، وتقليد أشياء العالم الحقيقي.</p>
<h3>المبدأ 3: استخدم الظلال لتحديد التسلسلات الهرمية البصرية</h3>
<p>أدوات تصميم المواد الرئيسية هي:</p>
<ul>
<li>الحواف</li>
<li>الأسطح</li>
<li>إضاءة</li>
<li>ظلال واقعية</li>
</ul>
<p>على سبيل المثال ، تساعدك الظلال على إعطاء الأولوية للعناصر المختلفة ، من أجل الحصول على تصميم كامل.</p>
<h3>المبدأ 4: استخدم الألوان الزاهية</h3>
<p>لا شك أن تصميم المواد هو تصميم مصنوع في نهج الحد الأدنى. بمعنى آخر ، لا تحتاج إلى استخدام العديد من أدوات التصميم والأناقة.</p>
<p>أحد الأشياء المادية القليلة التي يمكنك استخدامها هو اللون. على وجه التحديد ، اللون الزاهي. في الواقع ، تلعب الألوان الزاهية دورًا مهمًا في تعزيز تصميم المواد. يلفت انتباه المستخدمين ويشجعونهم على التفاعل مع التصميم.</p>
<h3>المبدأ 5: لا تهمل اللون الأساسي ولونه لللكنة</h3>
<p>أفضل طريقة لتكييف هذا المبدأ مع أي نوع من أنواع التصميم هي اختيار ثلاثة ظلال ستكون بمثابة لوحة رئيسية ، مع لون سيكون بمثابة لهجة.</p>
<p>يمكن استخدام الألوان الأساسية التي تختارها في العناصر الرئيسية للواجهة ، بما في ذلك:</p>
<ul>
<li>الحقول</li>
<li>الخانات</li>
<li>الخلفيات</li>
<li>الخطوط ، إلخ.</li>
</ul>
<p>ولون اللكنة ، كما يوحي اسمها ، يؤكد ويلفت الانتباه إلى عنصر رئيسي. تذكر أن لون اللكنة المختار يجب أن يكون أكثر تباينًا من لون الألوان الأساسية.</p>
<h3>المبدأ 6: الاستفادة الجيدة من المساحات البيضاء</h3>
<p>تلعب المساحات البيضاء دورًا رئيسيًا في تخطيط النص والطباعة. في الواقع ، يعد White Space أداة لجذب الانتباه والمستخدم وتوجيه انتباههم إلى عنصر معين.</p>
<p>لذلك لا تتردد في:</p>
<ul>
<li>استخدم طباعة كبيرة للعناوين الرئيسية</li>
<li>أضف الكثير من المساحات البيضاء</li>
<li>الحفاظ على مساحة فارغة كافية في تصميمك العالمي.</li>
</ul>
<h3>المبدأ 7: اتبع اتجاه الصور الجديدة إلى الحافة</h3>
<p>يتم تكييف تصميمات المواد بالكامل مع الصورة. لذا ، إذا كنت قد قررت إضافة صور إلى تصميمك ، فيجب أن يكون لها دور رئيسي.</p>
<p>يجب أن تتبع الصور المضمنة في تصميم المواد. وهذا يعني ، يجب ألا يكون هناك هوامش ، تفصل حافة الصورة عن حافة النافذة أو الشاشة.</p>
<h3>المبدأ 8: يجب أن يكون كل شيء تفاعليًا</h3>
<p>اجعل الأمور في متناول كل جهاز ، بغض النظر عن حجم شاشته ، هي واحدة من المبادئ الأساسية لتصميم المواد. الهدف هو تقديم تجربة متماسكة. وبهذه الطريقة ، لن يشعر المستخدم بالارتباك أثناء الانتقال من جهاز إلى آخر ، لأنه لن يحصل على واجهة جديدة في كل مرة سيغير الجهاز.</p>
<p>في هذه الحالة ، يجب أن يكون التصميم تفاعليًا. لحسن الحظ ، بفضل الأطر المتقدمة ، تم بالفعل نصف عملك. وبالتالي ، فإن إنشاء تصميم تفاعلي لن يكون مهمة صعبة بالنسبة لك.</p>
<h3>المبدأ 9: الأبعاد</h3>
<p>على شبكة الإنترنت ، يتم استخدام محور Z للتراكب وليس للاحتمال. من ناحية أخرى ، يعتمد العالم ثلاثي الأبعاد على محور Y.</p>
<p>تستخدم مادة التصميم بشكل أساسي ثلاثي الأبعاد بحيث يكون المحور Y. انظر فقط إلى تصميم Google ، لتلاحظ المنظور المتساوي. طريقة التصميم هذه مستوحاة من العالم الحقيقي ، ومن هنا جاء اسم “المواد”.</p>
<h3>المبدأ 10: تذكر أن النجاح بالتفصيل</h3>
<p>في تصميم المواد ، يجب أن يكون كل شيء بسيطًا. أفضل مثال يمكن أن يكون التصميم skeuomorphic . تهدف هذه التقنية إلى تقليد الأشياء الحقيقية أثناء تصميم الكائنات الافتراضية. لذلك يجب عليك التأكد من أن كل عنصر من عناصر التصميم الخاص بك يبدو ، قدر الإمكان ، لأشياء الحياة الحقيقية.</p>
<h3>المبدأ 11: يجب أن يكون للحركة معنى</h3>
<p>وفقًا لـ Google ، تعطي الحركة معنى للتصميم. عندما تعمل مع تصميم المواد ، فإن الحركة مكون يجب تضمينه.</p>
<p>في تصميم المواد ، يجب أن يكون للحركة هذه الخصائص الثلاثة:</p>
<ol>
<li>كن مفيدًا: يجب أن يكون معروفًا للمستخدمين أين ومتى كان الإجراء متاحًا.</li>
<li>ساعد في تركيز المستخدمين وتوجيه المستخدمين إلى أهم أجزاء الصفحة.</li>
<li>كن معبرة وأضف القليل من الشخصية والديناميكية إلى الواجهة.</li>
</ol>
<h3>المبدأ 12: يجب أن تكون الحركة أصيلة</h3>
<p>في السيناريو الحديث ، إذا كنت ترغب في تضمين حركة ، فسيتعين عليك جعلها حقيقية ، فيما يتعلق بقوانين الفيزياء ووظائف الأشياء في العالم الحقيقي. في الواقع ، اعتاد المستخدمون على الشعور بالحركة في حياتهم اليومية. هذا يجذب انتباههم ويساعدهم على فهم وظائف الأشياء بشكل أفضل.</p>
<p>لهذا السبب احتفظت Google بقسم منفصل من توجيهات تصميم المواد ، لتفصيل مفهوم الحركة الأصيلة.</p>
<h3>المبدأ 13: التسارع والتباطؤ في الحركات</h3>
<p>يجب أن تقدم انتقالًا واضحًا وعمليًا للمستخدمين. يجب أن تكون عملية الحركة محتملة وواقعية ، لأن التصميم المادي يهدف إلى استنساخ ظواهر العالم الحقيقي.</p>
<p>يجب أن يجد المصممون أفضل وقت لكل حركة كائن.</p>
<p>من ناحية ، يمكن للبطء المفرط للعناصر أن يصرف انتباه المستخدمين ويكون له تأثير سلبي على تدفق المستخدمين. من ناحية أخرى ، قد تزعج حركات ديناميكية جدًا مستخدمي الإنترنت.</p>
<p>في هذه الحالة ، يجب أن تكون في الوسط المناسب ، مما يضمن المدة المثلى وقابلية القراءة الجيدة للرسوم المتحركة. من الضروري إعطاء المستخدمين وقتًا كافيًا حتى يتمكنوا من ملاحظة التغييرات. لكن ، لا تجعلهم ينتظرون. يثبت الأبحاث أن 200 إلى 500 مللي ثانية هي أفضل سرعات الرسوم المتحركة.</p>
<h3>المبدأ 14: استفد من الرسوم المتحركة للأيقونة</h3>
<p>في بعض الأحيان يمكن إنشاء الرموز مع أزرار سياق مع تأثير الكشف الدائري.</p>
<p>صحيح أن مستخدمي الإنترنت لا يلاحظون هذه التفاصيل في كثير من الأحيان ، لكنهم مهمون لخلق تأثير إيجابي على تجربة المستخدم العالمية. </p>
<h3>المبدأ 15: إنشاء توقيت مختلف لحركات مختلفة</h3>
<p>الكائنات المتحركة التي تظهر واحدة تلو الأخرى ، هي أكثر إثارة للاهتمام وأكثر حيا. يوفر مثل هذا النهج للمستخدمين إمكانية النظر إلى كل عنصر.</p>
<p>من ناحية أخرى ، فإن تقديم جميع عناصر الصفحة في نفس الوقت يربك المستخدمين ، لأنهم لا يعرفون أين ينظرون.</p>
<h2>تصميم المواد ، واجهة المستخدم وفقًا لـ Google !</h2>
<p><img src=”https://www.usabilis.com/wp-content/uploads/2018/04/material-design-definition.jpg” alt=”تعريف تصميم المواد” width=”600″ height=”450″ /></p>
<p>تصميم المواد هي لغة مرئية وتفاعلية أنشأتها Google. لكنه أيضًا دليل لتصميم واجهة رسومية (نظام تصميم). هذا التصميم هو “مادة” لأنه مستوحى من الأشياء الحقيقية والورق والحبر ، فهو يختلف عن التصميم المسطح. استخدمت Google تصميم المواد لتوحيد النمط الرسومي لتطبيقاتها ومنصاته. وبالتالي فإن واجهتها تتمتع بميزة كونها مناسبة للغاية للاستخدام لأي جهاز وجميع قرارات العرض. هي أيضا بأسعار معقولة. سيؤدي تصميم المواد إلى تحسين UX ، مع تقديم الموارد للمطورين ومصممي الواجهة. كما هو الحال مع أي تيار رسومي ، فإنه يحتوي على هواة ومنتقاتها.</p>
<p><em>تصميم المواد قبل كل شيء استعارة. استعارة مادية كنظرية موحدة للمساحة المعرجة ونظام الحركة. يتم تثبيت المادة في الواقع اللمسي ، مستوحى من دراسة الورق والحبر ، ولكنه متقدم من الناحية التكنولوجية ومفتوحة للخيال والسحر.</em></p>
<h2>ما هو تصميم المواد ?</h2>
<p>يتوافق اسم “تصميم المواد” مع مجموعة من <strong>قواعد التصميم</strong> اقترحها Google. يتم ترجمته أحيانًا عن طريق “تصميم المواد” أو “التصميم السياقي”. كان أولاً وقبل كل شيء تصميمًا مخصصًا لتطبيقات الأجهزة المحمولة (الهاتف المحمول أولاً). ثم أصبح أحد الاتجاهات الرئيسية في تصميم الواجهة. نهج Google يتذكر <strong>تصميم شقة</strong> (أو التصميم المسطح): الحد الأدنى ، الأشكال الهندسية والملونة ، دون لزوم (على عكس skeuomorphism). ولكن في هذه الحالة ، إنه تصميم مسطح … بسمك وارتياح. في الواقع ، ها هي الخصائص الرئيسية:</p>
<ul>
<li>أ <strong>التعبير المجازي</strong> الورق والحبر من المعدات الرقمية.</li>
<li>تصميم جريء و <strong>جدول</strong>.</li>
<li>خلق ال <strong>الحركات</strong> لتحسين التكاليف و UX. تسبب تصرفات المستخدم التفاهات الدقيقة الكبيرة.</li>
</ul>
<h2>مكتبة البوليمر</h2>
<p>لاستخدام العناصر الرسومية لتصميم المواد (عناصر الورق) والمكونات الأساسية (العناصر الأساسية) ، أنشأت Google مكتبتها ، البوليمر ، مخصصة لمطوري تطبيقات الويب. منذ ذلك الحين ، قدمت Google مواقع وأدوات مختلفة لمساعدة المصممين على التصميم باستخدام هذا النمط من التصميم.</p>
<p>انظر هذا الإعلان في شكل “بيان” ، يمكن العثور عليه في إدخال موقع مرجع المواد.IO:</p>
<p><em>”لقد تحدى أنفسنا لإنشاء لغة مرئية لمستخدمينا الذين يقومون بتوليف المبادئ الكلاسيكية للتصميم الجيد والمبتكرة والإمكانيات التي توفرها التكنولوجيا والعلوم. نسميها: تصميم المواد.»</em></p>
<h2>WebDesign وفقًا لـ Google</h2>
<p>لذلك يختلف تصميم المواد عن التصميم المسطح. إنه نوع جديد من تصميم الويب. يمكننا القول أنه أ <strong>WebDesign استجابة</strong> (Auto Adaptive) تركز على تجربة المستخدم. الهدف هو الحصول على تصميم:</p>
<ul>
<li><strong>حدسي</strong> لجميع المستخدمين (بما في ذلك غير خبرة)</li>
<li><strong>مناسبة لجميع الدعم</strong> (الكمبيوتر ، الكمبيوتر اللوحي ، الهاتف الذكي ، إلخ)</li>
<li><strong>تفاعلي</strong> بفضل الرسوم المتحركة الديناميكية.</li>
<li><strong>متجانس</strong> بين جميع الواجهات</li>
</ul>
<p>وفقًا لـ Google ، يستخدم هذا التصميم إمكانيات تكنولوجية وعلمية لتوفير حلول الويب لبيئة العمل المعاصرة ومشاكل التصميم. في الفيديو أدناه ، يعبر مصممو Google عن دوافعهم الأولية ، والطريقة التي يعملون بها والتجارب “المادية” التي أجريت. نلاحظ أنه إذا تم تثبيت لغة التصميم هذه في الواقع ، فإنها تترك مكانًا مهمًا لخيال المستخدم. غالبًا ما يعود مصطلح “السحر” حول تصميم المواد.</p>
<h2>إعادة تصميم جوجل</h2>
<p>لفهم نهج Google تمامًا ، عليك العودة إلى أصول Google ، وأهمية شركة Montain View التي هاجمت التصميم. حسنًا ، ليس كثيرًا … وفقًا لمبادري تصميم المواد.</p>
<p>إن رؤية هذا الفيديو تعطينا فكرة جيدة عن أهمية حمل “رؤية” للقيام بهذا المشروع: إعادة تصميم Google.</p>
<h2>لماذا تصميم المواد ?</h2>
<p>مرئي في الإصدار 5.0 من Android ، تم تقديم تصميم المواد لأول مرة في 25 يونيو 2014 من قبل Matias Durale ، مدير تجربة مستخدم Android في Google. كان جزءًا من مؤتمر Google I/O. مع هذا الميثاق الجديد للتصميم ، أنشأت Google خاصة بها <strong>اللغة البصرية</strong>, يمكن التعرف عليه مهما كانت الخدمة أو المنتج ، من تطبيقات الأجهزة المحمولة إلى الكائنات المتصلة.</p>
<p>عرض Matias Duarte استعارة للورق (Android / Material) في عام 2014 في عام 2014).</p>
<p>شاهد هذا الفيديو للاحتفال بالذكرى السنوية الأولى لنهج التصميم هذا. كان واحدًا بعد الإطلاق ، في مايو 2015. يلقي Matias Durate نظرة بأثر رجعي على العام الماضي ويمكن أن يقدر بالفعل ما هو مصممون الحماس ، ولكن أيضًا المطورين ، قد خصصوا المبادئ المقدمة قبل عام.</p>
<h2>لتصميم المواد أو ضد ?</h2>
<p>تم تصميم هذا التصميم أيضًا <strong>إثراء تجربة المستخدم</strong> وفعالية الواجهة (خطوط جديدة قابلة للقراءة بلغات متعددة ، تكاليف أفضل …) بعد عام ، كشفت Google النقاب ، من بين أشياء أخرى ، مجموعة تصميم المواد لمشاريع الويب (قم بتنزيل المجموعة هنا).</p>
<p>أثار تصميم المواد ردود فعل مختلفة. وافق البعض على هذا “التحسين” للتصميم المسطح الذي يعتبر التبسيط والممل. في الواقع ، إنه “سائل” وتصميم متحرك. في التكوين ، البوابات ، والمسؤوليات والديناميات ، بنية الواجهة. المساحات والمحاذاة والألوان ضرورية في مرحلة التصميم. كل هذه العناصر تعطي الأولوية للمحتوى وتسهيل التنقل في المستخدم. الرسوم المتحركة ، استنادًا إلى قوانين الفيزياء ، تطمئن المستخدم فيما يتعلق بنتيجة أفعاله.</p>
<p>ومع ذلك ، بالنسبة للآخرين ، تسعى Google إلى فرضها <strong>نمط الرسم</strong>, في خطر الحد من إبداع المصممين/مصممي الجرافيك. ستبدأ جميع مواقع الويب في أن تبدو مثل تطبيقات Android ، على حساب <strong>جودة تجربة المستخدم</strong>.</p>
<h2>كيف تعمل ? التطبيق مع Android</h2>
<p>يجب أن نضع في اعتبارك أن هذه “عناصر مادية”. وبالتالي ، من المستحيل عبور عنصر. فقط المكون المتأثر المستخدم سوف يتفاعل. في تصميم المواد ،<strong>البيئة 3D</strong>. يحتوي كل كائن ، أو “مادة” ، على 3 إحداثيات: x ، y ، z. يتعلق محور Z برفع الكائن. يمكننا أن نقرر ارتفاع الكائن وأبعاده والظلال التالفة ، لكن السماكة تظل سمك ورقة. هذا الأخير لا يمكن أن ينحني. من ناحية أخرى ، يتحرك على جميع المحاور.</p>
<p><img src=”https://www.usabilis.com/wp-content/uploads/2018/04/02-material-design-environment-3D.png” alt=”بيئة تصميم المواد ثلاثية الأبعاد” width=”700″ height=”700″ /></p>
<p>يوفر Android ثلاثة سمات (موضوع مادة مظلمة أو خفيفة ، موضوع مادة خفيفة مع Dark Actionbar) ليتم تنفيذه مباشرة في التطبيق عن طريق التغيير ، إذا كنت ترغب في ذلك ، بعض السمات. ال <strong>ترفيه</strong> تنطبق على الكائنات/عناصر الواجهة اثنان: الرسوم المتحركة tween (للتحولات ، على سبيل المثال عن طريق الدوران على الصورة) والرسوم المتحركة للإطار (عرض عدة صور). يتيح لك ToverAnimation تحميلها وبدء تنشيطها/إطلاقها.</p>
<h2>أمثلة على واجهات تصميم المواد</h2>
<p>قد تبدو التفسيرات النظرية – استعارة الورق الذكي التي تأتي على قيد الحياة وتتفاعل مع المستخدم – غامضة. لكن مراقبة الواجهات تسهل بشكل ملموس فهم مفهوم Google.</p>
<p>شاهد المصادر على الصعود (القصص.الصعود.كوم)</p>
<p><img src=”https://www.usabilis.com/wp-content/uploads/2018/04/03-uplab-material-design.jpg” alt=”تصميم المواد uplab” width=”394″ height=”151″ /></p>
<p>مصدر آخر ، غني في الأمثلة: مدونة تصميم المواد</p>
<h2>أيقونات تصميم المواد</h2>
<p>كان على نظام التصميم هذا إنتاج أيقوناته الخاصة. مكتبة كبيرة متوفرة على مواقع مصادر مختلفة ، مما يوفر وقتًا كبيرًا لمصممي واجهة المستخدم عندما تعرف تعقيد تصميم الرموز المتماسكة المتجانسة.</p>
<p>أعد قراءة مقالاتنا لهذا الموضوع:</p>
<p>انظر دليل Github لاستخدام هذه الرموز في بيئات مختلفة.</p>
<p><img src=”https://www.usabilis.com/wp-content/uploads/2018/04/10-icones-material-design.jpg” alt=”أيقونات تصميم المواد” width=”600″ height=”519″ /></p>
<p>أيقونات المواد الأخرى (للتنزيل هنا)</p>
<p><img src=”https://www.usabilis.com/wp-content/uploads/2018/04/11-icones-material-design.jpg” alt=”أيقونات تصميم المواد” width=”600″ height=”492″ /></p>
<p>يمكنك تنزيل هنا العديد من أيقونات تصميم المواد</p>
<p><img src=”https://www.usabilis.com/wp-content/uploads/2018/04/12-icones-material-design.jpg” alt=”أيقونات تصميم المواد” width=”600″ height=”557″ /></p>
<p>مصدر آخر لأيقونات تصميم المواد للتنزيل هنا</p>
<p><img src=”https://www.usabilis.com/wp-content/uploads/2018/04/13-icones-material-design.jpg” alt=”تصميم المواد وأيقونات التصميم المسطح” width=”600″ height=”365″ /></p>
<p>اختيار كبير من أيقونات المواد في التصميم المسطح لاستخدامه في مشاريعك ، ولكن أيضًا دليل لاستخدامها (هنا)</p>
<h2>بعض المصادر والإلهام</h2>
<ul>
<li>المرجع على تصميم المواد: المواد.IO<ul>
<li>حركة</li>
<li>أسلوب</li>
<li>تَخطِيط</li>
<li>عنصر</li>
<li>أنماط</li>
<li>النمو والاتصالات</li>
<li>سهولة الاستخدام</li>
<li>المنصات</li>
</ul><ul>
<li>في موقع تصميم Google ، ستجد دراسات حالة وأدلة عملية (العديد من الموارد وإمكانية الاشتراك في رسالة إخبارية غنية للغاية)</li>
</ul>
<h2>خاتمة</h2>
<p>يستفيد تصميم مواد Google من <strong>بساطة التصميم المسطح</strong>. الواجهة صقل ومتوازنة بصريًا. مثل التصميم المسطح ، فإنه يلبي متطلبات <strong>الرسم المتجاوب</strong>. ولكن حيث يتم انتقاد التصميم المسطح غالبًا <strong>عدم وجود تكاليف</strong>, جوجل صادقة <strong>جزء من skeuomorphism</strong> على مستوى عال من التجريد. وبالتالي ، فإن الاستخدام الذكي للرسوم المتحركة والخيارات المطبعية واستعارة الورق يحسن تجربة المستخدم. يتيح مدى العناصر الرسومية المقدمة للمطورين أيضًا فهم كيفية غزو تصميم مواد Android على الويب … في خطر أن تكون غازية. بالطبع ، كما هو الحال مع كل اتجاه تصميم ، يعتمد اختيار استخدام هذا النوع من التصميم على المستخدمين المستهدفين وأهداف/العلامة التجارية. إلى المصمم/المصمم لتقرير ما إذا كان يجب عليه متابعة تمامًا <strong>ميثاق تصميم المواد</strong>, لتكون مستوحاة من ذلك أو الابتعاد.</p>
<ul>
<li>تصميم مواد Google ، التصميم الرسمي</li>
<li>ما هو تصميم الخدمة ?</li>
<li>ما هو التفكير في التصميم ?</li>
<li>ما هي التكاليف ?</li>
<li>ما هو التصميم المسطح ?</li>
<li>ما هو skeuomorphism ?</li>
<li>تعريف التصميم العاطفي ، مكان العواطف في التصميم</li>
</ul>
<p>انظر خدماتنا:</p>
<ul>
<li>تدريبنا لتصميم تصميم النظام</li>
<li>لدينا يومين التفكير في التصميم التدريب.</li>
</ul>