اتجاهات التصميم: تصميم مسطح 2.0
لقد أخذ التصميم المسطح عالم التصميم من خلال العاصفة في السنوات القليلة التي مرت به ، ولكن لم يسبق لأي حركة تصميم أن تظل نقية 100٪ لجذورها ومثلها العليا. هذا هو بالضبط ما يحدث بالتصميم المسطح: إنه يلاحظ تدريجيًا تغييرات دقيقة وذات مغزى لتكرارها الأصلي.
كانت هذه التغييرات كافية لجعل المراقبين والخبراء يصفون التكرار الجديد باسم Flat Design 2.0. 2.0 مهم جدًا لأنه يحقق التوازن الدقيق بين التغييرات الكافية لتغيير تجربة المستخدم والبقاء صادقين مع مبادئه الأصلية.
كان تطور Flat إلى 2.0 أمرًا حتميًا ، على الرغم من ذلك: نظرًا لأن المصممين أصبحوا أكثر ارتياحًا مع Flat ، فإنهم يرون أنه ، لجميع شعبيته ، بعض القضايا لم يتم تناولها بشكل صحيح . والآن لدينا 2.0 لمعالجة بعض أوجه القصور هذه.
أصول التصميم المسطح
انظر إلى التصميم المسطح كنوع من التمرد ضد نمط التصميم الذي كان معروفًا آنذاك skeuomorphism . اعتمدت على التأثيرات ثلاثية الأبعاد لنسخ خصائص الحياة الحقيقية للأجسام ثلاثية الأبعاد كطريقة لاستخدام الألفة للمساعدة في تجربة المستخدم. على سبيل المثال ، في التكرارات الأولية لـ Kindle Fire في Amazon ، كان هناك رف للكتب ثلاثية الأبعاد في الخلفية لتعزيز الغرض من الكمبيوتر اللوحي للقراءة.
عندما قررت شركة أبل ، وهي من كبار المؤيدين للتصميم المتسلق ، في عام 2012 ، التخلي عن التخلف عن الحركة ، التي أشادت بالتأرجح إلى شقة ، والتي ظلت شائعة جدا في السنوات القليلة الماضية. وقد ساعد تركيزها على الحد الأدنى أيضًا على دفعها إلى انتشارها الحالي.
تتميز الشقة بغيابها:
- العناصر التي تشير إلى المستخدمين أنه يمكن النقر عليها ؛
- العناصر المجوفة أو الغارقة التي تشير إلى أنه يمكن ملؤها (انظر حقول البحث وحقول الإدخال الأخرى).
الانتقال إلى 2.0
على الرغم من نجاح الشقة ، بدأ بعض المصممين يلاحظون عيوبًا مشروعة لم تتم معالجتها في مجتمع التصميم. في حين اكتسبت مسطحة الكثير من البخار بسبب بساطتها الترحيبية ، ذهبت قليلا جدا في الاتجاه المتشدد. تبين أن خصائص بعض التأثيرات ثلاثية الأبعاد مفرطة وأثرت بشكل سلبي على تجربة المستخدم.
وبالتالي ، كان لا بد من حدوث تغيير آخر. هذا هو المكان الذي نحن فيه اليوم مع فجر التصميم المسطح 2.0.
مشاكل قابلية الاستخدام المسطح
يمكن تلخيص جميع مشاكل قابليتها للاستخدام في العبارة التالية: عادةً ما تتداول المسطح في احتياجات المستخدم لجماليات الورك.
بعبارة أخرى ، سيضع المصممون الذين يصممون الواجهة لتكون "مسطحة" تركيزًا أكبر على الحفاظ على الحد الأدنى من الأشياء ، وغير ثلاثية الأبعاد ، ونابضة بالحياة / جريئة بدلاً من وضع تجربة المستخدم أولاً. هذا عادة ما تبدأ فيه كل الأشياء السيئة في عالم التصميم ، ولهذا السبب تطورت المسطحة إلى 2.0.
فيما يلي مشاكل الاستخدام الشائعة مع المسطح:
- غياب الدواعي الهامة (التدرجات ، الظلال ، التسطير ، إلخ) ؛
- غياب الأنماط المألوفة (نص أزرق ، تحته خط للروابط ، وما إلى ذلك) ؛
- غياب المؤشرات السياقية (وضع CTA ، نسخة قابلة للتنفيذ ، إلخ).
ولعل المثال الأكثر شهرة في الذاكرة الحديثة لجميع مشاكل قابليتها للاستخدام هو إصدار مايكروسوفت لنظام ويندوز 8 ، بما يسمى UI Metro. كان هذا التصميم مثالًا مسطحًا لأن كل شيء كان مسطحًا إلى أقصى حد.
ال كانت تجربة المستخدم سيئة للغاية لأن التصميم المستوي بالكامل يعني عدم إعطاء المستخدمين القرائن الضرورية لإخبارهم بما يمكن النقر عليه وما لا يمكن أن يكون على واجهة. ونتيجة لذلك ، يضطر المستخدمون بطبيعة الحال إلى قضاء وقت إضافي في فهم ذلك عن طريق التجريب ، أو الأسوأ من ذلك ، تنفيذ إجراءات من الخطأ لا يريدونها في المقام الأول!
كما ترى ، فإن شاشة Windows 8 مسطحة لدرجة أنه من المستحيل على الأشخاص معرفة ما ينقرون عليه وما لا ينقرون عليه. حتى إذا كان المستخدمون بالفعل على دراية بالملاحة الأساسية للموقع ، فهذا لا يعني أنه من الجيد إزالة جميع أدوات الإشارات (وهي أدلة تخبر المستخدمين أنها يمكن أن تتفاعل مع عناصر الصفحة) وتلميحات حول التكاليف (مؤشرات على كيفية تفاعل المستخدمين مع عناصر الصفحة).
أمثلة رائعة من Flat Design 2.0
2.0 هو تغيير دقيق أو تحسن على مسطح ، لذلك قد يستغرق المزيد من التركيز لتحديد 2.0 الحقيقي في مواقع الويب والواجهات. هذا هو السبب في أننا سنعرض لكم بعض الأمثلة الكبيرة الحالية من 2.0 التي تعمل بكامل طاقتها.
دليل Dropbox
دليل دروببوإكس قد تبدو في البداية مسطحة تمامًا ، ولكن إذا نظرت عن كثب ، فسترى الاقتراحات ثلاثية الأبعاد التي تنقل المستخدمين بوضوح إلى بعض العناصر التي يتم جمعها على الآخرين. هذا هو واضح في المقام الأول في صور لرأس الصبي (على الجانب الأيسر) والمفكات (على الجانب الأيمن). كلتا الصورتين لهما حدود قوية ، سوداء ، خفية ، والتي تنقل العمق والانطباع بأنهما يجلسان فوق الخلفية بدلاً من الاندماج معه.
تولييا آيس كريم
موقع تولييا مليء بالتأثيرات الرقيقة المفعمة التي تعطي انطباعًا مميزًا عن الأبعاد الثلاثية في حين أن التصميم العام لا يزال مسطحًا وبسيطًا. يوجد الانطباع المرتفع في العنوان الرئيسي والعنوان الفرعي والوصف (أي ، نسخة الصفحة). كما أنه موجود أيضًا في زر الحث على اتخاذ إجراء ونسخة CTA داخل الزر. يمكنك أن تشكر الاستخدام الخفيف للظلال الجميلة حول حواف هذه العناصر لإعطاء هذا الانطباع المرتفع.
جوجل سانتا المقتفي
من غير المستغرب ، جوجل على 2.0 عربة ، ولها سانتا المقتفي تظهر الصفحة كيف يمكن للمرء دمج 2.0 بطريقة ممتعة ومفيدة. تكثر المكروبات من الإصدار 2.0 على الصفحة في كل شيء بدءًا من التدرجات والظلال على المباني المختلفة والفقاعات المنبثقة (عند تحريك المستخدمين في أي مبنى) إلى ظهور ثلاثي الأبعاد في أعلى الصفحة في الجزء العلوي من الصفحة.
Publicis Groupe
Publicis Groupe صفحة الذكرى 90 تفتخر 2.0 تأثير بطريقة واضحة جدا. إذا نظرت إلى الجانب الأيسر من الصفحة ، فسترى مجموعة الظلال والتدرجات اللونية تنزلق وتشع إلى الخارج من الدائرة الشاحبة والقسم الأزرق أسفلها. وتشير البساطة الصارخة إلى أن جمالية التصميم لا تزال متجذرة بقوة في المسطح النقي.
جميرا
هذا الموقع بالنسبة إلى فندق فخم في دولة الإمارات العربية المتحدة ، يسيطر عليه في الغالب فيديو عملاق في الخلفية ، ولكن لا تدع ذلك يشتت انتباهك عن أخذ الدقة في مساهمته 2.0. يتميز العنوان "جميرا الداخل" بتظليل رقيق للغاية يعطي انطباعًا ثلاثي الأبعاد بنجاح مع الاحتفاظ بالمظهر المستوي العام.
تطور حسب الطلب
في عالم التصميم ، تتغير الأشياء عادة بسبب وجود طلب عليها. سيلاحظ شخص ما أن شيء ما يفتقر إليه ويجد طريقة لتحسين الأشياء ، أو شخص آخر سيأخذ فكرة ويأخذها إلى مستوى آخر منطقي يقوم على مفهوم معين.
بقدر ما يذهب 2.0 ، فمن المؤكد أنه مزيج من الاثنين معا ، حيث يتم إصلاح نقص قابلية الاستخدام من خلال توسيع المفهوم الأصلي بطريقة لا تزال تكرم مبادئ بساطتها التي حددتها الشقة.