الاتجاهات في تصميم الويب. بدائل القائمة المتنقلة

30.07.2019

في 11 أكتوبر، ألقيت محاضرة للمدير الفني لاستوديو Vintage Web Production أولغا شيفتشينكو، مخصص لتصميم الويب والاتجاهات الرقمية في عام 2018. أولجا هي عضو في لجنة تحكيم Awwwards وتقوم كل يوم بمراجعة مئات المواقع الجديدة التي طورتها وكالات ومصممون من جميع أنحاء العالم. وهذا يسمح لها بمواكبة أحدث التطورات والاتجاهات في تطوير وتصميم الويب. قمنا بتسجيل الرسائل الرئيسية للمحاضرة، ويمكنكم قراءة النسخة الكاملة على الرابط.

نتائج 2017

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

قائمة كبيرة

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

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

قائمة كبيرة. موقع radioactivefilm.com

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

تأثيرات الموضة

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

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

ألوان جريئة ونابضة بالحياة

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

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

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

بشكل عام، نشأت العديد من الاتجاهات الحالية في عام 2017 تحت تأثير مبادئ التصميم متعدد الأبعاد من Google.

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

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

الخط العريض

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

المثال المفضل لدي هو Wired. ويستخدم خطوطًا مختلفة لتسليط الضوء على عناوين محددة والحفاظ على ترتيب هرمي للمعلومات على الصفحة.

فقط الق نظرة:

مثال جيد آخر لاستخدام الخطوط الجذابة هو HubSpot. النص في المقدمة ومدعم بالرسومات:

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

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

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

لقد طبقنا هذه الطريقة عند إنشاء مخطط المعلومات هذا. مزيج الخط الغامق والألوان المثيرة للاهتمام يجذب الانتباه:

الخطوط من خطوط جوجل

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

بالمناسبة، جميع الخطوط الـ 810 مجانية تمامًا! أوه نعم، الناس يحبون الأشياء المجانية. كما أنهم يحبون الأشياء سهلة الاستخدام للغاية. فيما يلي مثال على الجمع بين العديد من الخطوط الشائعة من Google:

نستخدم على موقعنا خطوط Roboto وOpen Sans.

صور أصلية

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

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

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

والحاجة إلى استخدام صور واضحة ومثالية زادت الوضع سوءًا.

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

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

أنا متأكد من أن كل فرد في فريقك لديه هاتف مزود بكاميرا. لماذا لا تستخدمهم؟ التقط صورًا لمكتبك أو شعارك واستخدم تلك الصور.

اكتشف ما إذا كان هناك مصور طموح بين زملائك. امنحه بضعة أيام لاستئجار مكتب - وسيكون لديك ما يكفي من الصور لمدة عام كامل!

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

الصور والأيقونات المرسومة باليد

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

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

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

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

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

وقد التقطت خدمة MailChimp هذا الاتجاه أيضًا. وفي تقرير عام 2016، يعرض أيضًا رسومات مماثلة.

تقوم شركة Moz، وهي شركة تعمل على تطوير برامج التسويق، بإدراج الرسوم التوضيحية في رأس المقالات:

أحيانًا يتجلى حبنا للرسومات في مشاريع أخرى:

العودة إلى جذور بساطتها

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

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

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

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

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

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

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

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

ينقل تصميم الصورة البسيط المعلومات الضرورية بسهولة.

استخدام صور GIF

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

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

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

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

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

صور ذات لونين

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

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

" بقلم جون مور ويليامز، رئيس إستراتيجية المحتوى في Webflow.

لقد اقتربت نهاية العام الحالي، وقد طرح كل مصمم ويب سؤالًا مهمًا مرة واحدة على الأقل: ما الذي سيحدد تصميم الويب في عام 2017 القادم؟ قررت أن أجد إجابة لهذا السؤال وسألت مصممي WebFlow عن الاتجاهات التي يعتقدون أنها ستهيمن على مدار الـ 365 يومًا القادمة. كما قدمت تعليقاتي الخاصة على أفكارهم.

أولاً، دعونا نحصل على رأي سيرجي ماجدالين، المصمم الرئيسي لـ Webflow.

1. التصميم المبني على المحتوى

"يجب أن يكون ترتيب عناصر التصميم داخل هيكل معين بحيث يتمكن القارئ من فهم الفكرة الرئيسية بسهولة دون تقليل سرعة القراءة العادية" -هيرمان زابف

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

وكان من المثير للاهتمام مشاهدة التحولات التي تحدث مع أولويات التنمية.

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

وهذا هو أحد أسباب التحول من التصميم "skeuomorphic" (حيث يتم تصوير العناصر بشكل مشابه قدر الإمكان لنظيراتها في العالم الحقيقي) إلى التصميم المسطح البسيط. ومن هذه الاعتبارات، أنشأت جوجل التصميم متعدد الأبعاد.

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

