في هذه النظرة العامة، ستتعرف على كل اتجاه وأمثلة جميلة ستلهمك لمشروعك القادم.
1. تخطيط استثنائي
الشكل 1
2. تخطيط صفحة واحدة
الشكل 2
3. تخطيط متعدد الأعمدة
الشكل 3
4. الرسوم التوضيحية العملاقة والرسومات النابضة بالحياة
الشكل 4
5. مساحة بيضاء أكبر من ذي قبل
الشكل 5
6. عناصر التصميم الاجتماعي
الشكل 6
7. الملاحة المحادثة
الشكل 7
8. علامة التبويب الديناميكية
الشكل 8
9. مربع بحث كبير
الشكل 9
10. إضافة تأثيرات بصرية إلى التصنيف
الشكل 10
11. الصورة الرمزية للمؤلف
الشكل 11
12. الرموز والإشارات البصرية
الشكل 12
13. فهرس العلامات (استبدال سحابة العلامات)
الشكل 13
14. استخدم الرسوم التوضيحية في المدونات
الشكل 14
15. الرسم بالألوان المائية
الشكل 15
16. الكتابة اليدوية
الشكل 16
17. الرجعية
الشكل 17
18. استخدم المواد العضوية والطوب والتصوير الفوتوغرافي كخلفية
الشكل 18
19. وضع العلامات على الختم
الشكل 19
20. بطاقة السعر
الشكل 20
21. الشريط
الشكل 21
تخطيط استثنائي
كما هو موضح في 40 تخطيطًا للتصميم المبتكر: تخطيط استثنائي قبل بضعة أشهر، نلاحظ اتجاهًا قويًا نحو تخطيطات أكثر تخصيصًا وابتكارًا. بدلاً من استخدام التخطيطات التقليدية التي تشبه الصندوق، يقوم المصممون بتجربة طرق جديدة لتنظيم المعلومات وعرضها والتعبير عنها.
في هذه التصميمات التخطيطية الاستثنائية، غالبًا ما يكون الإبداع العام أكثر أهمية ولا يُنسى من المحتوى المحدد. ومع ذلك، نادرًا ما يتم تجاهل سهولة الاستخدام والطباعة والتصميم المرئي وتنفيذها بعناية. يحظى التخطيط المبتكر بشعبية خاصة في المشاريع الكبيرة ووكالات تصميم مواقع الويب والمواقع الترويجية (مثل الأنشطة التجارية للشركات الكبيرة)، ولكنه يحظى أيضًا بشعبية كبيرة في المدونات.
الشكل 22
عندما يتعلق الأمر بالإبداع، يكون الخط الفاصل بين التصميم القابل للاستخدام وغير القابل للاستخدام غير واضح للغاية؛ لذلك، يعد اختبار قابلية الاستخدام مهمًا بشكل خاص، لأن الفكرة الجديدة يمكن أن تكسر الأشياء الموجودة على موقع الويب. غالبًا ما تكون فكرة جيدة أن يكون لديك توازن بين التصميمات الإبداعية والكلاسيكية والتقليدية، مما يعني محاولة إيجاد توازن بين التصميم القابل للاستخدام "غير القابل للتدمير" (أو حتى الممل في النهاية) والتصميم الإبداعي ولكن غير القابل للاستخدام. تذكر أن الأفكار تستغرق وقتًا لتنمو: إعادة التفكير فيها، ومراجعتها، وتعديلها، وتحسينها، ودمجها في النهاية في تصميمك.
يتم تشجيع المصممين بشدة على الابتعاد عن تقاليد تخطيطات الصناديق التقليدية وتجربة أساليب جديدة وأفكارك الجريئة والمجنونة. اعرض مواهبك!
الشكل 23
الشكل 24
الشكل 25
الشكل 26
الشكل 27
الشكل 28
تخطيط الصفحة الواحدة
هناك طريقة أخرى يستخدمها المصممون غالبًا لإثارة إعجاب الزائرين وهي ما يسمى بتخطيط الصفحة الواحدة: يستخدم هذا التخطيط صفحة واحدة لعرض محتوى موقع الويب. وهذا لا يعني بالضرورة أن هذه التصاميم بسيطة (باتباع مبدأ "الأقل هو الأكثر"). على العكس من ذلك، غالبًا ما يكون هذا النوع من التصميم معقدًا للغاية، ويحتوي على صور غنية وتأثيرات رسوم متحركة حية، وبالتالي يستغرق تحميله بعض الوقت.
الشكل 32
عندما ينقر المستخدم على أحد خيارات التنقل، تتغير الصفحة (تتغير جزئيًا)، ويظهر المحتوى الجديد لـ http://www.knowsky.com في المنطقة التي يتم فيها عرض المحتوى السابق. يتم دعم تأثيرات التمرير والتنقل في هذا التخطيط بواسطة مكتبات JavaScript العامة.
الميزة الرئيسية للمستخدمين تأتي من الحقيقة البسيطة المتمثلة في الحاجة إلى عدد أقل من حركات الماوس والنقرات للحصول على المعلومات التي يريدونها. ونظرًا لأن هذا الأسلوب جديد جدًا، فهو يمثل فرصة رائعة للمستخدمين الذين قد يرتبكون عند استخدام التنقل غير التقليدي. هناك بعض المواقف التي قد يكون فيها الإصدار "الثابت" مفيدًا أو حتى ضروريًا؛ على سبيل المثال، سيتعين عليك توفير إصدار آخر لمحركات البحث والمستخدمين الذين قاموا بتعطيل JavaScript.
الشكل 33
الشكل 34
الشكل 35
تخطيط متعدد الأعمدة
لا تعني الأعمدة المتعددة (أكثر من 3 أعمدة) بالضرورة تصميمًا معقدًا. على الجانب الآخر، إذا تم تصميم الأعمدة المتعددة بشكل صحيح، فيمكن أن تكون مفيدة جدًا للزائرين لأنها توفر نظرة عامة أفضل على خيارات التنقل المرئية، مما يسمح للمستخدمين بالعثور بسرعة على المعلومات التي يبحثون عنها.
على مدى السنوات القليلة الماضية، شهدنا انفجارًا في محتوى موقع الويب، مما أدى إلى تقليل اهتمام المستخدمين والوقت الذي يستثمرونه في موقع الويب (راجع ReadWriteWeb للحصول على التفاصيل). لذا، فلا عجب أن المصممين يحاولون إيجاد طرق أكثر إيجازًا لتقديم المعلومات، حتى يتمكن الزوار من البقاء على الموقع لأطول فترة ممكنة والعثور على المحتوى بسهولة أكبر.
الشكل 36
إحدى الطرق لتحقيق ذلك هي استخدام تخطيط يحتوي على عدة أعمدة متجاورة. هذه الفكرة منطقية تمامًا. زادت دقة الشاشة في السنوات الأخيرة (ومع ذلك، قد يتغير هذا إذا أصبحت أجهزة الكمبيوتر المحمولة مثل Asus Eee PC متاحة على نطاق واسع)، مما يمنح المستخدمين مساحة أفقية أكبر ويمنح المصممين مساحة إضافية لملء المحتوى.
تظهر النتائج أن المزيد والمزيد من المصممين يستخدمون المزيد والمزيد من الأعمدة في تصميماتهم. لقد وجد بحثنا اتجاهًا قويًا نحو ما يسمى بالتخطيطات متعددة الأعمدة، والتي عادةً ما تكون بعرض ثابت يبلغ 850 بكسل على شاشة بحجم 1000 بكسل. غالبًا ما تُستخدم الأعمدة المتعددة في تخطيطات المجلات والمشاريع الكبيرة. في هذه التخطيطات، غالبًا ما تُستخدم الشبكات لضمان التوازن الهيكلي والتسلسل الهرمي والنظام.
عند استخدام تخطيط متعدد الأعمدة، لا يمكن المبالغة في أهمية المسافة البيضاء النشطة وبين الأعمدة الفردية. (يتم ترك مساحة بيضاء نشطة فارغة عمدًا لتمثيل بنية الصفحة بشكل أفضل والتأكيد على مناطق مختلفة من المحتوى.)
ولتحقيق هذه الغاية، غالبًا ما يستخدم المصممون "شعار شنايدرمان" ("أظهر الصورة الكبيرة أولاً، اعرض التفاصيل لاحقًا") ، من خلال منح المستخدم أولاً نظرة عامة على الوظائف ثم تقديم التفاصيل عند الطلب - لاحقًا، عند النقر فوق الرابط (تعتبر Mozilla Labs مثالًا رئيسيًا).
الشكل 37
الشكل 38
الشكل 39
الشكل 29
الشكل 30
الشكل 31