مساهمة المصمم في تطوير تطبيقات الأجهزة المحمولة

المصمم ودوره في تطوير تطبيقات المحمول

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

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

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

كيف يمكن أن يجعل المصمم الحياة أسهل للمطور؟

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

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

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

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

المصمم هو جزء من الفريق

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

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

يجب أن لا يفهم المطور البرامج التي تم رسم المشروع بها. يجب أن تفتح الملفات بسهولة

كما ذكر أعلاه ، يتعين على المطور الآن دراسة الكثير بحيث لا يوجد وقت لفهم برامج تحرير الرسوم. لذلك ، يجب ألا يقوم المصمم برسم عناصر في Photoshop / Illustrator والتبرع بالتخطيط في ملفات * .psd / * .ai. تزن هذه الملفات كثيرًا وتتطلب تثبيت حزمة Adobe. حتى لو لم يلعب هذا دورًا خاصًا ، فلا يوجد وقت لدراسة هؤلاء المحررين.

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

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

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

يجب على المصمم معرفة الإرشادات الخاصة بالمنصات المختلفة واختلافاتها

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



لذلك ، من المهم جدًا أن يفهم المصمم ماذا وكيف يرسم.

موارد

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

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

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

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

المعارف التقليدية مع وصف الشاشات

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

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

ماذا لو لم يكن هناك شيء مما سبق ، ولكن بحاجة إلى العمل؟

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

ارتبط المشروع بتأجير العقارات وتم تطويره لمنصتين أساسيتين: IOS و Android. بدأت عملية التطوير مثل أي شيء آخر. في وقت لاحق اتضح أن المصمم لم يكن على دراية تامة بالتطبيقات المحمولة. ما يوجه انه لا يعرف. حضر التصميم عناصر شفافة ، تم استخدام الخطوط لمنصة واحدة فقط. يمكن وصف التلوين باستخدام "50 ظلال من اللون الرمادي".

لقد أعطيت ملف * .psd. يبدو أنه لا بأس. يتم تسليم هذه الملفات من قبل العديد من المصممين. لكن كان عليّ تثبيت حزمة Adobe لإلقاء نظرة على التصميم. كان الملف "ثقيلًا جدًا" وتم فتحه لمدة 10 دقائق تقريبًا ، ولم يتم رسم جميع الشاشات بشكل منفصل على مساحة العمل. كانت واحدة فوق الأخرى كطبقات ، ولكي ترى شاشة واحدة ، كان عليك إيقاف تشغيل جميع الشاشات الأخرى. نظرًا لعدم وجود خبرة كبيرة مع الحزمة ، فكرت في Avocode كأداة لمعالجة مواد التصميم. بالطبع ، هذا البرنامج ليس مثاليًا ، لكنه أنقذني حرفيًا.

تم نقل النموذج الأولي القابل للنقر إليّ في InVision. لاحظ ، مجرد نموذج أولي قابل للنقر بدون شاشات مباشرة.

الاستنتاجات:

ما كنت أتوقع الحصول عليه من المصمم:

• النموذج الأولي القابل للنقر والشاشات الحية (InVision أو Zeplin أو Figma)
• معالجة المعارف التقليدية مع وصف لتشغيل الشاشات
• شاشات الخريطة مع التحولات
• قصة المستخدم
• الموارد المقطعة بالأحجام @ 1 ، @ 2 ، @ 3
• الخطوط

من كل ما سبق ، تلقيت فقط نموذجًا أوليًا قابل للنقر وملف * psd.

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



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

شكرا لكم جميعا على اهتمامكم والمشاريع الناجحة!

روابط مفيدة:

إرشادات IOS
إرشادات Android
مشاكل تطوير مشروع المحمول القديم
FIGMA
رسم