- التعرف على ممارسات واجهة المستخدم القياسية
- إنشاء نموذج أولي ورقي لتطبيقك
- احصل على تعليقات المستخدمين باستخدام نموذجك الأولي
هذه هي أنشطة هذا الدرس:
البروتوتيب
الآن بعد أن أصبحت لديك فكرة عن الحد الأدنى من المنتج القابل للتطبيق،حان الوقت للتفكير في الشكل الذي سيبدو عليه مشروعك ورسم بعض الأفكار.
A نموذج أولي هو نموذج مبكر لشيء ما.
يقوم مطورو التطبيقات بشكل عام بعمل نموذج أولي ورقي لتطبيقهم قبل البدء في البرمجة.
النموذج الأولي الورقي هو تمثيل مرسوم باليد لما ستبدو عليه واجهة المستخدم في تطبيقك. عادةً ما يتضمن رسومات لكل شاشة في تطبيقك، تصور حالات مختلفة.
لماذا PROTOTYPE؟
- يمكنك توصيل أفكارك بسرعة بصرياً.
- إنها تعاونية!
- عندما تعمل على الورق، يكون العمل على الورق أكثر عفوية وتنبثق المحادثات من التجربة.
- إنه غير مكلف!
- ليس عليك إنفاق الكثير من الوقت والمال
- لا تحتاج إلى الوصول إلى الكمبيوتر أو الإنترنت.
- ليس من الضروري أن تكون خبيراً تقنياً في هذا الجزء من العملية.
- يمكنك أن ترى كيف يتفاعل المستخدمون مع نموذجك الأولي لتتعرف بسرعة على ما قد ينجح أو لا ينجح في تصميمك.
- يمكن تأكيد قرارات التصميم قبل قضاء الوقت في تطوير تطبيقك وترميزه.
تعرّف على كيفية قيام فرق "تكنوفيشن جيرلز" الأخرى بتصميم نماذج أولية ورقية ورقياً ورقمياً في هذا الفيديو!
نصيحة الموجه
أفضل الممارسات أفضل الممارسات: عند تعريف الطلاب بالنماذج الأولية الورقية والورق المقوى، أكد على أهمية البدء بنماذج بسيطة ومنخفضة التكلفة لاختبار الأفكار. على سبيل المثال، "النماذج الأولية الورقية والكرتون هي بمثابة مسودات أولية لتصميمك. فهي تساعدك على رؤية كيف تبدو فكرتك وكيف تعمل قبل أن تقوم بعمل نسخة نهائية. تتيح لك هذه النماذج البسيطة إجراء تغييرات سريعة ومعرفة ما هو الأفضل."
يمكن استخدام النموذج الأولي الورقي للحصول على تغذية راجعة من المستخدمين المحتملين (أي أفراد الأسرة والموجهين الآخرين والأصدقاء وأفراد المجتمع وغيرهم). يمكن أن تكون هذه الملاحظات جزءًا من الملاحظات المضمنة في مواد التقديم النهائية.
ستعرض مقاطع الفيديو التالية مثالاً على مشروع النماذج الأولية مع الأجهزة المصاحبة (على اليسار) وعملية الاختبار باستخدام نموذج أولي ورقي (على اليمين).
أسئلة إرشادية لطرحها على الطلاب:
لماذا يكون من المفيد إنشاء نموذج أولي بسيط باستخدام الورق أو الورق المقوى قبل صنع المنتج النهائي؟
كيف يمكن أن يساعدك صنع نموذج ورقي أو كرتوني في تحسين تصميمك؟
ما هي بعض الأشياء التي قد تتعلمها من اختبار نموذج أولي ورقي لم تكن لتعرفها بطريقة أخرى؟
يتم توفير نصائح الموجهين من خلال الدعم المقدم من AmeriCorps.
عناصر النموذج الأولي
احتفظ هذه الأمور في الاعتبار عند بدء النموذج الأولي الورقي الخاص بك. مرر فوق كل بطاقة لمعرفة المزيد.
المستخدمون
المستخدمون
أنواع الأجهزة
أنواع الأجهزة
الهاتف مقابل الجهاز اللوحي؟
إمكانية الوصول
إمكانية الوصول
الاتساق
الاتساق
واجهة المستخدم
يتعلق إعداد النموذج الأولي الخاص بك بكيفية تفاعل المستخدم مع تطبيقك. المصطلح الذي يطلق على ذلك هو واجهة المستخدم أو واجهة المستخدم. وهي تشمل جميع العناصر مثل الأزرار ومربعات النص وأشرطة التمرير التي تسمح للمستخدم باستخدام تطبيقك.
مصطلح آخر لتصميم المنتجات الرقمية هو تجربة المستخدمأو تجربة المستخدم. وفيما يلي شرح لكل منهما.
واجهة المستخدم
كيف يتفاعل المستخدمون مع تطبيقك. وهو يتضمن جميع العناصر مثل الأزرار ومربعات النصوص والمنزلقات التي تسمح للمستخدم باستخدام تطبيقك.
يركز تصميم واجهة المستخدم على جعل تطبيقك جذابًا بصريًا وبديهيًا وسهل الاستخدام.
تجربة المستخدم
كيف يختبر المستخدمون تطبيقك. وهي تشمل واجهة المستخدم، ولكنها تتعلق أكثر بمشاعر المستخدمين ومواقفهم وسلوكهم.
يتمحور تصميم تجربة المستخدم حول احتياجات المستخدم وأهدافه وتعزيز تجربته بشكل عام.
ميزات واجهة المستخدم
فيما يلي بعض الأجزاء الرئيسية لواجهة المستخدم لتطبيق الهاتف المحمول
الملاحة
التنقل هو كيفية عثور المستخدمين على ما يبحثون عنه في التطبيق. فيما يلي بعض الأمثلة على خيارات التنقل.
الحاوية
تسمح لك هذه المكونات بتجميع المحتوى معًا. تساعدك عند تخطيط أجزاء من الشاشة، وإخفاء الأجزاء وإظهارها.
المدخلات
تسمح مكونات الإدخال للمستخدم بإدخال المعلومات في التطبيق. فيما يلي بعض الأمثلة.
المعلومات
تسمح هذه المكونات للتطبيق بمشاركة المعلومات مع المستخدمين.
استخدام العناصر القياسية
قد ترغب في أن يبدو تطبيقك مختلفًا لتتميز عن منافسيك. ومع ذلك، فإن استخدام العناصر القياسية يمكن أن يساعد المستخدمين في الواقع على فهم كيفية استخدام تطبيقك بسرعة أكبر.
على سبيل المثال، معظم المستخدمين على دراية بالقائمة المنسدلة. يمكنك تصميم نوع جديد من القوائم، لكنه قد يكون مربكًا للمستخدمين. التزم بالمكونات المألوفة لتسهيل الأمر على المستخدمين.
شاهد هذا الفيديو القصير مع ميليسا باول ومريم شيخ من جوجل حول الرسم والنماذج الأولية الورقية
النشاط 1: النموذج الأولي الورقي
ارسم شاشات تطبيقك
- كيف سينتقل المستخدمون من شاشة إلى أخرى؟
- كيف سيتم إدخال المعلومات اللازمة للتطبيق؟
- كيف سيتم عرض المعلومات؟
- كيف سيتم تصميمه بطريقة جمالية مبهجة؟
- فكر في نظام الألوان، والخط، والشعار
احصل على تعليقاتك
والآن بعد أن أصبح لديك شيء مادي يمثل الحل الخاص بك، فقد حان الوقت للحصول على بعض ملاحظات المستخدمين!
يحتاج المستخدمون المحتملون إلى تجربته وإعطائك بعض الملاحظات الصادقة.
ما الذي تريد أن تتعلمه من الاختبار مع المستخدمين؟
طريقة واحدة:
- امنح المستخدمين مجموعة من المهام للقيام بها من خلال تطبيقك ومعرفة ما إذا كان بإمكانهم القيام بها دون تدخلك.
- يمكن أن يقوم أحد أعضاء الفريق بدور "الكمبيوتر"
- تغيير الشاشات أو أجزاء من الشاشات بناءً على تفاعلات المستخدم
- عضو آخر في الفريق هو مدون الملاحظات
- تدوين ما يفعله المستخدم وتعليقاته وردود أفعاله.
- بعد الحصول على إذن، يمكنك أيضاً تسجيل جلسة الاختبار.
تذكر أن المختبرين موجودون لمساعدتك! لا تحكم عليهم أو تتدخل في تفاعلاتهم (بخلاف "الكمبيوتر" الذي يستجيب/يحدث النموذج الأولي بناءً على الإجراءات).
فقط استقبل ملاحظاتهم بتقدير وتقدير.
إليك مثال رائع لاختبار المستخدم لتطبيق متجر لإصلاح الدراجات.
النشاط 2: الحصول على الملاحظات
اختبر نموذجك الأولي الورقي مع 2-3 مستخدمين
- اعرض النموذج الأولي على المستخدمين.
- اطلب من المستخدمين أداء مهمة مع النموذج الأولي.
- دعهم يحاولون القيام بالمهمة دون مساعدة.
- يمكن أن يقوم أحد أعضاء الفريق بدور "الكمبيوتر" ويتفاعل مع تصرفاتهم.
- يقوم عضو آخر في الفريق (أو اثنان) بتدوين ملاحظات حول ما يفعله المستخدمون وتعليقاتهم وردود أفعالهم.
الانعكاس
نوصيك بحفظ نموذجك الأولي الورقي. ستحتاج إلى الرجوع إليه أثناء عملك على بناء مشروعك. يجب عليك أيضًا التقاط صور لنموذجك الأولي.
مراجعة المصطلحات الرئيسية
- نموذج أولي - نموذج أولي لمنتج ما
- نموذج أولي ورقي - تمثيل مرسوم باليد للشكل الذي سيبدو عليه تطبيقك
- واجهة المستخدم (UI) - كيفية تفاعل المستخدم فعلياً مع تطبيق الهاتف المحمول
- تجربة المستخدم (UX) - كيف يشعر المستخدم تجاه تطبيق الهاتف المحمول، قبل وأثناء وبعد استخدامه
الموارد الإضافية
في حين أن الورق هو الطريقة المفضلة لوضع النماذج الأولية، خاصةً كخطوة أولى، يمكنك أيضًا استخدام الأدوات الرقمية لوضع نموذج أولي لتطبيقك.
توجد العديد من الأدوات بسعر، ولكن عادةً ما تكون هناك نسخة مجانية يمكنك استخدامها بميزات أو مشاريع محدودة. إليك بعض الاحتمالات.
- شرائح جوجل (سهلة ومجانية!)
- تطبيق إنفيجن آب
- فيجما
- الملوثات العضوية الثابتة من مارفل
