في 2014 ، أعلنت Google عن إطلاق تصميم المواد ". كان هدفهم الأصلي هو معالجة الأسئلة من خلال تصميم التطبيقات لأجهزة Android. كانت الحجة أن " تصميم شقة "لا يعرض بشكل جيد على الشاشات الصغيرة. شعروا أن التصميم يفتقر إلى إشارات بصرية واضحة ويعوق سهولة استخدام مستخدمي الهواتف المحمولة.

أوضح ماتياس دوارتي ، نائب رئيس Google Design:

"على عكس الورق الحقيقي ، يمكن أن ينمو" التصميم متعدد الأبعاد "ويتكيف بذكاء. توفر المادة أسطحًا مادية ومسطحة ، مع ظلال تعطي معنى لما يمكنك لمسه ".

وهذا هو أساسًا تصميم الأجهزة الآن: طريقة لجعل عناصر التطبيق تبدو قابلة للمس.

من خلال إصدار اللغة الجديدة وإرشادات تصميم المواد ، تأمل Google في حل مشكلات UX (تجربة المستخدم) والارتباك بين مستخدمي تطبيقات Android. بعد ذلك بعامين ، تجاوز إطار العمل الخاص بهم مجال تطبيقات الهاتف المحمول وأصبح الآن مبدأ يستخدم بانتظام في تصميم الويب.

فيما يلي ، أقدم لك بعض المصادر التي ستجدها RESSOURCES لدمج التصميم متعدد الأبعاد في ملف بلوق وورد.

1 - بيهانس

behance

تحميل

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

2 - CodePen

codepen

تحميل

CodePen ، "ملعب المطور" المخصص ذاتيًا ، هو منجم ذهب للمطور عندما يتعلق الأمر بـ تصميم المواد ". لن يكون لديك فقط بعض الأمثلة الرائعة ، ويمكنك أيضًا رؤية CSS و HTML و JavaScript التي يستخدمها المطورون لإنشاء مواقع ويب مختلفة.

3 - سال لعابه

سال لعابه الموارد والمواد التصميم

تحميل

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

4 - جوائز التصميم متعدد الأبعاد من Google Design

جوجل تصميم جوائز الموارد والمواد التصميم

تحميل

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

5 - مصنوع من مادة

صنع مع المادي للموارد والمواد التصميم

تحميل

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

6 - مدونة تصميم المواد

مادة تصميم بلوق الموارد والمواد التصميم

تحميل

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

7 - MaterialUp

materialup الموارد المادية تصميم

تحميل

جزء من عائلة المواقع Uplabs تتمحور مادة MaterialUp حول التصميم متعدد الأبعاد: نماذج مواقع الويب ولقطات شاشة تطبيقات الجوال والأدوات والنصائح والمزيد. حتى إذا لم تتمكن من العثور على أي شيء مفيد في الوقت الحالي ، فقم بإلقاء نظرة على تصميم موقع الويب الخاص بهم. يذكرنا التنسيق والمظهر بـ Google Drive ، أليس كذلك؟ إذا كنت تبحث عن ملف مورد يمكنك الوثوق ، يمكنك اللجوء إلى هذا الموقع؟

8 - بينتيريست

بينتيريست الموارد والمواد التصميم

تحميل

إذا تم تسمية أحد المواقع على أنه المصدر الرئيسي لإلهام "المصممين" ، فستشارك Pinterest هذا التكريم مع Behance. مع بحث سريع عن المصطلح "تصميم المواد لديك إمكانية الوصول الفوري إلى مقاطع الفيديو والصور من مواقع الويب والتطبيقات التي تستخدم هذا الإطار.

هذا كل شيء في قائمة RESSOURCES من أجل " تصميم المواد ". لا تتردد في مشاركتها مع أصدقائك على الشبكات الاجتماعية المفضلة لديك.