اسحب للاستكشاف. مرّر أو استخدم إصبعين للتكبير. افتح المساعدة لعرض اختصارات لوحة المفاتيح.

Yan
متاح
للمشاريع
لنتحدث
Yan Fontão Boring view
All work

Case 015تصميم تطبيق للهاتف المحمول

DossApp

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

دوري
مسارات المنتج وتصميم الواجهة
حالة المشروع
تصميم الواجهة · أرشيف Figma
دراجة نارية أمنية صغيرة 3D وصفارة إنذارها تومض.
مجسّم 3D مصنوع للوحة المشاريع هذه.

01

مساهمتي

DossApp تطبيق باللغة البرتغالية للأمن عند الطلب حول المنزل، له جانب للسكان وآخر لمقدمي الخدمة. يكلّف طلب التحقق الحارس بالتأكد من أمر ما، مثل ما إذا كانت البوابة مقفلة. أما طلب التغطية فيرسل حارسًا لمرافقة وصول الساكن.

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

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

02

ما يطلبه كل لون

على شاشة داكنة، يتولى اللون معظم الفرز. الطلبان اليوميان هما أكبر الكتل: Solicitar Verificação بالرمادي الفاتح وSolicitar Cobertura بأصفر العلامة. يقف Emergência منفردًا بوصفه العنصر الأحمر الوحيد، بجانب السؤال ‎“Precisando de uma ajuda mais urgente?”‎، فلا يمكن الخلط بين المسار العاجل والمسار الروتيني. أما الحساب والمركبات وأفراد العائلة وبقية العناصر فتبقى في الأسفل ضمن شبكة هادئة من الأيقونات.

الشاشة الرئيسية للساكن ببطاقة الخطة، وكتلتي Solicitar Verificação وSolicitar Cobertura، وزر Emergência الأحمر، وشبكة من ست أيقونات.
الشاشة الرئيسية لمقدم الخدمة بمفتاح تبديل بجانب حالة الاتصال، وكتلتي Cobertura وVerificações، وزر Emergência الأحمر، وشبكة أيقونات فيها Clientes.
شاشة Histórico بعوامل التصفية Todos وCobertura وVerificação وثلاثة سجلات تجريبية فيها التاريخ والوقت والحارس ونوع الطلب.
تفصل الشاشة الرئيسية الطلبات الروتينية عن مسار الطوارئ. يحافظ جانب الحارس على التخطيط ويغيّر المحتوى. يعرض السجل كل طلب بتاريخه وحارسه ونوعه.

03

بعد الطلب، ما الذي يحدث الآن

لا ينتهي الطلب عند الزر. تذكر شاشة التغطية اسم الحارس الذي في الطريق وتعرض أربع خطوات هي Criada وEnviada وEm andamento وConcluído، مع ظهور الخطوة الحالية بخط عريض وCancelar في الأعلى. ثم ترسم شاشة الخريطة مسار الحارس ومسار الساكن بألوان مختلفة وهما يلتقيان عند المنزل.

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

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

04

الشاشة نفسها من جانب الحارس

تحتفظ الشاشة الرئيسية لمقدم الخدمة بتخطيط شاشة الساكن، فيبدو جانبا التطبيق متشابهين. ما يتغير هو المحتوى: يحل مفتاح تبديل محل تسمية الخطة، وتصبح الكتلتان الكبيرتان Cobertura وVerificações، وتضيف الشبكة Clientes وNotificações. أما في جانب الساكن فيبقى Histórico سجلًا بسيطًا مع تصفية بحسب النوع وبطاقة لكل تاريخ وحارس وطلب.

صورة للمتجر بتعليق توضيحي وخريطة داكنة لمدينة Campinas عليها مساران يحمل أحدهما التسمية João والآخر Você، يلتقيان قرب علامة المنزل.
تتابع الخريطة الحارس والساكن في طريقهما إلى المنزل.
000

التعليمات

Yan Fontão
لمسة
تفتح شاشة
نقرة
تفتح شاشة
سحب
يتجوّل في اللوحة
العجلة
الفأرة تكبّر، ولوحة اللمس تحرّك، وإصبعان يكبّران
− +
تراجع لرؤية اللوحة كاملة، أو اقترب
الأسهم
في دراسة الحالة: ↑↓ لتبديل الدراسة، ←→ لتبديل الوسائط. في اللوحة: للتحريك
مسافة
تفتح أو تعود
Enter
يفتح
Esc Backspace
رجوع
Home
العودة إلى الوسط، ثم إلى المقدمة
PgUp PgDn
القناة السابقة أو التالية
Tab
يتنقل بين المشاريع والروابط
R
مشروع عشوائي
0–9
اكتب رقم القناة، 1–61
?
هذه الصفحة
الاختصارات

موسيقى اللوحة

الملفات مضغوطة وموحّدة الصوت للويب.

متاح
للمشاريع
لنتحدث

