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

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

1. تصميم "تجريدي" غير قياسي

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

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

2. خيارات التنقل الجديدة

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

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

3. البطاقات في التصميم

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

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

4. تقسيم التخطيطات مع تقسيم الشاشة إلى جزأين

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

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

5. الطباعة الكبيرة والأصلية

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

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

6. التدرجات والألوان الزاهية

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

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

7. الرسوم المتحركة والتفاعلات الدقيقة

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

8. تأثير المنظر

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

9. الواقع الافتراضي تقريبًا

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

10. تصميم طبيعي ملموس

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

11. اتجاهات تصميم الويب الأخرى لعام 2017

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

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

الأشكال الهندسية

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

الرسوم التوضيحية فريدة من نوعها

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

المجموع

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

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

1) النسخة المحمولة أمر بالغ الأهمية

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

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

لاحظ التنقل "النقطة" في لقطة الشاشة أعلاه. هذه القائمة هي تحية واضحة لعصر الهاتف المحمول.

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

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

يتذكر: 79% يغادر مستخدمو الهاتف المحمول على الفور المواقع التي لم يتم تحسينها لشاشات الهاتف؛ يخفض Google وYandex مواضع هذه الموارد في نتائج البحث.

3) الخطوط العريضة الكبيرة

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

يستخدم Nuture Digital أحرفًا ضخمة كنوافذ لعرض مقاطع الفيديو الخلفية. (بالضرورة اذهب إلى الموقع لرؤيته).

4) صور فوتوغرافية أصلية

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

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

5) الرسوم المتحركة: من التفاعلات الصغيرة إلى تأثيرات ملء الشاشة

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

6) استخدم الفيديو كخلفية

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

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

7) الألوان الجريئة

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

8) تخطيطات الشبكة وتصميم البطاقة

تعد واجهات القوالب المبنية على البطاقات اتجاهًا آخر لتطوير مواقع الويب يُزعم أنه سيتطور في عام 2017. يتم استخدام تصميم البطاقة من خلال موارد مثل Pinterest وFacebook وVKontakte وOdnoklassniki وTwitter وGoogle+. مبدأ الحاوية لتنظيم المحتوى (صورة + وصف قصير ± رابط) يبسط البحث عن المعلومات الضرورية. يقوم الزائرون بمسح محتويات الصفحة بسرعة قطريًا، ويلتقطون الأجزاء التي تهمهم. ومع تقلص مدى انتباه المستخدمين كل عام، تزداد أهمية تصميم البطاقة. بالإضافة إلى ذلك، فهو قابل للتكيف في البداية، مما يعني أنه مناسب للهاتف المحمول.

9) التمرير المبتكر والمنظر

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

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

10) تخطيطات غير متماثلة وفوضوية

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

خاتمة

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

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

ومع ذلك، هناك أسباب لمتابعة الاتجاهات. إن التحقق من مواقع مثل Awwwards أو FWA أو CSS Design Awards يمكن أن يلهمك، ونتيجة لذلك، يساعدك على النظر إلى ما هو أبعد من عادات التصميم الخاصة بك. يمكنك التعرف على عوالم مرئية جديدة، والتي يمكنك بعد ذلك (بوعي أو بغير وعي) دمجها مع لغة رسومية. تساعد مشاهدة عمل الآخرين على تحسين مهاراتك الخاصة بالإضافة إلى مواكبة أحدث التقنيات.

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

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

ماذا ينتظرنا أيضًا في تصميم الويب في عام 2017؟ وهنا توقعاتي.

تكوين مفتوح

حتى وقت قريب، كانت التراكيب "المغلقة" والمتماثلة والثابتة تهيمن على عالم التصميم. ومنذ عام 2016 ظهرت العديد من المواقع التي ابتعدت عن هذا الأسلوب. تكتسب التركيبات المفتوحة التي تحتوي على عناصر مرتبة بحرية والتي تعمل في مكان ما خارج الشاشة شعبية - يمكن رؤية أمثلة على هذا العمل على romainpsd.com أو durimel.io أو booneselections.com. إن توزيع العناصر على هذه المواقع يعطي الانطباع بأنها لا تزال تعيش خلف الشاشة.

عدم التماثل

لقد كسر عام 2016 أيضًا قاعدة التناظر التي سيطرت على الصناعة لبعض الوقت. قام العديد من المصممين بإنشاء تخطيطات غير متماثلة بعيدة كل البعد عن التوازن التام على الجانبين الأيسر والأيمن. كأمثلة، أود أن أعرض لكم موقع Culture.pl الممتاز، وموقع Dada-data.net الفوضوي، وموقع durimel.io المذكور سابقًا.

