10 رسومات توضيحية لإرشادات التصميم الرقمي والأسلوب من شركات مشهورة مثل Apple و Google و Starbucks

إذا كنت قد تساءلت يومًا عن كيفية تحديد المصممين في Apple لكل جانب ثانوي في iOS حيث انتهى بهم الأمر ببنائه ، فقد تكون في المكان المناسب.

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

لقد تبين أن أدلة التصميم الإلكترونية عملية للغاية بالنسبة للصورة العامة للعلامة التجارية وقابليتها للتذكر على الشبكة نظرًا لأنها حددت التوقعات والمعايير لشاشة عرض الويب الخاصة بالشركة. إنها حيوية بشكل خاص للمواقع الإلكترونية والمنتجات التي يجب أن تقدم للمستخدم محن من الدرجة الأولى.

في هذا العرض ، سوف نتعمق في ماهية أدلة الكتابة الرقمية بالتفصيل ونعرض لك بعض الرسوم التوضيحية الرائعة من الشركات المعروفة التي أكملتها بشكل صحيح.

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

على عكس أدلة أزياء المصنّعين التي تغلف شعار الشركة ، فإن تأكيد المهمة وشخصيات المشتري ونبرة الصوت ، تصميم تصميم الويب وأدلة الأنماط تتمحور حول العرض الرقمي مثل UX / UI.

ولكن ، بصفتي مصمم UX ، كنت أشعر بالفضول بشكل عام ، ما الذي يمكن أن تجده في أدلة الموضة الرقمية لمقدمي الخدمات المؤثرين مثل Apple و Google و Starbucks؟

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

أمثلة من أدلة الأسلوب الرقمي الرائع

1. Apple iOS

يعد دليل التصميم والأسلوب الخاص بشركة Apple مثيرًا بشكل خاص لسبب أنه يوضح كيفية تصميم طريقة تعمل بكامل طاقتها. تتمتع Monterey ، وهي واحدة من أحدث إصدارات نظام التشغيل OS X من Apple ، بواجهة مستخدم أكثر بساطة من سابقتها ، Yosemite. توضح Apple هذا التمييز الدقيق - لكن الملموس - مع مقارنات رسومية جيدة حقًا ، ثم تنتقل لمناقشة الأساس المنطقي الذي يدعم كل جانب فردي من تخطيط نظام التشغيل. يمنحك نافذة على أذهان المصممين.

2. جوجل: تخطيط المواد

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

نظرًا لأن Google كانت تعمل من أجل Product Style لبضعة عقود حتى الآن ، فمن المحتمل أنك قد تفاعلت معها الآن على أساس كل يوم - تطبيق تقويم Google ، أي فرد؟ يوضح دليل التصميم والأسلوب هذا ماهية تصميم المواد بالضبط وكيف تستخدمه Google. ويجب أن أقول إنه ، إلى حد كبير ، أحد أفضل أنواع الأدلة التي صادفتها في أي وقت.

3. ستاربكس

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

4. أتلاسيان

مجموعة البضائع التي عارضتها عارضات الأزياء الأطلسية عملاقة - لذلك ، بالوسائل الطبيعية ، لديهم دليل أزياء عملاق. من الأشياء التأسيسية (مثل لوحة الألوان والطباعة) إلى المكونات (مثل الجداول وتلميحات الأدوات) إلى مكتبة أنماط كاملة ، يحتوي هذا الدليل على كل الأشياء التي يمكنك الاعتماد عليها من منتج بهذا الحجم.

ربما يكون أفضل ما في الأمر هو أن الأساس المنطقي لقيادة دليل النوع الكامل يتم تلخيصه في 3 ظروف مباشرة مخادعة على صفحة الويب الخاصة بالإقامة.

5. موزيلا

يهتم هذا البرنامج التعليمي للتصميم الإلكتروني بشكل أساسي بالعلامات التجارية والاتصالات. ولكن مع حصول Mozilla على تكتيك "الخصوصية وشبكة الويب المفتوحة على مستوى العالم" مؤخرًا ، فمن المدهش أن نرى كيف يكررون هذا في تصميمهم.

تقوم صفحة Mozilla الرئيسية أيضًا بعمل رائع في تحديد كيفية وصول UX / UI إلى الرجال والنساء الذين يعانون من إعاقات أو إعاقات بصرية - شيء واحد شامل ومهم مثل المعرفة سيصبح أكثر ثورية.

6. العازلة

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

7. الصرخة

إذا كنت تبحث عن مثال موثوق به لتصميم موقع على الإنترنت ودليل للأسلوب ، فقد حصلت Yelp على ذلك. فهو ليس مكتملًا فحسب ، بل يشرح إجراء التصميم الذري الخاص به ككتاب طبخ ، ويقسم مكونات موقع الويب كمواد تساهم في الطبق.

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

8. الجزر البريطانية

تم الإعلان عن موقع الويب الخاص بالحلول الحكومية في إنجلترا على أنه مثال أساسي لتجربة المستخدم فائقة الجودة. لماذا ا؟ لسبب أنه يتميز بأسلوب وتصميم غير معقد وسريع الاستخدام يستوعب كميات كبيرة جدًا من المعلومات والحقائق.

إذا كنت مهتمًا بما يمكن أن يشكل تخطيطًا نظيفًا وقويًا بالتأكيد (تلميح: يبدأ بشكل عام باستخدام الألوان الصلبة والطباعة والتباعد) ، فإن دليل الكتابة الخاص بـ GOV.UK يستحق استخدام لمحة سريعة. إلى حد كبير مثل موقع الإنترنت ، فهو بسيط للغاية ولكنه مفيد للغاية.

9. الوسام الفن

معلومات نمط DeviantArt الجديد حصرية لأنها ببساطة أكثر من مجرد معلومات - إنها معرفة. إنه يروي حكاية ويستفيد من المرئيات الجريئة ذات العرض الكامل لغمر الشخص في الخبرة العاطفية للعلامة التجارية DeviantArt. بعد قولي هذا ، إنه دليل نموذج للعلامة التجارية بشكل صارم ، لذلك يتم تغليف المنتجات فقط مثل الألوان والطباعة.

10. ديسقوس

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

هل تأثرت الخبرة لجعل الدليل الخاص بك؟

الآن يمكن أن يكون مفتاحك. من خلال الاستفادة من برنامج تعليمي من النوع الإلكتروني في مؤسستك ، يمكنك توصيل لغة تصميم علامتك التجارية إلى داخل المصممين والمؤسسات ورفاق التسويق وحتى العملاء.

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