منتديات صحبة نتpower_settings_new دخولaccount_box التسجيل
إشترك فى قناتنا على اليوتيوب :)

[ صيانه ]

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

[ إذا كنت غير مسجل ]

يسعدنا انضمامك إلى أسرتنا المتواضعة، شرفنا بمشاركاتك المميزة ونشر الفائدة بين الأعضاء بالضغط هنا

[ إذا كنت عضو ]

تفضل و سجل دخولك وأثبت وجودك معنا بكل ما هو مفيد واستفد من الميزات المخصصة للأعضاء بالضغط هنا

folder

إشترك فى قناتنا على اليوتيوب :)

chat

المواضيع الأخيرة

  1. القلق وتأثيره السلبي على الصحةpersonتقيا
  2. أفضل دكتور تقويم أسنان للأطفالpersonتقيا
  3. اختيار طبيب زراعة الأسنانpersonتقيا
  4. ماهي أنواع تقويم الأسنان؟personتقيا
  5. الاستثمار في الأسهمpersonتقيا
  6. الربح من التدوينpersonNoor505077
  7. القلق والتوترpersonNoor505077
  8. المراحل الأساسية التي يمكنك اتباعها لتعلم التدوينpersonتقيا
  9. كيف تدخر: استراتيجيات فعالة لتحقيق أهدافك الماليةpersonتقيا
  10. الفرق بين زراعة الأسنان الفورية والتقليديةpersonNoor505077
  11. مشروع كوافير رجاليpersonNoor505077
  12. كيفية علاج التهابات سقف الحلق: الأسباب والعلاجاتpersonNoor505077
  13. عملية تركيب تقويم الأسنانpersonNoor505077
  14. كيفية صناعة محتوى فعّال على فيسبوكpersonNoor505077
  15. مميزات زراعة الأسنان: تقنية متقدمة لتحسين جودة الحياةpersonNoor505077
  16. كيف تختاري طبيب أسنان أطفال جيد لطفلك؟personNoor505077
  17. كتابة مقالة تتصدر نتائج البحثpersonNoor505077
  18. عنوان المقال: كيفية تحقيق الدخل من قناة الإنستجرام: دليل شامل للنجاح المالي مقدمة: تحولت وسائل التواصل الاجتpersonNoor505077
  19. طرق فعّالة للربح من الإنترنت: دليل شامل للبدايةpersonNoor505077
  20. تحميل الباتش الرائع SMoKE Patch 8.3 للعبة PES 2016 person7wra
  21. شركة ترميم بالرياض حي البطحاء 0551770850personحبيبه القحطاني
  22. التركيب الثابت للضرس: فنون وعلم في خدمة الابتسامة الجميلةpersonNoor505077
  23. نصائح مهمة للحفاظ على تركيبات الأسنان الأمامية: الابتسامة المثالية تحت التألقpersonNoor505077
  24. أهمية تحسين موقعك على الإنترنت من خلال تحسين السيوpersonNoor505077
  25. الإعلانات الممولة: دليل شامل للفهم والاستفادةpersonNoor505077
  26. تركيبات الأسنان الأمامية المتحركة: التحول نحو ابتسامة جميلة ووظيفة فعّالةpersonNoor505077
  27. تركيبات الأسنان الأمامية الثابتة: تحسين الابتسامة ووظائف الفمpersonNoor505077
  28. تحميل برنامج VentaFax Business 6.8.161.401 لإرسال وإستقبال الفاكس كاملpersonmatrix121
  29. مشروع مطعمpersonNoor505077
  30. استراتيجيات تسويقية فعّالة لتعزيز مطعمكpersonNoor505077
  31. الفرق بين تركيبات الضرس الثابت والزارعة التقليدية personNoor505077
  32. أنواع تركيبات الأسنانpersonNoor505077
  33. [تحميل] فيلم البحث عن دوري personomaromar123
  34. طريقة علاج الابتسامة اللثوية: استعادة الثقة والجمال الطبيعيpersonNoor505077
  35. زراعة الأسنان لمرضى السكر: خطوات ورعاية خاصةpersonNoor505077
  36. عملية حشو العصب personNoor505077
  37. فوائد وعيوب زراعة الأسنان: تحليل شامل للخيارات والتحدياتpersonNoor505077
  38. دراسة جدوى لمشروع حضانة الأطفال: رحلة نحو تأسيس بيئة تربوية ناجحةpersonNoor505077
  39. فهم طقطة الفك: أسبابها وعلاجهاpersonNoor505077
  40. التصيُّغات السنيةpersonNoor505077
  41. استراتيجيات التسويق الفعّالة: دليل شامل لتعزيز مشروعكpersonNoor505077
  42. خطوات حشو العصبpersonNoor505077
  43. فهم التهابات اللسان: أسبابها وأعراضهاpersonNoor505077
  44. السعادة - اكتشف افضل طريق يوصلك ليهاpersonNoor505077
  45. كيفية الاهتمام بأسنان الأطفال اللبنيةpersonNoor505077
  46. مشاكل أسنان الأطفال الشائعة: التعرف والوقايةpersonNoor505077
  47. انواع تقويم الاسنانpersonNoor505077
  48. نصائح للحفاظ علي صحة اسنان اطفالك personNoor505077
  49. كيف تحصل على أفكار لمحتوى إبداعي وجذابpersonNoor505077
  50. كيفية تنظيم وقت النوم والاستيقاظ لتحسين جودة حياتكpersonNoor505077