تنوع

ابتكر المصممون تركيبات أكثر ديناميكية تتميز بخطوط قطرية أكثر تقاطعًا (poigneedemainvirile.com، vanderlanth.io)، أو أشكال أكثر تعقيدًا (residente.com/en، helloheco.com، Predictiveworld.watchdogs.com).

وهم الفوضى

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

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

بعض الأشكال الهندسية "المعلقة في الهواء" ليس لها سوى غرض زخرفي (ميلاني-ف). وهذا أيضًا نموذجي للعناصر المتداخلة. تتداخل النصوص جزئيًا مع الصور الفوتوغرافية، كما هو الحال في e03.epicurrence.com وmelville-design.com، أو يتم تركيب الصور فوق بعضها البعض، كما يمكن رؤيتها على olivierbernstein.com.

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

الخلفيات والأنماط الغنية

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

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

نمط الشبكة

أحد المواقع الأولى التي ظهرت عليها هذه الشبكة كان werkstatt.fr، والذي، مع ذلك، لم يستخدم الرسوم المتحركة المميزة.

يتم عرض طريقة مختلفة قليلاً لاستخدام نمط الشبكة على klimov.agency وbrand.uber.com وmaisonullens.com. في هذه الحالات، يكون للشبكة وظيفة محددة جدًا - وهي جعل حركات العناصر منطقية. يتيح لك ذلك ترشيد الحلول غير القياسية ويقدم إجابات لأسئلة مثل "لماذا لا تتطابق هوامش الرسم التوضيحي مع هوامش الزر"؟ وهذا يخلق إيقاعا، وفي الوقت نفسه يبرر انتهاكاته.

التفاصيل الزخرفية

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

نادرًا ما يتم إنشاء الأزرار كمستطيلات واضحة تحتوي على نص بداخلها. وتظهر غالبًا كخطوط ناعمة ومتوازنة، مثل تلك الموجودة على dahllaw.dk أو yasuhiroyokota.com. خيار الزر الآخر هو التمرير المذهل على Canvas، كما هو الحال على hpsoundincolor.com وcavalierchallenge.com.

مفاهيم مدروسة - رسوم متحركة سلسة بين الأقسام

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

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

الرسوم المتحركة المثيرة للاهتمام تزين تخطيطات بسيطة. يضيفون قيمة جديدة ويجعلون الصفحة فريدة من نوعها. لقد أصبحوا جوهر المشروع بأكمله، كما هو الحال في Ifly50 أو Tennentbrown.co.nz. غالبًا ما تنشئ الرسوم المتحركة بنية جميلة وأنيقة على مواقع الويب: Cuberto.com، أو lookbook.wedze.com، أو skarv-fashion.com، أو corentinfardeau.fr.

الطباعة المتنوعة

يمكن أيضًا رؤية الاتجاهات المتغيرة في الخطوط المستخدمة. حتى وقت قريب، كانت شبكة الإنترنت بأكملها تهيمن عليها الخطوط البسيطة والغريبة مثل Helvetica أو Roboto أو Lato أو Open Sans. يتم استخدام الأسلوب الغريب "الزخرفي" قليلًا في كثير من الأحيان في العناوين، مع اختيار نسخة أبسط لبقية النص. لا يتم استخدام خطوط Serif أبدًا.

على مدى العامين الماضيين، بدأ الوضع يتغير. يستخدم المصممون بجرأة أنواعًا مختلفة من الخطوط. الآن هم أكثر استعدادًا للعمل مع التناقضات - الجمع بين خطوط serif وsans serif.

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

تعمل القدرات التكنولوجية الأكبر والقرارات الأكثر جرأة على دفع نمو التنوع في طباعة الويب.

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

أصبحت الخطوط الهندسية sans-serif شائعة جدًا، مثل الخطوط الكلاسيكية Futura أو ITC Avant Garde أو Proxima Nova أو تلك المتوفرة في مكتبة Google - Poppins أو Montserrat. هذه الخطوط أكثر تعبيرًا من خطوط neo-sans serif "غير المرئية". يمكن تحقيق طابع أكثر "عدوانية" وتعبيرًا لموقع الويب باستخدام سمك أكبر، كما هو الحال في الموقع القديم إلى حدٍ ما Huginc.com، ولكن فيما يلي أمثلة أحدث: التسلسل.co.uk، أو Startuplab.no، أو www.protest.eu .

الخطوط الشريفة

