الويب 3.0: عهد جديد من تصميم الويب موجود بالفعل هنا

هل لاحظت أي شيء مختلف عن متوسط ​​الموقع في الوقت الحاضر؟ لقد تغير شيء ما في كيفية تصميم مواقع الويب حتى قبل بضع سنوات فقط. ويطلق الكثيرون على هذا التغيير مجيء الويب 3.0 – عصر جديد لتصميم الويب.


في الصورة الأكبر ، الويب 3.0 هو كل شيء عن البيانات وإدارتها. نحن نعيش في عصر المعلومات ، ومع توسع حجم البيانات ، تتزايد الحاجة إلى إدارتها.

لقد سمعت عن بلوكشين قبل عبارة الويب اللامركزية.

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

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

ماذا عن الذكاء الاصطناعي (AI) والتعلم الآلي (ML)?

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

و بعد…

هذا المنشور لا يتعلق بأي من هذه التقنيات

على الرغم من أنني أفهم أن جميع التقنيات المذكورة أعلاه ذات صلة استثنائية بهذا اليوم وهذا العصر ، فإن تركيزي على هذا المنشور هو على تصميم الويب 3.0.

بمعنى آخر ، كيف تغيرت مواقع الويب في السنوات الخمس الماضية ، وكيف يتغير جانب تصميم موقع الويب للأشياء مع Web 3.0?

هذا ما كان يبدو عليه الويب ذات مرة:

الويب 1.0 موقع المدرسة القديمةكلاسيك ويب 1.0

وفي منتصف العقد الأول من القرن الحادي والعشرين ، بدأنا نشهد ظهور الويب 2.0 – الذي بدا كالتالي:

تصميم مواقع الويب 2.0الويب 2.0 – نهج مشترك لتصميم مواقع الويب بشكل سلس.

ولكن ، هذا ليس شيئًا مقارنة بما نراه في تصميمات الويب 3.0:

مثال لمعاينة الويب 3.0 على الويبويب 3.0 – ألوان وأشكال فريدة ومحاذاة مثالية للبكسل والمزيد! موقع الويب المعني: Droplet Health

يؤكد العصر الجديد لتصميم الويب دقة نقية ومخططات لونية مؤثرة وإضافة عناصر تصميم جديدة تكمل التصميم العام.

لذا ، كيف وصلنا إلى هنا ، وماذا تريد أن تعرف?

ما هو تصميم الويب 3.0: تمت الإجابة عن أسئلتك

في هذا القسم ، سأركز على الأسئلة التالية:

  • كيف تختلف مواقع الويب 3.0 عن السنوات السابقة?
  • لماذا يستخدم المصممون العديد من الأشكال وعناصر التصميم الأخرى?
  • هم بناة الصفحات مواكبة الاتجاهات?

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

لذا ، دعونا ننتقل إلى السؤال الأول.

رقم 1: كيف تختلف مواقع الويب 3.0 عن السنوات السابقة?

تصميم غريب الأطوار

أود أن أقول إن أهم تغيير في السنوات الأخيرة هو إضافة العناصر الإبداعية.

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

عند استخدامها بشكل صحيح, الأشكال والنقط يمكن أن يساعد في إبراز المحتوى القيّم مع توفير واجهة مستخدم ممتعة (واجهة المستخدم).

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

الصفحة الرئيسية Piio

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

في أواخر 2018, قام MailChimp بإعادة تسمية موقعه بالكامل, وكان من بين الأشياء التي اختاروا تقديمها استخدام الرسوم التوضيحية.

فيما يلي أهم 3 أسباب تحتاج فيها إلى التفكير في استخدام الرسوم التوضيحية:

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

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

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

والثالث أهم تغيير الطباعة.

طباعة الويب 3.0

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

الفرق الذي طباعة جيدة يجعل هائلة. ومنذ دخول مواقع الويب 3.0 إلى الاتجاه السائد ، فقد تعددت أنواع الخطوط.

يمكنك الابتعاد عن تصميم ويب بسيط لمجرد نوع الخطوط التي تستخدمها. أوصي بوضع إشارة مرجعية مطبعي.

قوائم الخطوط الحرة

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

أيضا ، يكتب أدلة ويحافظ بانتظام على دليل “موقع اليوم”. عندما أعمل على مشروع جديد ، يعد Typewolf أحد المواقع الأولى التي أزورها.

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

# 2: لماذا يستخدم المصممون الكثير من الأشكال وعناصر التصميم الأخرى?

الأشكال في تصميم المواقع

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

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

تقليديا ، سيتم تقسيم الأقسام بألوان فردية فقط ، وأحيانا بدون أي لون على الإطلاق.

الأشكال والهندسة في تصميم المواقع

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

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

الجمالية تصميم المواقع

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

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

# 3: هل بناة الصفحات مواكبة الاتجاهات?

منشئ الصفحة الأولي

لا يقتصر الأمر على مُنشئي الصفحات مثل Visual Composer و العنصر التي تساعدك على بناء صفحات مقصودة أفضل. ماركات مثل سكوير سبيس, تدفق الويب, و Weblium يخطون أيضًا خطوات كبيرة في مساحة أداة إنشاء مواقع الويب. ومن المؤكد أن جميع أدوات التصميم هذه تتبع أحدث الاتجاهات في تصميم الويب.

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

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

الحاجيات Elementor Pro

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

لا داعي لقوله, تعلم HTML & لا تزال CSS مشجعة للغاية كما هو تعلم فن النواقل والتصميم الجرافيكي العام. منشئو الصفحات عرضة لعدم الكفاءة التي لا يمكن حلها إلا من خلال الانحدار والاختلاط مع التعليمات البرمجية.

أدوات تصميم الويب 3.0: الاتجاهات الحالية

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

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

تصميم الإطار السلكي

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

فيما يلي الأدوات التي ستصنع الفارق.

# 1: رسم

رسم

رسم هي أداة تصميم فريدة لنظام Mac OS ويمكن القول إنها واحدة من أفضل أدوات التصميم الرقمي في السوق. على الرغم من أنه يقتصر على نظام تشغيل واحد محدد.

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

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

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

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

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

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

وإذا كنت مبتدئًا وتتطلع إلى التعلم ، فراجع هذا دورة على شبكة الإنترنت.

# 2: الجنون

جنون

كما ذكرنا ، تم تصميم Sketch حصريًا لنظام MacOS. لحسن الحظ ، اتخذت Icons8 على عاتقها إنشاء بديل لمستخدمي Windows. وأفضل جزء هو أنه مجاني تمامًا.

جنون هي أداة تحرير متجهية مستندة إلى Windows استعارت الكثير من الإلهام من Sketch. يعمل بشكل كامل كبرنامج تحرير متجه فردي ولكنه يدعم ملفات Sketch أيضًا.

لذا ، إذا قمت بتنزيل أي مشاريع تم إنشاؤها باستخدام Sketch ، فستتمكن من استخدامها مع Lunacy. أخيرًا وليس آخرًا ، Lunacy مدعوم من المجتمع. بمعنى ، يمكنك طلب والتصويت على الميزات التي قدمها الآخرون.

كل ذلك باسم جعل عملية تصميم مواقع الويب أسهل وأبسط.

رقم 3: فيجما

التين

آخر أداة رئيسية لتصميم الويب هي التين. كما يحدث ، فإن Figma هي أيضًا منافس وثيق مع Sketch. وهو مجاني تمامًا للاستخدام. تم تصميمه للمتصفح ، ولكن يتوفر تطبيق سطح المكتب أيضًا.

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

كملاحظة جانبية ، أنا مغرم أيضًا باستخدام Figma لأي نوع من أعمال المتجهات العامة. سواء كان إنشاء علامات اقتباس وأنماط أزرار جديدة وأي شيء آخر.

تصميم ويب 3.0 الإلهام: تعلم من الأفضل

لست بحاجة إلى التسجيل في دورة UX لتعلم مبادئ التصميم الرائعة. كل ما تحتاجه هو الوصول إلى عدد قليل من مواقع الإلهام المحددة ، وسوف تفهم بسرعة ما هو شائع.

القسم التالي مخصص لمساعدتك في العثور على أفضل إلهام للتصميم لأي مشاريع Web 3.0 القادمة لديك.

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

رقم 1: لابا نينجا

Lapa Ninja

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

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

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

فئات لابا النينجا

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

بالنظر إلى القوائم الفردية ، من السهل حقًا رؤية التغييرات التي نشهدها في تصميم الويب الآن.

لذا فهي مجرد مورد لا يقدر بثمن لزيارته من حين لآخر أو لزيارته كلما واجهتك مشكلة في التصميم أو كنت تخطط لتصميم شيء جديد.

# 2: OnePageLove

OnePageLove

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

على غرار Lapa Ninja ، يمكنك تضييق نطاق البحث على فئات محددة. تتضمن كل قائمة لقطة شاشة كاملة الصفحة وبعض التفاصيل حول المؤلف.

بخلاف ذلك ، يمكنك التصفح حسب رغبتك والاطلاع على أي موقع ويب يجذب انتباهك. لا يمكنني التفكير مرة أخرى في عدد المرات التي استعرت فيها الإلهام من المواقع المدرجة بها OnePage Love. هذا جيد!

# 3: الجوائز

الجوائز

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

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

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

وفيما يتعلق بالإلهام ، فإن الكثير من التصاميم المدرجة في هذا الموقع حصرية للغاية. إنه ملعب للمصممين المبدعين والطموحين حقًا.

تستحق الإشارة المرجعية والتحقق مرة أخرى في الأسبوع.

الخلاصة: إلى أين نذهب من هنا

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

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

منذ عام 2018 ، كان هناك تدفق هائل من التصاميم التي تفضل الجانب البصري للتصميم. وعلى هذا النحو ، نتوقع رؤية المزيد من التغييرات والإضافات في هذا المجال.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map