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

التيبوغرافي:

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

الالوان:

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

لكن انتظر …

عند اختيارك للون كل ما عليك هو ان تفكر للحظة كيف سيساعدك هذا اللون في اظهار موقعك…؟!

عليك ايضا ان تختار لونا اساسيا في التصميم كلون بعض الازرار المهمة مثل : “نفذ – Submit” او “ارسل – Send” او “قراءة المزيد – See More” وغيرها من الاوامر المهمة والتي ترغب في جعلها بارزة لعين الزائر. فيجب ان تكون كلها بنفس درجة اللون ، يمكنك ان تختاره لونا مميزا ليس بالداكن ويجب ان يكون مضاد تماما للون الخلفية . في التصميمات ذات الخلفيات الداكنة تجد دائما تلك الازرار باللون “الوردي – الفوشيا – الاصفر او حتى الاحمر القاني”.

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

الاشكال:

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

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

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