تصميم الويب البسيط: عندما يكون أقل هو أكثر
كمصممين ، ونحن نعلم جميعا أن تصميم الحد الأدنى يمكن أن يحقق نتائج جميلة.
لا يزال العديد من المصممين يواجهون صعوبة في إنشاء واحد ؛ إما أنهم يواجهون صعوبة في إنشاء صفحة بحيث تبدو عناصر قليلة جيدة أو النتيجة النهائية لا تبدو "كاملة".
هناك العديد من المقالات على شبكة الإنترنت حول الحد الأدنى وتهدف هذه المقالة لمساعدتك على تحقيق تصميم الحد الأدنى الذي هو جميل ولكن ليس العارية.
ولأجلها ، سنقدم عرضًا صغيرًا للتصميمات البسيطة ، بحيث يمكنك تحليل سبب نجاح بعض التصاميم ، والبعض الآخر لا يعمل.
ما هو تصميم الحد الأدنى؟
تم وصف التصميم البسيط على أنه التصميم في أبسط العناصر الأساسية والألوان والأشكال والقوام.
الغرض منه هو جعل المحتوى بارزًا ويكون نقطة التركيز. من الناحية المرئية ، يهدف التصميم البسيط إلى التهدئة ورفع العقل إلى الأساسيات .
بدأت حركة التصميم في سويسرا وتم تطبيقها بعد ذلك على مجموعة متنوعة من الوسائط: التصميم الجرافيكي ، والهندسة المعمارية ، والموسيقى ، والأدب ، والرسم ، ومؤخرًا ، تصميم الويب.
على الرغم من أن التصميم البسيط قد أخذ قبل عشرات السنين ، فإن الأيام الأولى للإنترنت لم تظهر ذلك. حتى من دون الشعارات الدوارة ، وألواح التشابك والألوان الزاهية ، كانت تصميمات مواقع الويب تشوش وفجأة .
سنذهب على المبادئ الأساسية للتصميم الحد الأدنى. ولكن حتى إذا اخترت عدم اتباع جمالية بسيطة ، يمكن أن تساعدك الدروس هنا على تبسيط تصميمك ، مهما كان أسلوبك.
الاقل هو الاكثر
كما ذكرنا ، فإن البسيط يجلب المحتوى الأكثر أهمية في المقدمة ويقلل من الانحرافات للمستخدم. إذا كانت الصفحة تحتوي على العديد من العناصر ، فسيكون المشاهد مرتبكًا حول مكان الظهور أو إساءة تفسير أولوية كل عنصر. يضع التصميم البسيط التركيز بشكل مباشر على المحتوى.
على سبيل المثال ، أي لمسة من اللون على تصميم أبيض وأسود ، من المؤكد أن تحصل على انتباه المستخدم. يصبح اللون نفسه النقطة المحورية . دعونا ننظر في مثال محدد:
من المحتمل أنك رأيت هذا النوع من التصميم من قبل: خلفية بيضاء واضحة ، كتلة واحدة من المحتوى وعنصر رسومي واحد.
يجلب عنصر الرسم اللون والملمس والشكل. ومن الواضح أن العنصر الأكثر أهمية على الصفحة ، ويحدد العلامة التجارية لهوية المصمم.
مع تعقيد هذا العنصر الرسومي المعين ، قد يجعله المزيد من المحتوى في هذه الصفحة أقل ملحوظة وأقل أهمية. الحفاظ على المحتوى إلى أدنى حد ممكن ، حقق المصمم التوازن المثالي.
كيفية تصغير المحتوى
الخطوة الأولى لإنشاء تصميم الحد الأدنى ، أو تبسيط تخطيط فقط ، ليس مجرد قطع معظم الرسومات ، ولكن بدلاً من ذلك إعادة التفكير في المحتوى وتجريده إلى متطلبات العارية. عندئذ فقط سوف تحقق العناصر الأكثر أهمية على الصفحة التأثير المقصود.
تمامًا كما تخطط لأي موقع ويب ، اكتب المحتوى الذي تريده: الشعار ، والمقدمة ، والتنقل ، وما إلى ذلك. قص أي شيء آخر غير ضروري. تخلص قدر الإمكان .
فيما يلي بعض العناصر التي ربما لا تحتاج إليها. ضع في اعتبارك أن هذا مجرد دليل. تعتمد متطلباتك الدقيقة على تصميمك الخاص. قد لا تكون بعض العناصر أدناه مطلوبة لموقعك على الويب.
- الرموز أو الرسومات لوسائط التواصل الاجتماعي أو قسم الوسائط الاجتماعية على الإطلاق
- Taglines والأوصاف أو مقدمات إضافية
- قوائم "مميزة" و "شائعة" و "حديثة" (بما في ذلك قوائم خلاصات Twitter و RSS)
- الصفحات التي تحتوي على أكثر من ثلاثة أقسام رئيسية (مثل "مقدمة" ، "حول" و "الخدمات")
- صفحات الاستكشاف الثانوية.
النقطة هنا هي عدم جعل الموقع الإلكتروني أقل وظيفية ، بل تقليل العناصر غير الضرورية (وبالتالي تسليط الضوء على العناصر الضرورية) أو دمج الأقسام في تخطيط أبسط (على سبيل المثال ، من خلال دمج روابط وسائل التواصل الاجتماعي في "حول" أو القسم التمهيدي).
يمكنك أيضًا تقسيم المحتوى إلى صفحات منفصلة ، مع إعطاء كل جزء من المحتوى مزيدًا من الاهتمام.
كيفية تبسيط التصميم
الآن حان الوقت لتبسيط التصميم قدر الإمكان.
يجب أن تحتوي التصميمات البسيطة على القليل من الملمس أو اللون أو الشكل أو الخطوط أو المحتوى أو النوع. الذهاب عارية جدا ، مع ذلك ، وسوف يكون التصميم ممل. فبدلاً من التخلص من كل شيء ، اعطِ نداء التصميم من خلال تقديم ميزة واحدة مهمة فقط هي النقطة المحورية .
اختر ما سيكون هذا التركيز ، واحتفظ بالنصائح التالية في اعتبارك أثناء العمل على تصميمك.
استخدم Wireframe العظمى
في استعراض قسم العرض أدناه ، نرى أن بعض المصممين قد أضافوا اهتمامًا مرئيًا مع رشقات دقيقة من الألوان أو الطباعة الفريدة أو أشكال مثيرة للاهتمام. ربما كان العنصر الأكثر أهمية الذي يعتمد عليه الجميع هو إطار سلكي فريد .
يتطلب إنشاء إطار سلكي لمثل هذه الصفحة العارية القليل من الاهتمام الإضافي. باستخدام wireframe الصحيح ، يمكنك تحقيق التسلسل الهرمي والتنظيم المناسب وإنشاء اهتمام مرئي.
لإيجاد إطار سلكي ، اتبع الخطوات التالية:
- حدد المحتوى الذي تحتاجه تمامًا
- في قائمة ، حدد أولويات المحتوى
- رسم بضعة إطارات سلكية استنادًا إلى قائمتك لتجربة أفضل التسلسل الهرمي المرئي.
عند العمل على إطار العمل السلكي ، ضع في اعتبارك موضعًا ولكن أيضًا بصريًا. على سبيل المثال ، إذا كان لشعارك لون لا تعيد استخدامه في أي مكان آخر في التصميم ، فعليك حساب ذلك.
الفضاء الأبيض
الفضاء الأبيض هو مرادف عمليا مع بساطتها.
بغض النظر عن مدى إبداعك في ذلك ، فإن التصميم البسيط بدون الكثير من المساحة البيضاء ليس بسيطًا على الإطلاق. لذا ، تأكد من إضافة مساحة بيضاء حول العناصر أكثر من المعتاد.
يلزم توفير المساحة لموازنة العناصر القليلة التي ستظهر في الصفحة.
التوازن ، المحاذاة ، التباين
في حين أن الكثير من الحمل يمكن أن يحمله فراغ أبيض وسيرفان جيد ، يجب أن تؤخذ عناية خاصة مع أساسيات التصميم. أكبر ثلاثة تتعلق بساطتها هي التوازن والمحاذاة والتباين .
تأكد من أن التصميم الخاص بك يلتزم بهذه المبادئ وأنه لا يحتاج إلى مساعدات بصرية تكميلية لكي تبدو "منتهية".
ضع مبادئ التصميم الأساسية الأخرى في اعتبارك أيضًا. استعراضها وتجربة خيارات مختلفة لتحقيق أفضل نتيجة. الدفع " مبادئ التصميم "لمزيد من الأفكار.
عندما يصبح التصميم المفرط عادة
التصاميم الزائدة تصبح عادة. بغض النظر عن مدى صعوبة محاولة الحفاظ على تصميم بسيط ، فإنه يخرج فوضوي ومعقد. لإصلاح هذا ، يجب علينا تشكيل عادات جديدة.
حاول مراجعة النصائح أعلاه قبل كل مشروع لإبقائها في ذهنك أثناء العملية. ركز على تطوير عادة واحدة في كل مرة. على سبيل المثال ، اعمل على تقليل المحتوى وتبسيطه قبل الانتقال إلى المساحة البيضاء.
إذا وجدت نفسك في موقف صعب وهو يفكر ، فإن "شيء ما مفقود" يحاول أولاً أخذ شيء ما بدلاً من وضع شيء جديد فيه.
كل جانب من جوانب بساطتها يتطلب موهبة مختلفة. سوف تصبح تصميماتك أبسط كلما وضعت هذه المبادئ موضع التنفيذ.
مع الأخذ في الاعتبار ، بمجرد تطبيق التقنيات التي نوقشت هنا ، انظر إلى المنتج النهائي ومعرفة ما إذا كان يمكنك العثور على طرق لتبسيط النتيجة أكثر من ذلك.
يمكنك التركيز على المناطق التي لم تكن متأكداً منها أثناء عملية التصميم ، ويمكنك أن تطلب من مصممين آخرين الإشارة إلى العناصر التي ربما فاتتهم.
عرض الحد الأدنى
أدناه عرض موجز للتصاميم الحد الأدنى. انظر كيف ينفذ كل من هذه المبادئ التي ناقشناها. انظر أيضًا أي منها يكسر إرشاداتنا ويفكر في سبب استمرارها في العمل.
1. جيمس يوم صور
2. كيلسويتش الجماعية
3. وحيدا
4. ديبوشيل
5. XPD.no
6. لعبة نيويورك
7. جوشوا سيربوس
8. اه ستوديو
9. سيمور باول
10. رمز Werk
11. نيل ويلسون المعماريين
12. عدم تنسيق
13. الزوم
14. Checkland Kindlysides
15. Blumenthal
16. تنك لندن
17. فخور الإبداعية
18. Kimag
19. بيرنات فورتيت
20. كل يوم
بعض الاتجاهات
كما ترى ، يتميز تصميم الويب البسيط ببعض الاتجاهات الواضحة. يساعدنا إدراك هذه الاتجاهات على تحسين تصميماتنا بعدة طرق.
لا نستطيع فقط أن نستمد الإلهام من التصميمات التي عمل عليها المصممون الآخرون بجهد ، ولكننا نستطيع أن ننفصل عن هذه الاتجاهات لننشئ طريقنا الإبداعي الخاص.
دعونا نناقش بعض هذه الاتجاهات بمزيد من التفصيل.
اسود و ابيض
واحدة من الاتجاهات الأكثر وضوحا هو الاستخدام الواسع النطاق للأبيض والأسود . هذا واضح بما فيه الكفاية: يجب تبسيط اللون مع الملمس والشكل والمحتوى. ولكن يمكن أن يكون مبالغا فيه هذه الأيام وتبدو مملة بعض الشيء.
انظر إلى بعض مواقع الويب التي حددت ألوانًا في العرض أعلاه ، وشاهد كيف تميزها عن التصاميم البسيطة الأخرى. أيضا ، التفكير في كيفية تمكنهم من البقاء الحد الأدنى حتى مع مثل هذا الاستخدام القوي للون. إليك مثال واحد:
الطباعة مثيرة للاهتمام
يرتبط تصميم الويب القائم على الطباعة ارتباطًا وثيقًا بالبساطة.
عندما يكون لدى المصممين القليل من الأشياء الأخرى لإثارة انتباه المستخدم ، فهم غالباً ما يستغلون الطباعة المثيرة. يمكنك حتى الذهاب إلى حد استخدام الطباعة كعنصر المرئي الوحيد.
هذا هو أسلوب جريء ولكن لا يزال هناك اتجاه في حد ذاته . ابحث عن طرق لجعل الطباعة تعزز التصميم مع الحفاظ على الفريد.
فلاش
هناك عدد مذهل من تصميمات الويب البسيطة التي تستند إلى الفلاش. مع القليل من الأشياء الأخرى للتحفيز البصري ، يمكن أن يستفيد التصميم من الرسوم المتحركة الدقيقة (مثل تلاشي النص والخروج منه) دون التغلّب عليه.
كذلك ، يزيل Flash بعض القيود في عملية التصميم. يمكن أن تكون الأسطر غير التقليدية ، والطباعة ، والعناصر الأخرى أسهل في تحقيقها باستخدام برنامج Flash بدلاً من الطرق التقليدية.
تغليف
يأتي التصميم البسيط بالعديد من الأشكال ، ومع ذلك كثيرًا ما نرى نفس النموذج يتكرر. يمكن أن تصبح الاتجاهات متعجرفة ، ويجب علينا محاربة الرغبة في التقليد مع فهم ما يدور حول اتجاه منطقي.
على أي حال ، يمكن أن تكون البساطة جميلة وستستمر لسنوات قادمة ، لذا فإن تعلم بعض تقنياتها يمكن أن يكون مفيدًا بشكل لا يصدق ، سواء لعملائك أو لمشاريعك الخاصة.
وحتى إذا كنت غير مهتم بالأسلوب البسيط ، يمكن أن تساعدك الدروس والمبادئ المعنية على تبسيط تصميماتك ، وهو أمر جيد دائمًا.
مكتوبة حصريًا لـ Webdesigner Depot بواسطة Kayla Knight.
إذن ، ما الذي يجعل التصميم البسيط فعالاً للغاية ، ومتى يجب أن نتجنب ذلك؟ يرجى مشاركة تعليقاتكم أدناه ...