Skueomorphism & Flat

Skeuomorphism vs Flat Design ايه هما وايه الفرق

مقدمة

skeuomorphism vs Flat design من اشهر المواضيع التي كتب عنها لان الاتنين من اشهر الاساليب المستخدمة في عالم ال user interface design.

 في رأيي أنّ كل اسلوب منهم له مميزاته وعيوبه وبالنسبة لي ليس هناك مقارنة تعقد بينهم بل انت كمصمم تختار الاسلوب المناسب للعمل الذي تقوم به وهذا الاسلوب المفروض يكون الانسب ليساعدك للوصول لاهدافك.

ليس هناك افضل وسئ بل الافضل لكل عمل على حده حسب متطلبات هذا العمل وخصائصه.

تعريف بكل منهم

skeuomorphism

ال skeuomorphism او تقدر تسميه ال realism هو اسلوب استخدام الاشكال المعبرة عن الواقع المحيط بك للدلالة على طبيعة وماهية هذه الاشياء باستخدام ستايلات مثل الثري دي 3D وال shadows وال gradients او مثلا تستخدم تفاصيل معبرة عن الشكل الواقعي للشئ ده.

تعريف ال Skeuomorphism على techopedia.

iOS application
iOS application using Skeuomorphism concept in design

اجتماع التفاصيل دي في object معين بتجعل منه سهل الادراك والاستيعاب لجميع فئات المستخدمين خاصة غير المحترفين في استخدام الكمبيوتر.

old man using computer
Old man using computer

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

معلومة على السريع

ال skeuomorphism هو اسم اصله يوناني من شقين .. اوله ال skeuos والتي تعني الاداة والشق الثاني هو morphe والتي تعني الشكل.

الخلاصة

ال skeuomorphism اسلوب يستخدم بكثرة في عالم ال user interface وهو معتمد على الاشكال الواقعية لعمل هذا الinterface لمساعدة المستخدم على فهم ماهي طبيعة واستخدامات هذا ال interface سواء كان لموقع الكتروني او تطبيق موبايل او ويب او standalone.

Flat Design

ال Flat او تقدر تسميه اسلوب الحد الادنى minimalist design concept في التصميم، هو اسلوب تصميم ال user interface بدون اي اضافات لاجزاء التصميم مثل ال shadows و الfake 3D و ال gradient وخلافه … حيث يكون التركيز اكثر عل استخدام اللون الواحد flat color سواء في المحتوى او الايقونات او الوان ال UI عامة.

تعريف ال flat design على ويكيبديا.

Flat design
Flat design concept

ال flat design يستخدم هذه الايام بكثرة حيث يساعد على تطبيق ال responsive في ال user interface ويجعله اكثر سهولة في التحميل ويساعد على جعل ال usability وال user experience اكثر كفاءة.

معلومة على السريع

الان يستخدم ال flat design بكثرة من جميع كبرى الشركات مثل apple و microsoft وقامت جوجل بانشاء اسلوب تصميم جديد material design معتمد بشكل كبير على flat design.

Windows metro flat design
Windows metro design – flat
الخلاصة

ال flat design يعتمد على ال minimal style concept حيث يعمل على ازالة اي اضافات لاجزاء التصميم مثل ال shadow وال gradient ويكون التركيز اكثر على usability وال user epxerience الخاصين بهذا التصميم.

المميزات

skeuomorphism

١. يستطيع مستخدمي النظام فهم اهداف الموقع او التطبيق عن طريق فهم ال user interface حيث يكون مقاربا للواقع من ناحية التصميم.

٢. التصميم يراعي كثيرا الناحية الجمالية من ناحية العمق في التصميم واختلاف الdepth بين مكونات التصميم.

٣. ال skeuomorphism يراعي كثيرا التفاصيل البسيطة والدقيقة.

٤. وضوح التصميم وسهولة ادراكه.

مثال

Skeuo-microphone
Skeuo-microphone

تستطيع بكل سهولة ان تفهم المطلوب منك في تصميم مثل هذا.. حيث يبين لك الميكروفون ماهو هدف هذا التطبيق … المؤشر حيث يبين مستوى الصوت القادم .. الزر الاحمر للتسجيل والتوقف.

Flat

١. السهولة والبساطة هما عنوان ال flat design.

٢. تطبيق ال user experience اسهل بكثير حيث يكون التركيز على اعلائه وتحسينه.

٣. مع التطورات الجديدة في عالم تصميم الuser interface مثل ال responsive يكون ال flat design اكثر سهولة وافضلية في الاستخدام.

٤. يعتبر اسلوب عصري وحديث في التصميم.

٥. من ناحية مطوري التصميم فاعتقد انهم يفضلونه لانه اسهل في التقطيع slicing from psd to html

وتطويره يكون اسهل.

٦. استخدام اصول مثل ال SVG يساعد على تحسين ال performance الخاص بالموقع او التطبيق.

العيوب

skeuomorphism

١. يستهلك التصميم كثيرا من الوقت في عمله واكثر في تطويره.

٢. يتم الاستعمال الصور بكثرة بدلا من استخدام ال css وهي شئ سيء لان اي تعديل سيستلزم وقت اطول.

٣. يتم تحميل الموقع في وقت اطول لانه محمل بكثير من الصور.

٤. امتلاء التصميم بكثير من التفاصيل الغير مهمة للمستخدم والتي هي مهمة للتصميم في حد ذاته لشرحه وتوضيحه مثل ظل الكتاب داخل الرف .. فالكتاب كشكل 3D اصبح سهل للمستخدم ولكن ال shadow يعطيه more realistic ولكن هذه ال more اهميتها لا تساوي الوقت المبذول فيها او المساحة التي تأخذها.

ضع في اعتبارك تكرار هذا النمط مع اجزاء التصميم.

Flat

١. يعتبر ال flat design اسلوب جديد trend وال trends عامة تأخذ وقتها وتتغير ولذلك ينبغي بالنسبة لك كمصمم برأيي ان تعتبره اسلوب حر قد تستخدمه الان او بعد ٢٠ سنة حسب متطلبات التصميم من ناحية ال user expereince.

٢. قد تعاني من ايجاد color pallete مناسبة لتصميمك.

٣. عدم استخدامه صحيحا يحول التصميم الى تصميم فقير وغير مترابط مما يفقدم مميزاته.

٤. لانه trend فسترى مواقع كثيرة شبيهة لبعضها مما يضيع معه ال branding الخاص بالموقع او التطبيق وهو ما يجب مراعاته جدا عند استخدام الflat design كاسلوب في التصميم.

في الاخر

اعتقد انك يجب عند البدء في تصميم ال user interface ان تقوم بدراسة ماهو مطلوب في هذا التصميم .. الماركت الذي سينتشر به .. نوعية المستخدمين له .. سنهم واهتماماتهم .. الوظائف المطلوب اتمامها من خلال التصميم ووظيفة التصميم نفسه .. المكان الجغرافي وامكانياته من ناحية الانترنت والبنية التحتية .. دراسة المنافسين وعمل التحليلات اللازمة لاستخدام الاسلوب الامثل لعمل التصميم سواء اكان skeuomorphism او flat.

Leave a Reply

Your email address will not be published. Required fields are marked *