You are on page 1of 26

Everyone Can Code

App Design Journal


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

‫التقييم‬ ‫النموذج األولي‬ ‫التخطيط‬ ‫طرح األفكار‬

‫عرض تقديمي للتطبيق‬ ‫شاشات الرسم التخطيطي‬ ‫إجراءات املستخدم‬ ‫الغرض‬


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

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

‫‪3‬‬
‫حدد الفرصة أو املشكلة أو التحدي‬
‫فكر في األشياء التي تختبرها أنت أو اآلخرون والتي قد ترغب في تحسينها أو تخصيصها أو مجرد االستمتاع بها‪ .‬اضغط‬
‫مزدوجا فوق املربعات إلضافة نص‪.‬‬ ‫نقرا‬
‫طرح األفكار‬
‫ً‬ ‫أو انقر ً‬
‫‪ .1‬اطرح قائمة بالفرص أو املشكالت أو التحديات التي تهتم بها‪.‬‬
‫الغرض‬
‫التصحر ‪ ،‬الحاجة للتوسع في التشجير‪ ،‬زحف الرمال‬
‫األفكار‬
‫التركيز‬

‫‪ .2‬اختر الفكرة األكثر إثارة لالهتمام من قائمتك وحاول شرحها في جملة واحدة فقط‪.‬‬

‫الحاجة للتوسع في الزراعة و النخل من االشجار التي تتحمل بيئتنا الصحراوية‬

‫‪ .3‬ماذا تعرف عن الفرصة أو املشكلة أو التحدي؟ ما الذي تود معرفة املزيد عنه؟‬

‫زراعة النخل يعد حل ملواجهة التصحر‬

‫‪ .4‬من يهتم أو يتأثر بهذه الفرصة أو املشكلة أو التحدي؟‬

‫املجتمع‬

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

‫التعمق أكثر‬
‫استخدم القلم والورقة أو أضف شرائح فارغة لرسم‬
‫خريطة ذهنية للمشكالت والحلول املمكنة‪.‬‬

