12 حيلة لم يخبرك بها أحد حول تصميم واجهة مستخدم تطبيقات الجوال والويب - حتى الآن
نشرت: 2016-02-28[ Proto .io هي أداة نماذج أولية لتطبيقات الأجهزة المحمولة يستخدمها رواد الأعمال والشركات الناشئة لإنشاء نماذج أولية واقعية تفاعلية بالكامل تبدو وكأنها تطبيقات حقيقية.]
سألنا سبعة مصممين ومطورين ورجال أعمال لواجهة المستخدم عن حيل تصميم واجهة مستخدم تطبيقات الجوال والويب التي تعلموها بالطريقة الصعبة ، أو التي صادفوا أن يلتقطوها خلال حياتهم المهنية. إما لم يخبرهم أحد عن هذه النصائح ، أو لا يبدو أن أحدًا يعرفها عند طرحها. على أي حال ، هناك 12 شيئًا لا يتعين عليك الآن تعلمها من خلال التجربة والخطأ - ما لم تكن لديك بالفعل!
أفضل 3 حيل تصميمية من دافي
John Geletka هو نائب الرئيس التنفيذي للاستراتيجية الرقمية في Duffy (duffydesignx) ، وهي وكالة لديها أكثر من 30 عامًا من الخبرة في التصميم. إليك بعض الحيل التي ابتكرها على مر السنين.
يمكن أن يكون اثنان عددًا سحريًا.
"من خلال التصميم سريع الاستجابة ، صمم دائمًا شاشتين في آنٍ واحد: صورة متحركة (320 بكسل) وسطح المكتب (1200 بكسل). يقول جيليتكا: إنه يجعل العملية أسرع بكثير.
ابدأ بتصميم العظام.
"قم بتقليل جميع الميزات والأجراس والصفارات في البداية. تخلص من المهملات بعيدًا عن طريقك وركز على هدف التطبيق "، كما يقول Geletka. "هذا يعني عدم إضافة مشاركة وحفظ وكل تكامل لتصميمك في البداية. تأكد من فهم الفكرة الرئيسية ".
لا تخف من التقاط القلم.
يقول Geletka: "الأدوات الرقمية رائعة ، ولكن في بعض الأحيان يمكنك إنجاز المزيد على الورق في 10 دقائق". "إذا كنت عالقًا أو كان لديك وقت قصير ، فاستخدم الورق."
حقق التوازن باستخدام خدعة تصميم واجهة مستخدم تطبيق الويب هذه
براندون تيرميني هو المؤسس والمدير الإبداعي لشركة Handsome (HandsomeMade) ، وهي وكالة ملتزمة بإنشاء تصميمات ومنتجات رقمية لواجهة مستخدم تطبيقات ويب "جميلة ومبهجة بشكل هادف".
استخدم الوزن البصري الصحيح.
"التوازن مهم للغاية عند إنشاء واجهات ناجحة. يتيح التوازن الجيد للمستخدمين فحص تطبيقك بسهولة بالطريقة التي تريدها "، كما يقول تيرميني. "أرى أن هذه القاعدة يتم كسرها في أغلب الأحيان عند استخدام رموز مختلفة في الواجهات. يتم وزن بعض الرموز أفقيًا بينما يكون البعض الآخر رأسيًا بشكل أكبر ، ومن واجبنا التأكد عند وضعهم معًا أنهم يشعرون بالتوازن بشكل متساوٍ ".
الوزن البصري وأزرار التشغيل
"إذا كنت تصمم زر تشغيل ، فلن تكون الإجابة هي لصق مثلث متساوي الجوانب أفقيًا وعموديًا في وسط دائرة. بالتأكيد ، يتم توسيطها هندسيًا ، لكن يبدو أن المثلث يبدو أثقل من الناحية اليسرى بسبب ارتفاعه الأكبر "، كما يقول تيرميني. "لا تقلق - يمكنك القيام بأمرين لإصلاح ذلك: إما تحريك المثلث قليلاً إلى اليسار لخداع العين لرؤيته في المنتصف ، أو تقليل عرض المثلث قليلاً لجعل كل الجوانب تظهر بشكل متساوٍ."
من تصميم واجهة مستخدم تطبيق الويب إلى الهاتف المحمول
تأتي حيلنا الثلاثة التالية لتصميم واجهة مستخدم تطبيقات الجوّال والويب من كريستيان دود ، نائب الرئيس ومدير استراتيجية تجربة المستخدم وناثان كوخ ، مدير التكنولوجيا الإبداعية في Cramer-Krasselt (cramerkrasselt). تعد Cramer-Kasselt ثاني أكبر وكالة إعلانات مستقلة في الولايات المتحدة ، ولديها عملاء مثل Porsche و Corona Extra و Heinz ، لذا فإن Dodd و Koch يستمدون مخزونًا غنيًا من الخبرة ليقدموا إلينا هذه النصيحة:
لا تنس أي تفاعلات تحوم على الويب عند الانتقال إلى الهاتف المحمول ، ولديك خطة واضحة للتعامل معها في وقت مبكر من التصميم.
"يمكن التعامل مع المحتوى الذي يختبئ خلف حالة التمرير على سطح المكتب بعدة طرق على الهاتف المحمول: مباشرة على الصفحة ، والاختباء وراء لمسة. لا يوجد حل واحد للتعامل مع أحداث التمرير على سطح المكتب يعمل في جميع الحالات "، كما يقول دود وكوخ. "غالبًا ما يستفيد المحتوى التوضيحي / المفيد من طرحه للعرض على الصفحة ، وغالبًا ما يكون المحتوى الاستكشافي أكثر منطقية من وراء اللمس. بشكل عام ، نظرًا لأن المستخدمين أصبحوا أكثر راحة في التمرير عبر جميع الأجهزة ، فإن إخفاء المحتوى خلف حالات التمرير وإخفاء / إظهار عناصر واجهة المستخدم أصبح أقل فأقل.
موصى به لك:
ماذا يعني توفير مكافحة الربح بالنسبة للشركات الهندية الناشئة؟
كيف تساعد الشركات الناشئة في تكنولوجيا التعليم في تطوير مهارات القوى العاملة في الهند وتصبح جاهزة للمستقبل ...
الأسهم التقنية في العصر الجديد هذا الأسبوع: مشاكل Zomato مستمرة ، EaseMyTrip تنشر Stro ...
تتخذ الشركات الهندية الناشئة اختصارات في مطاردة للتمويل
منصة التسويق الرقمي Logicserve Bags INR 80 Cr Funding، Rbrands as LS Dig ...
تقرير يحذر من تجديد التدقيق التنظيمي على Lendingtech Space
إن محاولة تشغيل الفيديو تلقائيًا للعمل على الويب على الهاتف المحمول عادة لا يستحق كل هذا العناء.
"لا يسمح مطورو أنظمة تشغيل الأجهزة المحمولة بتشغيل الفيديو تلقائيًا لسبب ما. بشكل عام ، يعد الصوت والفيديو أكثر إزعاجًا للمستخدم على الهاتف المحمول ، "كما يقول دود وكوخ. "مستخدمو الجوّال معتادون على اتخاذ خيارات مدروسة لاستهلاك الوسائط."
هناك ما هو أكثر من التصميم سريع الاستجابة من مجرد تقليص حجم المتصفح.
يقول Dodd و Koch: "يعد اكتشاف الميزات جزءًا مهمًا من تطوير الويب للجوال أيضًا". "لا تعتقد أنه لا يمكنك التكهن بأحداث اللمس على موقع ويب لسطح المكتب ، فإن تفاصيل تفاعل الجوال أكثر تعقيدًا مما قد تبدو."
هناك المزيد لقاعدة الثلاثة مما تعتقد
كارولين هارت هو الرئيس التنفيذي للعمليات في InspireHUB (Inspire_HUB) ومنشئ تطبيق IHUBApp ، وهو أحد أقدم تطبيقات الويب للجوّال على مستوى المؤسسات في السوق.
حاول الاحتفاظ بجميع عناصر تصميم واجهة المستخدم لتطبيق الويب في مجموعات من ثلاثة أفراد.
"لقد تعثرنا عبر" القاعدة الثلاثة "أثناء بحثنا في كيفية خلق الثقة في واجهتنا لعملائنا. يقول هارت: "لم يكن إصدار V1.0 لمنصتنا يحقق الهدف". "تظهر الأبحاث أن الرقم ثلاثة هو الرقم الأمثل الذي يزيد الثقة. أقل من ثلاثة ويشعر الناس بعدم اليقين ، وأكثر من ثلاثة ويشعرون بالإرهاق ".
يقول هارت: "لذلك قمنا بتحدي تجربة المستخدم المتمثلة في أنه يجب تقديم كل شيء في شكل ثلاث ، بدءًا من القرارات وحتى الخطوات بينما يقوم عملاؤنا بتعبئة تطبيقاتهم. لقد غيرت القاعدة أداتنا. تتميز الواجهة الخلفية لدينا بأنها متطورة للغاية لتلائم بساطة التصميم ، ولكن المكافأة كانت تستحق العناء! "
الحفاظ على الإيماءات بسيطة وبديهية
جيسون سوريانو هو المؤسس والرئيس التنفيذي لشركة Rocketfuel Productions Inc. (TrajectoryIQ). مع أكثر من 13 عامًا من الخبرة في تصميم واجهة مستخدم تطبيقات الجوال والويب ، وبعد إنشاء مشاريع قائمة على الإنترنت والهاتف المحمول لشركات مثل Discovery Communications ، التقط Suriano عددًا قليلاً من النصائح الاحترافية. هذه هي المفضلة لديه:
على الهاتف المحمول ، افترض أن كل الأصابع خرقاء.
"إحدى الحيل التي قمنا بتنفيذها عند تصميم ألعاب الهاتف المحمول هي جعل شاشة البداية بأكملها منطقة قابلة للنقر. ما يعنيه هذا هو أنه إذا ذهب المستخدم للنقر على زر البدء وأخطأ ، فسيستمر التطبيق في تحميل شاشة تشغيل اللعبة التالية ، مما يضمن استمرار المستخدم في التطبيق "، كما يقول سوريانو.
ويضيف قائلاً: "نظرًا لأن واجهة المستخدم / UX للجوّال يتم تحديدها من خلال النقرات والنقرات المزدوجة والتمريرات السريعة والإيماءات ، فإن أي خطأ في تصميم شيء مباشر مثل شاشة البداية يمكن أن يترك المستخدم محبطًا أو محبطًا ، مما يضطره إلى الضغط على زر الصفحة الرئيسية والخروج من التطبيق". .
إبقاء العقل منفتحًا على حيل تصميم واجهة مستخدم تطبيقات الويب الجديدة
نولان كير ومدير مشروع ومساعد تطوير الأعمال في Messapps (Messapps) ، وهي شركة تطوير تطبيقات مقرها في مدينة نيويورك. يقول Kier: "على الرغم من أنه تم تأسيسها قبل أقل من ثلاث سنوات بقليل ، فقد نمت شركة Messapps سريعًا لتصبح واحدة من أكثر شركات تطوير التطبيقات شهرةً وابتكارًا في مجال تطوير التطبيقات ،" وتعلمنا الكثير من واجهة مستخدم تطبيقات الويب حيل التصميم في تلك السنوات الثلاث القصيرة ".
استمر في البحث عن طرق جديدة وأفضل لإنجاز العمل.
يقول كير: "العديد من الحيل أو الأساليب الجديدة لإكمال مهمة ما تعلمناها إما من خلال البحث عن المشكلة أو عن طريق التعمق في قضية تطوير معينة لتحديد الإجابات التي يمكن الاستغناء عنها". "تتضمن الأمثلة على ذلك تعلم كتابة مستندات رائعة عن طريق كتابة مقتطفات تعليمات برمجية جديدة إلى LaTeX ، وهو ما يشبه محرر نصوص بأسلوب / تنسيق برمجة. أيضًا ، تمتلك Mathematica ، التي تشبه Mathcad لنظام التشغيل MacOS ، هذه الميزة المخفية الأنيقة التي سمحت للمستخدم بإنشاء مخطط ثلاثي الأبعاد صعب باستخدام البرنامج ".
يقول كيرك: "بالنسبة للتصميم ، فإن العثور على كيفية ضغط الإطارات باستخدام أشياء مثل تعديل قنوات ألفا والقدرة على ضغط الصور الفردية باستخدام خوارزميات مخصصة كانت حيلًا صغيرة ساعدت العملية". "يتطلب التواجد في أعمال تصميم وتطوير واجهة المستخدم لتطبيق الويب ابتكارًا يتناسب مع تطور التكنولوجيا. ونتيجة لذلك ، يعيد المصممون والمطورون العمل باستمرار عملياتنا الداخلية والخارجية "لإعادة اختراع العجلة" واكتشاف طرق جديدة للتصميم والتطوير. "
إيجاد الأشخاص المناسبين للعمل معهم
روبرت بيتا هو مهندس iOS ومدير تنفيذي في Porter Key (PorterKeyboard) ، وهي لوحة مفاتيح ذكية لنظام iOS تقدم اقتراحات سياقية. إليك أكبر نصيحة له كمهندس ورائد أعمال:
ابحث عن مصمم مطور أو مطور مصمم.
يقول بيتا: "سيساعد الشخص الذي يفهم ويتمتع بخبرة كبيرة من كلا الجانبين في حل مشكلات الاتصال والمساعدة في الحفاظ على المشروع في الموعد المحدد". هناك فائدتان رئيسيتان لذلك. أولاً ، يمكن لأي شخص لديه خبرة في التصميم والتطوير أن يساعد في سد فجوات الاتصال. كل من التصميم والتطوير لهما مصطلحات رئيسية خاصة بهما ، والعامية ، والافتراضات الضمنية والمستأجرين الأساسيين. من خلال معرفة العالمين ، يمكن اكتشاف مشكلات الاتصال بشكل استباقي ".
ويضيف بيتا: "ثانيًا ، يمكن للمطور الذي يتمتع بخبرة في التصميم تقدير متطلبات التعقيد والموارد بشكل أفضل بكثير من مطور واحد أو مصمم فردي أو حتى مدير منتج". في كثير من الأحيان ، يمكن أن تؤدي التغييرات الصغيرة في التصميم إلى انخفاض كبير في وقت التطوير. هذا صحيح بشكل خاص على الهاتف المحمول ، حيث تكون نماذج تصميم معينة معدة مسبقًا. فهم التخصيصات التي يسهل تنفيذها وما هي الرسوم المتحركة سهلة الاستخدام سيساعد في ضمان تمتع المطورين والمصممين بهذه العملية ".
يقول بيتا: "يمكن لبعض الفرق الحالية أن تدعي أن اجتماعات الوقوف مع المطورين والمصممين تحل هذه المشكلات ، لكن في كثير من الأحيان ، ليس هذا هو الحال. الاجتماع قصير جدًا بحيث لا يمكن الخوض بدقة في افتراضات التصميم الضمنية ، وأبحاث المستخدم السابقة ، وقرارات بنية الكود الحالية ، واختيار اللغة ، والمزيد من الخيارات التي تحدد المشروع. فقط الشخص الذي لديه خبرة من كلا العالمين سيكون قادرًا على سد الفجوة بسرعة وفعالية. "
وخدعة أخرى منا: استخدم أداة النماذج الأولية الصحيحة
يمكن تدريس بعض حيل تصميم واجهة مستخدم تطبيقات الجوال والويب ، وبعضها لا يمكن تعلمه إلا بالطريقة الصعبة ، من خلال التجربة. لحسن الحظ ، يمكن للمصممين والمطورين اليوم بناء خبراتهم ، كما يقولون ، على أكتاف العمالقة.
[ Proto .io هي أداة نماذج أولية لتطبيقات الأجهزة المحمولة يستخدمها رواد الأعمال والشركات الناشئة لإنشاء نماذج أولية واقعية تفاعلية بالكامل تبدو وكأنها تطبيقات حقيقية.]