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

تحت القصة ، قصة طويلة ولكنها مفيدة حول تصميم واجهة بنك متنقل في وقت قصير. أولئك الذين يتقنونها سيحصلون على مكافأة في النهاية.
لم يكن هناك وقت لأبحاث كاملة ، لذلك تم اختيار مسار بسيط: تحليل أنشطة التسويق الحالية ، والحصول على استشارات المنتج مع مركز الاتصال ، وإجراء مقابلات مع العديد من عملاء البنوك واختبار ممر النموذج الأولي.
تصميم محوره المستخدم
استند تطوير مفهوم التصميم على منهجية UCD. الأدوات الرئيسية:
- الأشخاص (الأشخاص) - صور جماعية للممثلين النموذجيين للجمهور المستهدف للمنتج ، موحدين بعدد من الميزات ذات الصلة شخصيًا.
- حالات الاستخدام - وصف موجز للمهمة داخل المنتج التي يحتاج الشخص إلى إكمالها.
- استخدم السيناريوهات (السيناريوهات) - قصصًا خيالية حول تسلسل أحداث الشخص في "الحياة اليومية" في طريقه لتحقيق الهدف.
التحدي رقم 1: بطاقة الطلب
كانت أول حالة استخدام مقترحة هي:
"بصفتي غير عميل لـ Alfa Bank ، أريد الحصول على بطاقة ائتمان ، لأن لديها بعض أفضل الشروط في السوق من أجل تسديد الدفعات على الإنترنت ودفع ثمن المرافق"
المشكلة الرئيسية هي أن البنك يقدم 17 خيار بطاقة ، بما في ذلك 8 ائتمان و 9 خصم. ينفذ تطبيق مصرفي حالي محاولة لتحديدها جميعًا.
البصيرة # 1وفقًا للحالة المقترحة ، يحتاج المستخدم إلى بطاقة ائتمان ، حتى تتمكن من إزالة 9 بطاقات خصم بأمان. هناك 8 اليسار - أسهل بالفعل.
البصيرة # 2بعد الفحص الدقيق ، تبين أن 8 بطاقات ائتمان تختلف قليلاً عن بعضها البعض. ولكن هناك واحدة مع معظم الفوائد وأقوى دعم تسويقي.
بالنظر إلى سياق طلب البطاقة وحالة الاستخدام ، يُنصح بتقديم بطاقة واحدة فقط للمستخدم ، توضح مزاياها الواضحة. يبسط هذا النهج بشكل كبير التفاعل مع الواجهة ، مما يعني أنه يزيد التحويل. والأهم من ذلك - وهذا يتفق مع استراتيجية التسويق الحالية للبنك.
الإجمالي: مهمتنا هي "بيع" بطاقة ائتمان واحدة فقط ، ولكن أكثر بطاقات الائتمان "لذيذًا".
نصنع شخص
نعم ، الشخصيات هي شخصيات خيالية. لكن شخصًا مؤلفًا بشكل صحيح يساعد الفريق على التركيز على الأشياء الصحيحة وارتكاب أخطاء أقل. يجب أن يكون الشخص واقعيًا ومتماسكًا قدر الإمكان.
في حالة طلب بطاقة ائتمان ، قمنا بتشكيل الشخص التالي:

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

مسار المستخدم

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


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


يحدد العنوان "الحصول على بطاقة ائتمان من بنك ألفا" التوقعات بوضوح: "بالنقر على هذا الشيء يمكنني طلب بطاقة"


يكشف شريط التمرير المكون من 5 شاشات عن المزايا الرئيسية لبطاقة ائتمان قصوى بلغة بسيطة ومفهومة.
تحتوي الشريحة الأولى على معلومات أساسية. كل شريحة لاحقة توسعها.


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


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


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

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

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


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

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

التحدي الثاني: فتح وديعة
حالة الاستخدام المقترحة الثانية كانت:
"بصفتي عميل بنك ألفا ، الذي لديه بطاقة أستخدمها بانتظام ، أريد فتح وديعة بمبلغ 20000 هريفنيا لمدة 12 شهرًا لزيادة أموالي"
يقدم بنك ألفا العديد من خيارات الإيداع بعملات مختلفة لفترات مختلفة وأسعار فائدة مختلفة.
البصيرة # 1بالنظر إلى حالة الاستخدام ، فإننا نحدد فقط سيناريو فتح وديعة في UAH.
البصيرة # 2وفقًا لحالة الاستخدام ، يهتم العميل بمساهمة لمدة عام واحد ، مما يعني أننا لا نعتبر أيضًا وديعة ادخار ذات عائد مخفض في هذا القرار.
الإجمالي: مهمتنا هي "بيع" الإيداع الأكثر ربحية للعميل بمعدل فائدة مرتفع لمدة 3 إلى 18 شهرًا ، مع دفع الفوائد في النهاية أو شهريًا.
نصنع شخص

كتابة السيناريو

مسار المستخدم

وسنحلل حلول الواجهة لكل مرحلة من مسار المستخدم.


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



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



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


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


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

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


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

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