في كثير من الأحيان، يتم استخدام الخطوط الرقيقة ليس فقط للنص الأساسي، ولكن أيضًا للعناوين الكبيرة. غالبًا ما يتم استخدام العناصر الزخرفية، مثل تلك الموجودة على duhaihang.com أو jennyjohannesson.com. تشمل الخطوط الشائعة الأخرى تلك المتعلقة بـ Bodoni أو Didot.

الخطوط أحادية المسافة ("الآلة الكاتبة")

يعد استخدام الخطوط المتناسبة، والتي ترتبط عادةً بالآلات الكاتبة، أمرًا مبتكرًا. ويمكن الآن رؤيتها على مواقع مثل admirhadzic.com أو cuberto.com أو designembraced.com.

مزيج الخطوط المتناقضة

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

طباعة ضخمة كجزء من الصورة الرئيسية

كان الشيء الرائع والشائع جدًا هو استخدام أحجام نص كبيرة جدًا على الصور الرئيسية. أدى هذا إلى إنشاء تباين قوي جدًا بين العناوين وبقية المحتوى. يمكن رؤية الأمثلة على موقعoursroux.com أو femmefatale.paris أو monsieurcaillou.com.

في بعض الأحيان، يتم استخدام الحروف في البداية كديكور، مثل coretinfardeau.fr أو nurturedigital.com.

والمثال الرئيسي على ما سبق هو موقع jennyjohannesson.com، الذي يستخدم الصفات الزخرفية للخط الرقيق Goku.

تأثيرات إضافية تنطبق على الطباعة

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

أحجام الحروف الكبيرة في النصوص

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

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

تعال إلى الجانب المظلم

في عام 2016، استخدم المصممون ألوانًا مختلفة. ولكن يمكنك ملاحظة الميل نحو اختيار الألوان الداكنة.

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

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

لخص

يعد عام 2017 بالعديد من الآفاق المثيرة، ولكن هناك أيضًا بعض المخاطر التي تلوح في الأفق.

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

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

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

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

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

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

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

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

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

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

مفاهيم أساسية

تقول لنا ويكيبيديا:

"الاتجاه هو الاتجاه الرئيسي للتغيرات في سلسلة زمنية."

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

لفك شفرتها، هيا نلعب مع تورينج، فهو يحب جميع أنواع الألغاز. لنبدأ بمفهومين: "اتجاه"و "السلاسل الزمنية".

الاتجاه - اتجاه التطور والميل والطموح. مقسمة إلى اتجاهات دقيقة واتجاهات كبيرة. الأول يعيش في التصميم لمدة 1-2 سنوات، والثاني - 5-7 سنوات.

الاتجاه - اتجاه التطور والميل والطموح. مقسمة إلى اتجاهات دقيقة واتجاهات كبيرة.

ما هي السلسلة الزمنية؟ يتم قياس هذه البيانات بشكل تسلسلي على فترات منتظمة.

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

يتم استخدام طريقتين لتحليل الاتجاهات.

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

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

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

من المستحيل التنبؤ بمستقبل التصميم دون معرفة ماضيه.

المكونات الرئيسية لدورة حياة الاتجاه

• تحليل الماضي؛
• تحليل الحاضر؛
• التوقعات المستقبلية؛
• مقدمة للاتجاه؛
• قبول الاتجاه.

المكونات الرئيسية لدورة حياة الاتجاه.

المهن

ظهرت المهن في السوق التي تتوافق مع كل مكون من مكونات الدورة.

صياد الاتجاه

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

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

هناك بالفعل الكثير من المعلومات التي بدأ الناس في بيعها. ويجري تشكيل مكاتب الاتجاه. تستخدم بيوت الأزياء الشهيرة خدماتها بنشاط.

رائدة الموضة

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

Trendsetter هو الشخص الذي يحاول أن يصبح مؤسسًا أو قام بتأسيس بعض الابتكارات الملموسة أو غير الملموسة.

في ستينيات القرن العشرين، قام إيفريت روجرز بنشر نموذج الانتشار.

وفقا لنظرية روجرز، ينقسم المجتمع إلى خمس مجموعات:

1. المبتكرون - 2.5%.
2. المتبنون الأوائل - 13.5%.
3. الأغلبية المبكرة – 34%.
4. الأغلبية المتأخرة - 34%.
5. المتخلفون - 16%.

2.5% من الناس هم من مولدي الابتكار. نحن نعرفهم - نورمان كوكس، بيل جيتس، ستيف جوبز، إيلون ماسك...

2.5% من الناس هم من مولدي الابتكار.

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

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

مراقب الاتجاه

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

اتجاهات التصميم لعام 2017

الألوان

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

الهدوء المعبر عنه في ظلال الباستيل العارية.

التصميم الجرافيكي