رسالة جديدة إلى يان

أخبرني من أنت وسأرد عليك.

000

عن يان

مرحبًا، أنا يان

مصمم منتجات/ مهندس تصميم

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

  • 2018بداية تطوير البرمجيات
  • UI + codeالتصميم والتنفيذ

عملت مع Motorola · Ambev Tech · Rei do Pitaco · OneTool · CESAR

البرازيل · عن بُعد أو هجين أو حضوريًا

صورة يان فونتاو جالسًا بسترة خضراء ونظارة ويمسك ميكروفونًا.
متاح
للمشاريع
لنتحدث
متاح
للمشاريع
لنتحدث
000

قناة مقفلة

بموجب اتفاقية عدم إفصاح

أدخل الرمز

اطلب الرمز من يان ↗
متاح
للمشاريع
لنتحدث
YAN FONTÃO دراسات الحالة

القناة 15 تصميم تطبيق للهاتف المحمول

DossApp

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

دوري
مسارات المنتج وتصميم الواجهة
حالة المشروع
تصميم الواجهة · أرشيف Figma

شاهده على Dribbble

دراجة نارية أمنية صغيرة 3D وصفارة إنذارها تومض.
مجسّم 3D مصنوع للوحة المشاريع هذه.

طلبان وزر أحمر واحد

شاشات من التصميم الأصلي في Figma وDribbble، ببيانات تجريبية.

مساهمتي

DossApp تطبيق باللغة البرتغالية للأمن عند الطلب حول المنزل، له جانب للسكان وآخر لمقدمي الخدمة. يكلّف طلب التحقق الحارس بالتأكد من أمر ما، مثل ما إذا كانت البوابة مقفلة. أما طلب التغطية فيرسل حارسًا لمرافقة وصول الساكن.

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

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

ما يطلبه كل لون

على شاشة داكنة، يتولى اللون معظم الفرز. الطلبان اليوميان هما أكبر الكتل: Solicitar Verificação بالرمادي الفاتح وSolicitar Cobertura بأصفر العلامة. يقف Emergência منفردًا بوصفه العنصر الأحمر الوحيد، بجانب السؤال ‎“Precisando de uma ajuda mais urgente?”‎، فلا يمكن الخلط بين المسار العاجل والمسار الروتيني. أما الحساب والمركبات وأفراد العائلة وبقية العناصر فتبقى في الأسفل ضمن شبكة هادئة من الأيقونات.

الشاشة الرئيسية للساكن ببطاقة الخطة، وكتلتي Solicitar Verificação وSolicitar Cobertura، وزر Emergência الأحمر، وشبكة من ست أيقونات.
تفصل الشاشة الرئيسية الطلبات الروتينية عن مسار الطوارئ.
الشاشة الرئيسية لمقدم الخدمة بمفتاح تبديل بجانب حالة الاتصال، وكتلتي Cobertura وVerificações، وزر Emergência الأحمر، وشبكة أيقونات فيها Clientes.
يحافظ جانب الحارس على التخطيط ويغيّر المحتوى.

بعد الطلب، ما الذي يحدث الآن

لا ينتهي الطلب عند الزر. تذكر شاشة التغطية اسم الحارس الذي في الطريق وتعرض أربع خطوات هي Criada وEnviada وEm andamento وConcluído، مع ظهور الخطوة الحالية بخط عريض وCancelar في الأعلى. ثم ترسم شاشة الخريطة مسار الحارس ومسار الساكن بألوان مختلفة وهما يلتقيان عند المنزل.

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

شاشة Histórico بعوامل التصفية Todos وCobertura وVerificação وثلاثة سجلات تجريبية فيها التاريخ والوقت والحارس ونوع الطلب.
يعرض السجل كل طلب بتاريخه وحارسه ونوعه.
صورة للمتجر بتعليق توضيحي وشاشة محادثة: يسأل الساكن إن كانت البوابة مقفلة، ويرد الحارس بصورة قفل، ويظهر طلب حل في الأسفل.
يجري التحقق في محادثة، من السؤال إلى حله.

الشاشة نفسها من جانب الحارس

تحتفظ الشاشة الرئيسية لمقدم الخدمة بتخطيط شاشة الساكن، فيبدو جانبا التطبيق متشابهين. ما يتغير هو المحتوى: يحل مفتاح تبديل محل تسمية الخطة، وتصبح الكتلتان الكبيرتان Cobertura وVerificações، وتضيف الشبكة Clientes وNotificações. أما في جانب الساكن فيبقى Histórico سجلًا بسيطًا مع تصفية بحسب النوع وبطاقة لكل تاريخ وحارس وطلب.

صورة للمتجر بتعليق توضيحي وخريطة داكنة لمدينة Campinas عليها مساران يحمل أحدهما التسمية João والآخر Você، يلتقيان قرب علامة المنزل.
تتابع الخريطة الحارس والساكن في طريقهما إلى المنزل.