2. تفاعل عالي الجودة بين المصممين والمطورين والمصممين فيما بينهم

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

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

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

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

تناول كارسون ميلر هذه المسألة في مقالته الأخيرة "مستقبل تصميم الواجهة الأمامية" على موقع TechCrunch:

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

3. عملية مبسطة من المصمم إلى المطور

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

اتجاهات تصميم الويب في العام المقبل وفقًا لمصمم المنتج Gadzhi Kharkharov:

4. عنوان كبير وعالي الصوت

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

شركاء #MadeInWebflow Heco

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

في بيئة اليوم المزدحمة والمثقلة بالمعلومات، تعمل العبارات القصيرة والقوية مثل هذه بشكل جيد لأي علامة تجارية.

5. العلامات المعقدة التي تأتي من أساسيات التصميم الجرافيكي

إذا أردنا التنبؤ بتطور تصميم الويب (على الأقل جانبه المرئي)، فنحن بحاجة إلى إلقاء نظرة على تاريخ التصميم الجرافيكي.

في السنوات القليلة الماضية، كان تخطيط صفحة الويب مقتصرًا على CSS، لكن الوحدات الجديدة مثل Flexbox وCSS Grid (القادمة في مارس 2017) ستسمح لك بتحقيق أفكار تخطيط الويب الأكثر جموحًا.

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

فيما يلي بعض الأمثلة عما يمكن توقعه (بافتراض أن لديك متصفحًا يدعم CSS Grid، مثل Firefox Nightly، أو Safari Technical Preview، أو Chrome Canary):

مختبر التخطيط التجريبي جين سيمونز

انتبه إلى أسلوب الكتلة الرئيسية - وهو إشارة واضحة إلى تاريخ التصميم الجرافيكي.

الشبكة على سبيل المثال

يمكنك رؤية المزيد من الأمثلة على الموقع.

6. المزيد من صور SVG

يتمتع SVG (رسومات متجهة قابلة للتطوير) بفوائد أكثر لمصممي ومطوري الويب مقارنة بتنسيقات الصور التقليدية مثل JPG أو PNG أو GIF.

المزايا الرئيسية لـ SVG موصوفة باسم التنسيق نفسه - قابلية التوسع والمتجه. على عكس التنسيقات المستندة إلى البيانات النقطية والبكسل، تتكون صور SVG من متجهات - أوصاف رياضية لشكل الكائن. وهذا يعني أن SVG مستقلة عن الدقة وأن الصور بهذا التنسيق ستبدو رائعة على أي شاشة أو جهاز. لا داعي للقلق بشأن كون الصور ضبابية على شبكية العين.

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

7. أدوات للتصميم سريع الاستجابة القائم على القواعد

لقد غيّر التصميم سريع الاستجابة الطريقة التي ننظر بها إلى تطبيقات الويب وكيفية إنشائها تمامًا.

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

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

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

اتجاهات التصميم لعام 2017 وفقًا لريان موريسون، كبير مصممي الجرافيك.

8. المزيد من الألوان الزاهية

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

ألق نظرة على موقع Asana الجديد مع مجموعة من الألوان:

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

كل شيء في Stripe لا يتطلب عرضًا منفصلاً:

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

على الرغم من أنه ربما يكون من المفيد تقليل السطوع قليلاً؟ نحن نراقبك، أسانا.

9. مزيد من التركيز على الرسوم المتحركة

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

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

10. علامات غير عادية

يشتهر عام 2016، مثل السنوات القليلة الماضية، بالمناقشات التي لا نهاية لها حول أن تصميم الويب إما يموت أو يفقد روحه.

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

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

تصادم النصوص والصور مع بعضها البعض:

النصوص والصور متناثرة (على ما يبدو) بشكل عشوائي عبر الصفحة:

كان هذا هو الجزء الأول من ترجمة مقال “18 اتجاهًا لتصميم الويب في عام 2017”. هل تتفق مع آراء خبراء Webflow؟ ما هو نوع تصميم الويب الذي تعتقد أنه سيكون رائجًا في العام المقبل؟

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

1. مبدأ الهاتف المحمول أولاً

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

2. الرسوم التوضيحية مرفوعة

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

مثال توضيحي من موقع dropbox.com

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

3. الرسوم المتحركة

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

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

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

4. الألوان الجريئة

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

مثال على استخدام الألوان الغامقة على Spotify.com

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

5. التمرير غير العادي والمنظر

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

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

6. الأنماط غير المتكافئة