لا يوجد شيء جديد بشكل أساسي.

الشعارات الحية حقا

ليس هذا الاتجاه الجديد - أي قناة تلفزيونية لها شعار متحرك. لكن شعار Seagate يحتوي على بيانات حية مدمجة فيه.

فن الخط

كان هذا الاتجاه شائعًا في العام الماضي وسيظل شائعًا هذا العام أيضًا.

مساحة سلبية

شيء مبتكر؟ لا.

الطباعة العاطفية

GIF، سينماغراف، خلل

الحديثة والبساطة

رسم توضيحي فريد

إحياء 3D

لقد عادت تقنية 3D.

تصميم الحركة

وخير مثال على ذلك هو نايكي. يمكنك دائمًا التنقل بواسطتهم. ألوان الباستيل، 3D، الفضاء السلبي.

تصميم واجهة المستخدم

ومرة أخرى 3D

الرسم التوضيحي بدلاً من التصوير الفوتوغرافي

لقد اعتدنا على رسم الكتب التوضيحية، ولكن ماذا عن رسم التطبيقات ومواقع الويب؟

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

الابتعاد عن القوالب إلى الحلول الأصلية

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

تصميم مستجيب للعمر

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

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

سيكون هناك المزيد منهم في عام 2017.

الإعجاب على Facebook هو تفاعل صغير. وعندما تحدد طبيعة الأشياء المشابهة: "واو!"، "سوبر"، "آه" - فهذا بالفعل تفاعل صغير جدًا. سيكون هناك المزيد منهم.

ردود الفعل اللمسية

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

التخصيص، معرف اللمس

إن إدخال Touch ID في الأجهزة سيسمح باستخدام هذه التقنية في القطاع المصرفي.

سيكون هناك المزيد من مربعات الحوار التي ستخاطب المستخدم بالاسم وتقليد الاتصال بكل طريقة ممكنة.

إن إدخال Touch ID في الأجهزة سيسمح باستخدام هذه التقنية في القطاع المصرفي. تسجيل الدخول/التسجيل عبر Touch ID.

واجهات المحادثة

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

تصميم تجربة المستخدم

عدم الخطية

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

سوف تكون إزالة الخطية شائعة في عام 2017. المزيد من المسارات للتنقل، والمزيد من القرارات خلال كل عملية، ومسارات متباينة لإكمال كل نشاط.

التفاعل الحواري

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

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

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

السلوك والإيماءات والاستعارات الجديدة

لقد سئم الجميع من الأزرار. ستظهر استعارات (متحكمات) جديدة.

تخصص

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

سيكون هناك دائمًا متخصصون، لكن الكثير منا سيكونون عموميين.

الصفات التي يجب أن تتمتع بها عربة المحطة:

لحام - مصمم العملية.

أتمتة التصميم / التصميم الخوارزمي

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

مسؤولية

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

لقد انتهت الاتجاهات الدقيقة. دعونا نلخص.

أعتقد أن عام 2017 سيكون عام الإبداع والعودة إلى الواقعية وعام التعاون مع الذكاء الاصطناعي.

الاتجاهات للسنوات 5-10 القادمة

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

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

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

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

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

وستظل أنظمة التشغيل والتطبيقات موجودة كما هي الآن. ولكن سيكون هناك بديل.

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

كيف يتم إدخال الاتجاهات في العمل؟

لا توجد وصفة، ولكن هناك قاعدتان رئيسيتان:

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

الاتجاه الأكثر أهمية في جميع الأوقات هو التفكير التصميمي الصحيح.

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

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

1. سوف تصبح سهولة الاستخدام سلعة.

مثال على تحسين سهولة استخدام الموقع http://www.telemirspb.ru/

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

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

إذا كنت تعمل في بيئة تنافسية للغاية، فأنت تدرك مدى أهمية تمييز نفسك عن منافسيك.

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

2. سوف تختفي النصوص الطويلة

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

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

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

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

6. استخدام مقاطع سينمائية أو صور "حية".

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

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

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

7. تجنب الصور "النموذجية".

نأمل أن تختفي جميع أنواع الأشخاص الصغار والفتيات الذين يرتدون سماعات الرأس وصور العائلات المبتسمة من المواقع. مثال على الصور المخزنة:

9. الهاتف المحمول أولاً

جوهر هذا النهج هو أنه عند تصميم موقع على شبكة الانترنت، عليك أن تفكر في كيفية عرضه على الأجهزة المحمولة. تمت كتابة العديد من المقالات والكتب حول هذا الموضوع، على سبيل المثال، ننصح بقراءة كتاب "Mobile First" للكاتب Luke Wrobleski.

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

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