‫‪5‬‬
‫فكرة التطبيق الخاص بي‬
‫من قائمة طرح األفكار الخاصة بك‪ ،‬حدد فكرة واحدة للتطبيق وحاول كتابة بيان الغرض لتطبيقك باستخدام النموذج أدناه‪.‬‬
‫طرح األفكار‬
‫سيقدم التطبيق الخاص بي املساعدة ]للجمهور[ عن طريق ]الفرصة‪ ،‬املشكلة‪ ،‬التحدي[ من خالل ]ما يقوم به التطبيق[‪.‬‬
‫الغرض‬
‫سيقدم التطبيق فرصة الفراد املجتمع عن طريق مبادرات في زراعة النخيل‬ ‫األفكار‬
‫التركيز‬

‫وبني ما سيفعله شخص ما به‪.‬‬


‫كن أكثر تحدي ًدا حول فكرة تطبيقك‪ .‬اكتب أي أهداف لتطبيقك ّ‬

‫زراعة النخل حيث يقوم الفرد بزراعة نخلة وتوثيق ذلك والحصول على نقاط على كل مره يزرع فيها‬

‫التعمق أكثر‬
‫ابحث في ‪ App Store‬عن تطبيقات مشابهة‪.‬‬
‫انظر إلى مراجعات املستخدمني للحصول على‬
‫أفكار حول كيفية عمل تصميم أفضل أو الكتشاف‬
‫امليزات التي سيكون من الرائع توفرها‪.‬‬

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

‫‪7‬‬
‫مثال في الشريحة التالية‬

‫إجراءات املستخدم في تطبيقي‬


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

‫تظهر بيانات حسابه‬ ‫استعراض نقاطه‬

‫تصوير بالكامير وتوثيق التاريخ‬ ‫توثيق زراعته‬

‫‪8‬‬
‫مثال في الشريحة التالية‬

‫إدخال املستخدم والتغييرات في حالة تطبيقي‬


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

‫التقاط الصورة وحفظها‬ ‫يوجه الكاميرا نحو النخلة التي زرعها‬

‫يحفظ التاريخ‬ ‫يدخل تاريخ اليوم‬

‫تضاف النقاط الى حسابه‬ ‫يضغط ارسال‬

‫يعود لصفحة حسابه‬ ‫يضغط عودة‬

‫‪9‬‬
‫مثال في الشريحة التالية‬

‫ميزات تطبيقي‬
‫تتوفر العديد من ميزات ‪ iOS‬ملساعدتك في تصميم تطبيقات رائعة‪ .‬ابحث في القائمة الجزئية أدناه وأضف عالمات اختيار لتلك‬
‫التخطيط‬
‫التي قد تحتاجها لتطبيقك‪ .‬هل هناك أي أشخاص آخرين غير مدرجني قد تحتاجهم؟‬

‫اسحب عالمة اختيار بجوار امليزات التي تريد التفكير في استخدامها في تطبيقك‪.‬‬
‫إجراءات املستخدم‬
‫تقنية ‪Bluetooth‬‬
‫لوحة املفاتيح‬ ‫اإلدخال وحالة التطبيق‬
‫يتصل السلكيًا باألجهزة األخرى‬
‫تسمح بكتابة اإلدخال‬
‫اختيار امليزات‬
‫الخريطة‬
‫الشمولية‬
‫الكاميرا‬
‫تعرض الخرائط التفاعلية‬ ‫التقاط الصور ومعالجتها‬

‫الواقع املعزز‬ ‫امليكروفون‬


‫يضع كائنات افتراضية يمكن للمستخدمني‬ ‫التقاط الصوت وتسجيله‬
‫التفاعل معها في عاملهم‬

‫مكبرات الصوت‬
‫يعيد تشغيل الصوت‬ ‫الشاشة التي تعمل باللمس‬
‫تسمح للمستخدمني بالتفاعل من خالل‬
‫النقر والتمرير والسحب‬
‫ردود الفعل اللمسية‬
‫تقدم استجابة من خالل اهتزاز الجهاز‬
‫)‪ iPhone‬فقط(‬ ‫الجيروسكوب‬
‫يقيس كيفية تدوير الجهاز‬

‫التعلم اآللي‬
‫التعمق أكثر‬
‫يحلل املعلومات ويصنفها الستخدامها الح ًقا‬
‫مقياس تسارع‬ ‫تقييم "تفاعل املستخدم" و"إمكانيات النظام" في‬
‫يقيس مدى سرعة تحرك الجهاز‬ ‫التشغيل‬
‫غير ذلك‬ ‫املزيد‬ ‫لنظام ملعرفة‬ ‫البشريةالبشرية‬
‫لنظام ‪iOS‬‬ ‫الواجهةالواجهة‬
‫إرشادات‬
‫إرشادات‬
‫‪iOS‬‬ ‫حول ميزات ‪ iOS‬املختلفة‪.‬‬
‫‪GPS‬‬
‫يحدد موقع خط الطول وخط العرض‬
‫التقويم‬
‫للجهاز‬

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

‫حاول التفكير في تطبيقك من خالل وجهات نظر مختلفة‪ .‬كيف سيقدم تطبيقك الدعم ملجموعة واسعة من املستخدمني؟‬ ‫إجراءات املستخدم‬
‫اإلدخال وحالة التطبيق‬
‫سيوفر التطبيق مجال للمساهمة في زراعة النخيل و التطوع في ذلك مما سيجعل الكثير من افراد املجتمع استخدامه‬ ‫اختيار امليزات‬
‫الشمولية‬

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

‫اسحب عالمة اختيار بجوار العناصر التي تحتاج إلى وضعها في االعتبار بالنسبة لتطبيقك‪.‬‬

‫الدعم املعرفي‬
‫استخدم الحركة والخطوط واللون والصوت بعناية لتجنب الحمل الزائد الحسي‬
‫ومساعدة األشخاص ‪ -‬بما في ذلك أولئك الذين يعانون من تحديات التعلم ‪ -‬للتركيز على ما هو مهم‪.‬‬

‫أوصاف تسهيالت االستخدام‬


‫قم بتضمني نص بديل للعناصر املرئية وأزرار امللصق الدقيقة لتوفير سياق لألشخاص املكفوفني أو ضعاف‬
‫البصر أو الذين يستخدمون قارئ الشاشة‪.‬‬

‫املحتوى الذي يمكن الوصول إليه‬


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

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

‫‪12‬‬
‫مثال في الشريحة التالية‬

‫شاشات تطبيقي‬
‫اختر نشاط مستخدم واح ًدا لعمل نموذج أولي من القائمة التي قمت بإنشائها في شريحة إجراءات املستخدم‪.‬‬
‫إجراءات املستخدم‬ ‫النموذج األولي‬
‫صف نشاط املستخدم بمزيد من العمق‪.‬‬

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

‫‪13‬‬
‫مثال في الشريحة التالية‬

‫لوحة العمل لتطبيقي‬


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

‫التقاط صورة‬ ‫شاشات الرسم التخطيطي‬


‫اختيار التاريخ‬ ‫لوحة العمل‬
‫تحسني أداء التطبيق‬
‫نمط التصميم‬
‫اإلنشاء‬
‫أيقونة التطبيق واسمه‬

‫الخروج من التطبيق‬

‫‪14‬‬
‫مثال على الشريحة التالية‬

‫استجابة تطبيقي للمستخدم‬


‫هناك فئتان رئيسيتان لكيفية تغيير حالة التطبيق بإدخال املستخدم‪:‬‬
‫النموذج األولي‬
‫خارج الشاشة‪:‬‬ ‫على الشاشة‪:‬‬

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

‫الخروج من التطبيق‬
‫على الشاشة‬
‫االنتقال‬

‫خارج الشاشة‬
‫‪15‬‬ ‫زيادة النقاط‬
‫مثال في الشريحة التالية‬

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

‫اختر نظام األلوان‪.‬‬ ‫شاشات الرسم التخطيطي‬


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

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

‫ما هي الخطوط التي سيستخدمها تطبيقك؟‬

‫تايم نيو رومان‬


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

‫‪16‬‬
‫مثال على الشريحة التالية‬

‫نموذج تطبيقي األولي في ‪Keynote‬‬


‫‪iPhone‬استخدم األفكار من الرسومات التخطيطية وعناصر‬
‫‪.iPhoneiPad‬‬
‫أنشئ مشروعًا جديدًا‪ .‬قم بتنزيل النموذج إما لـ ‪ iPad‬أو‬
‫التصميم إلنشاء شاشات في نموذج ‪ Keynote‬األولي الخاص بك‪ .‬إنشاء كل شاشة على شريحة مختلفة‪.‬‬
‫النموذج األولي‬
‫إنشاء روابط تفاعلية ملحاكاة أداء التطبيق‪ .‬استخدم مالحظاتك من شريحة تحسني أداء التطبيق إلضافة روابط بني‬
‫تحسني أداء التطبيق‬
‫الشرائح بحيث يمكنك التنقل بني الشاشات وتشغيل االستجابات كما تفعل مع الكود‪ .‬للقيام بذلك‪ ،‬حدد الكائن أو النص الذي‬
‫شاشات الرسم التخطيطي‬
‫تريد ربطه وحدد خيار إلضافة ارتباط ثم اختر الشريحة املناسبة‪ .‬للتأكد من أن الشرائح تتغير فقط عندما ينقر املستخدم على‬ ‫لوحة العمل‬
‫األزرار‪ ،‬تأكد من تعيني نوع العرض التقديمي على الروابط فقط في الشريط الجانبي للمستند‪.‬‬ ‫تحسني أداء التطبيق‬
‫كرر على النموذج األولي الخاص بك‪ .‬أل ِق نظرة على هذا الفيديو على نماذج أولية مدتها ‪ 60‬ثانية الكتشاف كيفية‬ ‫نمط التصميم‬
‫مقطع فيديو‬ ‫استخدام ‪ Keynote‬الختبار األفكار بسرعة‪.‬‬ ‫اإلنشاء‬
‫أيقونة التطبيق واسمه‬

‫جهاز‬ ‫التعمق أكثر‬


‫املطور‬
‫للحصول على‬ ‫قم بتنزيل قوالب قوالب‬
‫جهاز مطور ‪iOS‬‬
‫عناصر مصممة مسب ًقا قد تكون على دراية بها‪،‬‬
‫مثل لوحة املفاتيح أو قائمة الرموز التعبيرية‪.‬‬
‫اكتشف كيفية تحسني تجربة املستخدم لتطبيقك‬
‫من خالل مشاهدة هذا الفيديو من ‪ WWDC‬حول‬
‫مقطع فيديو‬
‫مبادئ التصميم األساسية‪.‬‬

‫‪17‬‬
‫مثال‬

‫مثال على نموذج أولي للتطبيق في ‪Keynote‬‬

‫مثال على صوت الحشرة‬


‫ألق نظرة على هذا النموذج األولي ليكون مصدر‬
‫أفكار لك‪ .‬تذكر أن هذا نموذج أولي لتطبيق مكتمل‪.‬‬
‫أنت تعمل على جزء واحد فقط في كل مرة‪ ،‬ولكن من‬
‫خالل العديد من التكرارات يمكنك الوصول إلى‬
‫تطبيق يعمل بكامل طاقته ً‬
‫أيضا‪.‬‬

‫التعمق أكثر‬
‫تحقق من النموذج األولي لـ ‪ iPhone‬الذي‬
‫انقر أو اضغط لتشغيل الفيديو التوضيحي أو تنزيل ملف نموذج ‪ Keynote‬األولي‬ ‫األولي ‪ iPhone‬نموذج‬
‫يهدف إلى مساعدة املستخدمني على إعادة‬
‫الستكشاف نموذج صوت الحشرة األولي بنفسك‪.‬‬
‫تدوير املزيد‪.‬‬
‫‪18‬‬
‫أيقونة التطبيق الخاص بي واسمه‬
‫استخدم القلم والورقة أو تطبيق الرسم لرسم بعض الرموز لتطبيقك‪ .‬أضفها هنا وضع خيارك األول أوالً‪.‬‬
‫النموذج األولي‬

‫شاشات الرسم التخطيطي‬


‫لوحة العمل‬
‫تحسني أداء التطبيق‬
‫نمط التصميم‬
‫اإلنشاء‬
‫أيقونة التطبيق واسمه‬

‫ابتكر بعض األسماء املختلفة لتطبيقك‪ .‬ضع خيارك األفضل أوالً‪.‬‬

‫النخل‬ ‫التشجير‬ ‫زراعة النخل‬

‫‪19‬‬
‫نظرة عامة‬
‫حسنًا‪ ،‬لديك نموذج أولي عملي! حان الوقت اآلن لتلقي على بعض التعليقات‪ .‬على الرغم من‬ ‫تقييم‬
‫كثيرا‪ .‬اطلب من زمالئك في الفصل وعائلتك‬
‫ً‬ ‫أن لديك تطبي ًقا جزئ ًيا فقط‪ ،‬فمن الجيد اختباره‬
‫واآلخرين تجربة التطبيق‪ .‬حاول العثور على املختبرين الذين يناسبون الجمهور املستهدف‬
‫لتطبيقك واعرض عليهم تطبيقك‪ .‬بعد ذلك يمكنك اإلعداد ملالحظة املستخدمني بينما يجربون‬ ‫عرض تقديمي للتطبيق‬
‫النموذج األولي‪ ،‬ثم تلقي مالحظاتهم‪.‬‬ ‫التجهيز‬
‫املراقبة‬

‫‪20‬‬
‫عرض تقديمي لتطبيقي‬
‫تتمثل إحدى طرق اختبار فكرة تطبيقك في تطوير عرض تقديمي ومشاركته مع اآلخرين‪ .‬قدم‬
‫تقييم‬
‫ً‬
‫عرضا تقديميًا أو مقطع فيديو مدته ثالث دقائق‪ .‬سيقوم العرض التقديمي الجيد بتقديم قصة قوية وواضحة تجعل الناس‬
‫يرغبون في الحصول على تطبيقك‪.‬‬
‫عرض تقديمي للتطبيق‬
‫يجب أن يتضمن عرضك التقديمي ما يلي‪:‬‬
‫التجهيز‬
‫• ملاذا‪ :‬هي املشكلة التي يحاول تطبيقك حلها‬
‫املراقبة‬
‫• مَن‪ :‬وصف للفئة املوجه إليها تطبيقك‬

‫• ماذا‪ :‬نظرة عامة على التطبيق أو عرض توضيحي للنموذج األولي‬

‫• كيف‪ :‬تفاصيل حول تجربة املستخدم وواجهة املستخدم‪ ،‬بما في ذلك التصميم وامليزات والتحسينات التي أجريتها‬

‫ما هي التعليقات التي تلقيتها حول فكرة تطبيقك؟‬

‫تطبيق جيد‬

‫يحتاج الضافة الخرائط‬

‫‪21‬‬
‫قم بإعداد اختبار للنموذج األولي الخاص بك‬
‫هناك طريقة أخرى الختبار النموذج األولي الخاص بك وهي تطوير اختبار للمستخدمني لتجربته‪ .‬قم بإعداد خطة‬
‫تقييم‬
‫للمستخدم الختبار النموذج األولي الخاص بك‪.‬‬
‫ِ‬
‫صف النشاط الذي تريد من املخت ِبر إنجازه باستخدام النموذج األولي الخاص بك‪ .‬فكر فيما ترغب في الحصول على تعليقات‬
‫بشأنه واختباره‪.‬‬ ‫عرض تقديمي للتطبيق‬
‫أود منك تجربة التطبيق الذي عملته ملواجهة التصحر من خالل التوسع في زراعة النخل‬
‫التجهيز‬
‫املراقبة‬

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

‫قم بتجربة تطبيق زراعة النخل و سجل مالحظاتك لتطويره‬

‫كيف ستقوم بجمع أشخاص بحيث يمكنك اختبار التطبيق من خالل مجموعة متنوعة؟‬ ‫كم عدد األشخاص الذين‬
‫ستقوم باختبار التطبيق‬
‫من خاللهم؟‬

‫من طالب مدرستي‬ ‫‪٣‬‬

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

‫عرض تقديمي للتطبيق‬


‫هل عرف املستخدم كيفية استخدام الواجهة؟‬
‫التجهيز‬
‫نعم‬ ‫املراقبة‬

‫هل كان املستخدم مرتب ًكا من قبل؟ في أي نقطة؟‬

‫ال‬

‫هل استمتع املستخدم بالتطبيق؟‬

‫نعم‬

‫هل ابتسم املستخدم أو ضحك في نقاط معينة؟‬

‫ال االحظ ذلك‬

‫هل الحظت أي شيء آخر؟‬

‫ال‬

‫‪23‬‬
‫كرر باستخدام التعليقات‬
‫حان الوقت اآلن للتفكير في تطبيقك‪ .‬اسأل نفسك ما املثير في فكرة تطبيقك‪ .‬إذا لم يخطر ببالك شيء‪ ،‬فحاول العودة إلى‬
‫طرح األفكار‬
‫قائمتك في شريحة األفكار‪ .‬ليست كلاألفكار‬
‫األفكار مناسبة‪.‬‬

‫ارى ان الفكرة كانت مناسبة‬ ‫التخطيط‬

‫إذا قررت االستمرار في فكرة التطبيق األصلية‪ ،‬ففكر فيما تعلمته من تقييمك‪ .‬ما الذي فعله تطبيقك بشكل جيد؟ ما الذي‬
‫النموذج األولي‬
‫يمكنك تحسينه؟‬

‫تقييم‬
‫اقترح البعض اضافة الخرائط‬

‫فكر فيما ستفعله بعد ذلك‪ .‬هل تريد تكرار امليزة التي صممتها وتحسينها؟ هل أنت مستعد لتصميم امليزة التالية لتطبيقك؟ أو‬
‫هل تريد أن تفعل كالهما؟‬

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

‫‪24‬‬
‫استمر في التعلم واملشاركة‬
‫ارت ِق بفكرة تطبيقك إلى املستوى التالي من خالل تعلم البرمجة في ‪ - Swift‬نفس لغة البرمجة التي يستخدمها مطورو البرامج إلنشاء‬
‫تطبيقات حقيقية‪ .‬تُعد ‪ Swift Coding Clubs‬طريقة رائعة لتقديم البرمجة إلى مدرستك أو مؤسستك‪ .‬ويمكن أن يساعدك دليل عرض‬
‫التطبيقات في استضافة عرض شخصي أو عرض افتراضي ملشاركة أفكار تطبيقك مع مجتمعك‪.‬‬

‫دليل عرض التطبيقات‪ .‬شارك بأفكار تطبيقك مع املجتمع األوسع من خالل‬ ‫‪ .Swift Coding Club‬بعض الخيارات الرائعة إلدخال التعليمات‬
‫دعما عمليًا‬
‫األحداث‪ ،‬مثل عروض املشروع أو عروض التطبيقات‪ .‬يوفر الدليل ً‬ ‫البرمجية هي من خالل نوادي ما بعد املدرسة أو املعسكرات الصيفية أو‬
‫ملساعدتك في التخطيط للعرض واستضافته‪.‬‬ ‫غيرها من إعدادات التعلم غير الرسمية‪ .‬يجعل التصميم املعياري لهذا املورد‬
‫> قم بتنزيل دليل عرض التطبيقات‬
‫مثاليًا لكل من املبرمجني ألول مرة والذين لديهم خبرة أكبر‪ .‬قم بتنزيل مجموعة‬
‫‪ Swift Coding Club‬قم بتنزيل مجموعة‬
‫‪< Swift Coding Club‬‬
‫‪ Swift Coding‬قم بتنزيل مجموعة>‬
‫> ‪Club‬‬
‫حقوق الطبع والنشر © لعام ‪ 2021‬محفوظة لشركة ‪ ..Apple Inc‬جميع الحقوق محفوظة‪ Apple .‬وشعار ‪ Apple‬و‪ iPad‬و‪ iPhone‬و‪ GarageBand‬و‪ Keynote‬و‪ Mac‬و‪ Swift‬و‪ Swift Playgrounds‬هي عالمات تجارية مملوكة‬
‫ومسجلة في الواليات املتحدة وبلدان أخرى‪ .‬تُعد عالمة ‪ ®Bluetooth‬وشعاراتها‬
‫ّ‬ ‫لـ ‪ ،.Apple Inc‬مسجلة في الواليات املتحدة والدول األخرى‪ App Store .‬و‪ Everyone Can Code‬هما عالمتان مملوكة لشركة ‪.Apple Inc‬‬
‫عالمات تجارية مسجلة مملوكة لشركة ‪ .Bluetooth SIG, Inc‬وأي استخدام لهذه العالمات من ِقبل ‪ Apple‬يخضع لترخيص‪ iOS .‬هي عالمة تجارية أو عالمة تجارية مسجلة لشركة ‪ Cisco‬في الواليات املتحدة والدول األخرى ويتم استخدامها بموجب‬
‫ترخيص‪ .‬وقد تكون أسماء الشركات واملنتجات األخرى الواردة هنا عالمات تجارية مملوكة لشركاتها املعنية‪ .‬سبتمبر ‪2021‬‬

You might also like