new_releases

أفضل الأعضاء فى الشهر

new_releases

أفضل الأعضاء فى الإسبوع

descriptionجماليات التصميم الحديث (Neumorphism) Emptyجماليات التصميم الحديث (Neumorphism)

more_horiz

جماليات التصميم الحديث (Neumorphism)


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

جماليات التصميم الحديث (Neumorphism) 5f339b2c01a1dc611521b36b_neumorphic-1


جماليات التصميم الحديث (Neumorphism) 5f339b4a363a6849e4546665_o0oWwNphkm4h8yeZxo64l2knKjsST6We4hhGIeb46IkKTEGj9TOSGehsKUIuhN-RDInB6nkPnoeKD8ZSrWCEMdkjPNLr9TT2K3prgzAdk-AjZ5Vz_hLj0dNiwPdNCrR_CArduIBhGS4orIQSfw

منذ نهايات عام 2019، ظهر اتجاه جديد في التصميم جذب العالم نحوه.. إنه (*neumorphism) أو كما يطلق عليه أحياناً ( Soft UI design concept) و ترجمتها الحرفية (مبدأ الواجهة الناعمة). و السؤال هنا: ما الذي أعطى هذا الاتجاه كل هذا الزهو و الجاذبية بين المصممين حول العالم؟
في الدقائق التالية، سنتعرف سوياً على أصل الـ(neumorphism) و أساسياته و مبادئه. و كيف نستفيد منه في تصميم الواجهات.

جماليات التصميم الحديث (Neumorphism) 454934423

جذور الـ (neumorphism)



دعونا نعود إلى البداية منذ 40 سنة. و تحديداً مع اتجاه التصميم الشهير (Skeuomorphic) و الذي تبنته شركة أبل العملاقة في جميع تصميماتها. و هذا الاتجاه في التصميم يعتمد على محاكاه شبه كاملة للأشكال في الواقع من حيث الألوان و التأثيرات و الظلال.. إلخ.
ما بين عام 2000 و 2010، أدركت شركة أبل و كذلك شركة مايكروسوفت وجود اتجاه جديد في التصميم (Flat design) و الذي يُعتبر النقيض من الـ(Skeuomorphic). حيث أنه يقوم على البساطة في التأثيرات و كذلك الألوان. و يهتم بالظلال الخفيفة و الرسوميات المسطحة ثنائية الأبعاد.

جماليات التصميم الحديث (Neumorphism) 5f339b49a8a911518b99b104_4CRsImVBCxuqvlKJ9Y3rmYuEl3oHhPW2lXVAfLuy1XGlSP55tYZHVXKBgODIp0H43reTdaVoeQARHxfv9PAFRatMfb80xp-YXjeOtFHh8rXZ8lEteEZV_CyLblv2j45cdv4kDmj4x8xGvDjPEA

وُلد (التصميم الناعس) أمام أعين المصممين بواسطة (Michal Malewicz) الذي قدم هذا الاتجاه على أنه (Skeuomorphism) العصر الحديث (New-Skeuomorphism). و اختصرها (Jason Kelley) لتكون (Neu-o-morphism). و قد جذب هذا الاتجاه خبراء الواجهات و المصممين بشدة لأنه حقق المعادلة الصعبة التي كان يبحث عنها الجميع. فقد جمع هذا الاتجاه بين بساطة التصاميم المسطحة، و بين واقعية التصاميم ثلاثية الأبعاد. و أشادوا جميعاً بقوته.

"في الولايات المتحدة الأمريكية، يقضي المستخدم دقيقتين من كل ثلاث دقائق على الانترنت مستخدماً الأجهزة المحمولة (Mobile Platform). و هو ما يحتم علينا أن نهتم بشكل أكبر بتصميم واجهات المحمول أكثر من واجهات الحاسوب. و هنا يظهر السؤال: هل يعطينا (التصميم الناعس) أداة مفيدة في تصميم واجهة مناسبة لأجهزة المحمول؟"


