دليل المبتدئين للتصميم المسطح

إعادة تسمية برجر كنج
(رصيد الصورة: شركة برجر كنج)

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

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

ما هو التصميم المسطح؟

ما هو التصميم المسطح؟



كيف تحمي تصميماتك من السرقة
كان Windows 8 في طليعة اتجاه التصميم المسطح

التصميم المسطح هو أسلوب تصميم بسيط يؤكد على سهولة الاستخدام. تتميز بمساحة نظيفة ومفتوحة وحواف واضحة وألوان زاهية ورسوم توضيحية ثنائية الأبعاد.

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

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

الحد الأدنى لا يعني أنه ممل

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

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

التصميم المسطح بسيط

أيقونات التطبيق

من المؤكد أن التصميم المسطح يمر بلحظة - هل ذهب بعيدًا جدًا؟(رصيد الصورة: توبياس فان شنايدر)

تنقل الصور البسيطة الرسائل بسرعة أكبر من الرسوم التوضيحية المفصلة. يمكن أن تشير الصور مثل الرموز إلى إجراءات أو أغراض عالمية حتى يتمكن الجميع من فهمها بسهولة.

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

تُظهر الرموز أعلاه بعض الرموز المستخدمة في عام 2021 ، بما في ذلك إعادة تسمية رمز Google المثير للجدل العام الماضي. يكمن الخطر هنا في أنه نظرًا لأنهم جميعًا يتبعون اتجاه التصميم المسطح ، ويستخدمون الألوان الزاهية للارتقاء بتصاميمهم ، فقد أصبحوا تقريبًا متشابهين للغاية (كما اكتشفنا في هذه القطعة ). يوضح هذا فقط أن هناك خطًا رفيعًا بين الاتجاهات التالية مثل التصميم المسطح والوقوف من بين الحشود.

ما يمكنك تعلمه من التصميم المسطح

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

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

متى أصبحت الهواتف القلابة عتيقة الطراز

كيفية إنشاء تصميم مسطح

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

يجب تصميم كل شيء بنفس الهدف في الاعتبار لإنشاء تصميم ويب مرئي وعملي متماسك. فيما يلي بعض الأمثلة الرائعة للتصميم المسطح ...

أمثلة على التصميم المسطح: جهاز الالتقاط

أمثلة على التصميم المسطح: Tripfinder

تساعد الألوان والأيقونات في توضيح المعنى بأقل قدر من النسخ

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

أمثلة على التصميم المسطح: موقع برجر كنج

تصميم مسطح موقع برجر كنج

يتماشى موقع Burger King مع العلامة التجارية الأخيرة(رصيد الصورة: برجر كنج)

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

أفضل برامج النمذجة ثلاثية الأبعاد لمحرك غير واقعي 4

أمثلة على التصميم المسطح: تطبيق الطقس

أمثلة على التصميم المسطح: تطبيق الطقس

لا يعتمد التصميم المسطح على الألوان الزاهية

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

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

مقالات ذات صلة: