اتجاهات تصميم الويب لعام 2022

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

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

عزز من إبداعك في العام الجديد من خلال تنفيذ بعض الاتجاهات التي نتوقع أن نرى المزيد منها في عام 2022:

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

مواقع مصغرة تفاعلية

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

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

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

تصميمات مستوحاة من الماضي

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

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

Cartoon Network نفسها هي علامة تجارية محبوبة لدى الكثير من Generations Y و Z. يستخدم موقع الاستوديو على الويب قاعدة بالأبيض والأسود مقترنة بألوان جريئة ورسوم متحركة مبهجة تجعله موقعًا يبدو رجعيًا وعصريًا في نفس الوقت.

افتح التصاميم المفاهيمية

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

تكون الأرواح من أي نوع حادة وهشة ، كما أن موقع Bear Creek Distillery في دنفر ، أول أكسيد الكربون خالٍ أيضًا من الإضافات الإضافية. مفهوم تصميم موقع الويب الخاص بهم نظيف مثل الفودكا والبوربون والروم والويسكي التي يقومون بتنقيحها.

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

المزيد من التخصيص

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

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

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

كائنات ثلاثية الأبعاد ، التمرير ثنائي الأبعاد

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

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

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

الوحشية الخفيفة

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

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

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

جلاسمورفيسم

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

قامت وكالة المنتجات الرقمية Dovetail Studios بتحريك مجموعة Glassmorphic من حلقات التعشيش التي تدور في زوايا مختلفة. إنه يلفت الأنظار ويظهر براعة النمذجة ثلاثية الأبعاد لفريقهم. تعكس الرموز الأخرى عبر الموقع أيضًا هذا التأثير.

كما تستخدم وكالة إبداعية رقمية أخرى ، Lo and Behold Studios ، كائنات Glassmorphic متحركة على صفحتها الرئيسية. ومع ذلك ، فإن المظهر العام الأخف يعطي موقعه تأثيرًا مختلفًا تمامًا عن تأثير المستخدم عند عرض Dovetail.

تأثيرات التمرير الإبداعية

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

تنقل شركة الأثاث الهولندية Moooi المستخدمين إلى مجموعات أعمق وأعمق أثناء قيامهم بالتمرير. يقدم موقعهم ثلاث تجارب: Beauty Blooms و Defy Gravity و Paper Play. في كل منها ، تفتح الشاشة للكشف عن المجموعة بعد المجموعة ، وستتعمق في الأنماط والنقوش القصيرة أثناء التمرير.

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

طباعة كبيرة الحجم

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

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

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

حدود مرئية

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

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

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

مكونات مجمعة بصور مجردة

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

Illuminating Radioactivity هو موقع تعليمي تم إنشاؤه بشكل تعاوني من قبل مركز Stimson ، ومشروع Reinventing Civil Defense ، و Bombshelltoe Policy x Arts Collective. يسرد تاريخ ومعنى كلمة "النشاط الإشعاعي" وارتباطاتنا بها ، وكذلك الطرق التي لعبت بها دورًا في العلوم والترفيه والطب وغير ذلك. أثناء التمرير ، تغمرك الصور القديمة التي تساعد في سرد ​​التاريخ مقترنًا بأشكال مشرقة ومجردة.

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

تصميم مستقبل الويب

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

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