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

اقرأ الجزء الأول من المقال.

اقرأ الجزء الثاني من المقال.

اقرأ الجزء الثالث من المقال.

اقرأ الجزء الرابع من المقال.

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

النموذج الأولي والتخطيط: ما هو الإطار السلكي و نموذج بالحجم الطبيعي

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

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

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

ما تحتاج لمعرفته حول الشبكة المعيارية 960 و 970

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

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

يتم حل المشكلة عن طريق استخدام شبكة 970gs وحدات. لديها الخصائص التالية:

  • يتم تنظيم المحتوى في 12 عمودًا ، كما في النظام المعياري 960.
  • عرض الأعمدة هو 68 بكسل ، وهو 8 بكسل أكثر من 960gs.
  • المسافة بين الأعمدة 14 بكسل.

يفضل استخدام شبكة 970g المعيارية من حيث قابليتها للاستخدام. يتيح لك دمج صفحة في وحدات 2 أو 3 أو 4 أو 6 وحدات.

الوحدات النمطية بنية الصفحة بنجاح دون إنشاء حواجز مرئية.

تتيح الشبكة المعيارية بعرض 970 بكسل استخدام عناصر التنقل المختلفة. توفر شبكة 970gs ترتيبًا جيدًا لعناصر التنقل المتعلقة بالمحتوى: الصور والنصوص. وهذا يوفر جاذبية بصرية وسهولة الاستخدام.

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

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

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

ستساعدك المعلومات التالية في العمل مع نماذج تفصيلية وإنشاء مواقع قابلة للاستخدام:

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

ستساعد شخصيات المستخدم في ضمان سهولة استخدام الموقع

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

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

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

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

ما ينبغي أن يكون لوحة المفاتيح الافتراضية لنماذج وتطبيقات موقع الجوال

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

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

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

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

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

استخدم skeuomorphism فقط لزيادة الوظائف.

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

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

كيفية جعل تحميل الانتظار أقل إيلاما

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

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

سهولة استخدام الموقع تبدأ ...

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

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

شاهد الفيديو: سبليمنال تقصير الطول . التقليل من حجم القامه للطول المناسب (شهر اكتوبر 2019).

ترك تعليقك