تأثر عام 2016 بالأنماط الشبكية، وفي عام 2017 كان هناك اتجاه نحو استخدام الأنماط غير المتماثلة و"الممزقة". على الرغم من حقيقة أن الغالبية العظمى من العلامات التجارية تفضل قوالب واجهة المستخدم التقليدية والواضحة للبطاقات (بعد كل شيء، فهي منطقية وسهلة التنقل)، إلا أن بعضها لا يزال يبدأ في التجربة من أجل التميز وتمييز أنفسهم عن المنافسين.

مثال على التصميم غير المتماثل (isaidicanshout.com)

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

7. الظلال

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

ظلال عميقة عند المرور فوق الصور (abduzeedo.com)

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

8. الخطوط الكبيرة والجريئة

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

مثال على استخدام الخط الكبير (bigyouth.fr)

9. الحد الأدنى

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

بساطتها المطلقة (mathieuboulet.com)

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

10. مزج النص الأفقي والرأسي

يؤدي تغيير الترتيب الأفقي المعتاد للنص إلى "تحديث" الموقع ويحفزك على قراءة ما هو مكتوب هناك.

مثال على اتجاه نص غير عادي (takewhatyoucancarry.com)

يرجى ملاحظة أن المزيج تم بشكل جيد - لا توجد عناصر مربكة غير ضرورية. تتم كتابة كلمة "خذ" عموديًا - وهذا يكفي لعرض المحتوى ذي العلامة التجارية.

11. "التعديل"

في هذه الحالة، يجب أن يتباين النص مع صور الخلفية حتى لا يتم دمجها.

13. لونين

يعتمد تصميم الموقع على لونين أساسيين. تبدو أنيقة وحديثة. على سبيل المثال، تم تصميم موقع راديو التصميم الأسترالي على هذا النمط بالضبط:

14. الخطوط الهندسية

في هذه الحالة، يتم دمج الخطوط مع مجموعة متنوعة من الأشكال الهندسية. خطوط مثل Futura وITC Avant Garde وProxima Nova مناسبة لهذا الغرض.

مثال على استخدام الخطوط "الهندسية" (hugeinc.com)

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

دعونا نلخص ذلك

في عام 2017، سيحاول المصممون إضافة لمسات فردية إلى بساطتها المعتادة. سيفعل البعض ذلك بالألوان، والبعض الآخر بالخطوط، والبعض الآخر باستخدام موضع الكتلة غير المعتاد.

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

نتعلم كل عام شيئًا جديدًا عن التصميم، وعام 2016 ليس استثناءً. لقد حقق المقال الذي كتبناه العام الماضي نجاحًا كبيرًا لدرجة أننا قررنا تقديم بعض التوقعات لعام 2017، فلنبدأ!

تم نشر مقال جديد →← اقرأ واستلهم!

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

ما هي الاتجاهات في تصميم الويب التي تنتظرنا في عام 2017؟

01. تصميم شبه مسطح

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

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

مشروع: الموارد | أداة UI/UX لخدمات الويب
المؤلفون: رسلان لاتيبوف; رسومات إل إس؛ انطون ميشين؛ فاليري جوركوف

مشروع: قائمة تشغيل المستمع

02. الصور المتحركة (الصور السينمائية)

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

03. المزيد 3D

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

مشروع: أحببتها

مشروع: الجوائز السنوية المفتوحة

مشروع: حذاء اير ماكس ’17

مشروع: نايكي إف سي. | الكرات الذهبية ثلاثية الأبعاد في العالم الحقيقي

مشروع: أفضل لك العلامة التجارية

04. الرسوم المتحركة

الرسوم المتحركة موجودة بشكل متزايد في تصميم الويب، ويمكن أن يكون التنسيق بأي شكل من الأشكال - WebGL CSS أو GIF أو SVG أو الفيديو. لقد كانت الرسوم المتحركة واحدة من أهم اتجاهات تصميم الويب في العام الماضي، فلا تخجل من استخدامها.

مشروع: أطفال نيكلوديون يختارون الرئيس

مشروع: تطبيق AR Virtual Fitness Coach

مشروع: زه أورو- ريو 2016

05. المواقع/الصفحات المقصودة المكونة من صفحة واحدة

في عام 2017، سنشهد نموًا في مواقع الصفحة الواحدة نظرًا لقدرتها على الأغراض التسويقية وقدرتها على استهداف الزوار بشكل أفضل.

إذا كنت بحاجة إلى صفحة مقصودة، يمكنك طلبها مني →

06. الأشكال الهندسية والأنماط والخطوط والدوائر

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

مشروع:

مشروع: DRAP.agency العلامات التجارية

مشروع: فايزر - نشط و50+ لصحيفة نيويورك تايمز

07. الألوان الشجاعة

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

مشروع: إدريس - الشعار من تصميم MiLo

مشروع: Rendered - موقع ويب تجريبي مستجيب لبرنامج Adobe

