مدرسة التصميم (الدرس الثاني) - مشروع إثراء

الدرس الثاني: التخطيط لتصميم المشروع

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

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

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

العمل مع المحتوى

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

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

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

فرز المحتوى

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

سارة بييرمينتر (مصممة ومطورة ويب) تطرقت إلى ذلك بصورة وجيزة في (Responsive Day Out) في برايتون في مارس 2013، حيث تحدثت عن تحليل المحتوى على ضوء نظام إشارات المرور (Traffic light system).

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

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

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

التسلسل الهرمي للمحتوى

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

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

خريطة الموقع

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

Untitled-1

 

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

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

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

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

واجبات

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

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

عن الكاتب

أحمد أبوالشرود

عضو هيئة تدريس بجامعة مصراتة كلية تقنية المعلومات

تعليقان


  • غير معروف

    أتمنى أن تترجم المخططات بمى أن الموقع مبني على اللغة العربية


    • أحمد أبوالشرود
      أحمد أبوالشرود

      ستتم ترجمة المخططات في أقرب فرصة إن شاء الله ،، شكرا على اهتمامك



اضف تعليق

لن يتم نشر عنوان بريدك الإلكتروني.


يمكنك استخدام HTML وسوم واكواد : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

0

Your Cart