من أجل الإجابة على هذا السؤال، دعونا نقارن بين ما يقدمه (التصميم الناعس) و بين ما تقدمه اتجاهات التصاميم الأخرى المعاصرة.

جماليات التصميم الحديث (Neumorphism) 454934423

ما هي فوائد (التصميم الناعس) مقارنة مع اتجاهات التصميم الأخرى؟



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

النقاط التالي توضح بالتفصيل كيف يمكنك استخدام (التصميم الناعس) في خلق استايل قوي و جذاب للموقع:

1.  إنشاء الواجهة

يتميز (التصميم الناعس) بلون موحد للخلفية و العناصر الموجودة عليها سواء زرار أو بار أو غيرها. و يتم التفريق بين الخلفية و العناصر بالظلال الداخلية و الخارجية لتؤدي الغرض كتدرج لوني. مما يعطي انطباع بالبروز عن سطح الخلفية كجسم ثلاثي الأبعاد (بالمقارنة مع جسم يطفو على الخلفية كما في الـ (Flat Design)). و بهذه الطريقة يستمتع المستخدم بنعومة الألوان و في نفس الوقت يأخذ انطباع الثلاثي الأبعاد.


جماليات التصميم الحديث (Neumorphism) 5f339b49a35a9c30c7349f27_bno26zJZwq36hgFiWu8De57GcVewREdPC68oKgyesJl3EO_9kzHYZP9TvK1WE5Zyh7gsAfJ7IxVVl0Zt_rg47TXiAz_6KNuf6art7RTs0-T5S6V529p0DYff8Kvf2bh8lWEW_vq7lq2Sp-wWuQ

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


2. التجربة

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

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

جماليات التصميم الحديث (Neumorphism) 5f339b4acbf7b20bb82e2629_2kgOfAlbCHHjjDlnkfozc__Ub3m3ecSYaFANHo7ivTUZ8OAoohDreB12qvXdDUk5kpLPvVQo4yyFG6rQPB09R8nSo66kl3DntLYOgCE4RSTEFsYv-PVx9K9yWeNejZl7Ocm-Dpp_ePRswGOYJAجماليات التصميم الحديث (Neumorphism) 5f339b4951b51a4b4def905f_f5sgQ-FOanOqJMpKuccVuBuh0ZYAex2BFsZYOtkL1RCMXQ6UQWEe2Gog1LTTm0Wh3jkzmbhiZTWJLvnmMSyiuW_UjeEV_ljXeLmbnSxVZltXTbHglivlTaaCOznl65L0SSacWwMcesytqm7Dww

3. تشغيل واجهة المستخدم


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


جماليات التصميم الحديث (Neumorphism) 5f339b4a3a88d89da479db84_pdDS_PHyKQSu_lyUs5R4KaptXUJHdm3MZ5RWBwI8DA9NsAqKGag464AFcrh3za2MI-ph1GoVQGnhS3B5ano6r74oDdMeUJGSnT1eqbEfidYLdk5i3GUTOVambnTtnNscqA09Ax3hJn83Pglb4g

4. كفاءة عالية في تصميم النماذج المبدئية

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


5. التلاقي بين المستخدم و واجهة الاستخدام

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

6. سهولة ابتكار تصاميم جديدة

أعتقد أنك تدرك الآن حقيقة أن (التصميم الناعس) أحد أسهل اتجاهات التصميم و أكثرها سرعة في التنفيذ لبساطته. و بالرغم أن هذا الاتجاه لم يتعدى عمره العامين، إلا أنه أثبت نفسه بقوة في الأوساط التقنية بين أهل التصميم. و سوف تجد له مئات الأمثلة و الدروس و التطبيقات على الويب.


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

جماليات التصميم الحديث (Neumorphism) 140979
توقيع : Mostafa Mahmoud




[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]




[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

rate_review التسجيل - منتديات صحبة نت

assistant يجب عليك إنشاء حساب جديد أو تسجيل الدخول لإستخدام الرد السريع و كافة مميزات صحبة نت

power_settings_new إنشاء حساب جديد

chevron_left يمكنك إنشاء حساب مجانى جديد لإستخدام كافة مميزات صحبة نت person_add إنشاء حساب جديد

account_box تسجيل الدخول

chevron_left يمكنك تسجيل الدخول إذا كان لديك حساب بالفعل person تسجيل الدخول

آخر مواضيع المنتدى

آخر مواضيع القسم

swap_horiz انتقل الى

صلاحيات هذا المنتدى

لاتستطيع الرد على المواضيع في هذا المنتدى