مشروع: b2mach

08. التمرير المبتكر واختلاف المنظر

هذه فكرة مرئية رائعة ستضيف التفرد إلى أي موقع ويب. من اختلاف المنظر متعدد الطبقات إلى اختلاف منظر الفيديو، أصبح كل شيء ممكنًا باستخدام البرنامج الإضافي D.ex Multilayer Parallax. تم تطوير هذا المنتج بالكامل بواسطة استوديو Milothemes تحت إشراف Loredana Papp وMihai Baldean. وهي متاحة للشراء في سوق إنفاتو/codecanyon.net

هذا مكون إضافي لـ WordPress يسمح لك بإنشاء كتل Parallax جميلة بأكثر من طبقة واحدة. كن مبدعًا واجمع بين الطبقات بأي نمط تريده. لقد قمنا بعمل 12 مثالًا مختلفًا في دليل المكونات الإضافية لتسهيل مقدمتك الأولى لعالم المنظر الرائع. العب مع الطبقات!

09. انتقالات اللون

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

10. تصفح الهاتف المحمول (التصميم سريع الاستجابة)

شهد عامي 2015 و2016 زيادة كبيرة في عدد المشاهدات من الأجهزة المحمولة. أصبحت الأجهزة اللوحية والهواتف الذكية الآن الخيار المفضل لتصفح الويب، متجاوزة أجهزة الكمبيوتر المكتبية والمحمولة - وما زال هذا الاتجاه مستمرًا. يجب تحديث أي موقع ويب لا يحتوي على تصميم ويب سريع الاستجابة في أسرع وقت ممكن!

مشروع: الرسوم المتحركة لموقع الويب المستجيب

11. الرسومات والرسوم التوضيحية المخصصة

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

12. الاستخدام الإبداعي للمساحة المحايدة والشبكة

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

13. احكي القصص (رواية القصص)

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

المزيد من مقاطع الفيديو حول رواية القصص من أعمال الشباب:

14. التحميل التدريجي للمحتوى (Lazy Loading)

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

15. تقسيم المحتوى

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

16. نماذج ملء الشاشة

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

17. مقاطع الفيديو في كل مكان

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

مشروع: هيلسونج

18. تحسين محركات البحث مهم! (SEO مهم)

يعد تحسين محركات البحث (SEO) أمرًا مهمًا جدًا لموقع الويب، لذا فإن موقع الويب الجميل الذي لا يحتوي على تحسين محركات البحث (SEO) الجيد سيظل غريبًا.

19. التنقل المخفي

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

20. تفاصيل التصميم الصغيرة

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

مشروع: Barometa - منصة عمل الجيل التالي

21. اتجاهات تصميم الشعار

21.1. تقليلية

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

21.2. مرسومة باليد

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

21.3. مساحة سلبية

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

21.4. الاقتصاص

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

21.5. الهندسة

هذا الاتجاه هو المدرسة القديمة، لكنه واحد من تلك الأساليب التي لن تموت أبدًا.

21.6. فن الخط

يحظى هذا الاتجاه بشعبية كبيرة بين شركات الجيل الجديد

المؤلفون: سام هيلي; أندريا شلافر؛ جاسيك جانيتشاك

21.7. أنماط

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

المؤلفون: نيك إيدلين; ستانيسلاف ألينيكوف؛ لوكاس جيل تورنر

21.8. الشعارات المتحركة

يعد تصميم الحركة اتجاهًا شائعًا اليوم، ويمكننا رؤيته في جميع مجالات التصميم.

المؤلفون: خافيير ميراندا نييتو; شركة العمل

21.9. كلاسيكي

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

المؤلفون: رومان دودونوف; أفكار مينغو لأعلى؛ سوف نحاول كذلك

21.10. انتقالات اللون

التدرجات موجودة في كل مكان هذا العام، والشعارات ليست استثناءً.

21.11. الرسوم التوضيحية في الشعارات

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

المؤلفون: بودي دانيال؛ جاسيك جانيتشاك

21.12. التصوير في الشعارات

يحظى الجمع بين الصور والطباعة بشعبية كبيرة الآن. إنهم يعملون بشكل جيد معًا ويخلقون تباينًا بينهم.

22. اتجاهات الطباعة

22.1. طباعة كبيرة وجريئة وجميلة

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

المؤلف: ألكسندر لاجوتا

المؤلفون: كيم مارين

مشروع: سلسلة باوجاسم - الحزمة 4

22.2. التدرجات/التحولات اللونية في الطباعة

التدرجات هي بلا شك اتجاه اليوم، وستجدها في الطباعة أيضًا.

22.3. التسلسل الهرمي البصري

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

22.4. الطباعة الصغيرة

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