هلا ، 🤩

كتذكير ، أنت تقرأ هذا المقال كجزء من سلسلة 4I:

  1. بإختلاف المنهجيات - مراحل التصميم الأربعة!.
  2. مراحل التصميم الأربعة - مقدمة في الإلهام.
  3. مراحل التصميم الأربعة - مقدمة في التصور و إنتاج الحلول.
  4. مراحل التصميم الأربعة - مقدمة في التنفيذ.
  5. مراحل التصميم الأربعة - مقدمة في الإختبار و التكرار.

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

التحقق المبكر أفضل دائمًا!

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

بالنسبة لي ، في أفضل السيناريوهات أود أن أعمل مثل هذا:

  1. مخطط: للتحقق من صحة الميزات ، ومحتوى الشاشة والتنقل مع أصحاب المصلحة داخليًا.
  2. الرسومات: للتحقق من صحة موضع المحتوى والخيال البصري المبكر داخليًا.
  3. لو فاي: للتحقق من صحة مع أصحاب المصلحة.
  4. مرحبا فاي: للتحقق من صحة الاتجاه البصري والتخطيط النهائي مع أصحاب المصلحة.
  5. التفاعلية: لإظهار الرسوم المتحركة والتفاعلات الصغيرة.
  6. نظام التصميم: ليتم تسليمها إلى فريق التطوير إلى جانب شاشات Hi-Fi والعروض التوضيحية التفاعلية.

نموذج المنتج الرقمي - الدليل الكامل

قبل بضعة أشهر ، كتبت مقالة نُشرت على UX-Planet. خلال هذه المقالة ، غطيت كل شيء تقريبًا حول النموذج الفني للمنتج الرقمي (تقنية Hi-Fi و Interactive و Lo-Fi و Sketches) والمهارات الأساسية وبعض المفاهيم الأساسية. هل يمكن قراءة المادة، ثم عد ومتابعة القراءة عن مرحلة التنفيذ.

نموذج المنتج الرقمي - الدليل الكامل

الآن ، دعونا نتحدث عن المراحل الفرعية المفقودة وهي نظام تدفق الشاشة والتصميم.

مخطط

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

كيف نبنيها؟

هناك خياران بسيطان ، استخدم أحد القوالب (هناك العديد من الخيارات ، فقط google it) - أو قم بإنشائه من البداية ، وأوصي باستخدام قالب لتوفير الوقت ، ولا توجد مواهب خاصة هنا.

كيفية التحقق من صحة ذلك؟

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

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

أفضل الممارسات

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

تذكر أنه لا يتعلق بالأدوات التي تستخدمها ، بل يتعلق بامتلاك هذا النوع من مهارات الصياغة والإبداع.

الآن دعنا ننتقل إلى الجزء التالي ، نظام التصميم. كيف ولماذا نبنيها؟

نظام التصميم

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

  1. نماذج التفاعل: أولاً ، نحتاج إلى تحديد نماذج التفاعلات التي نستخدمها في هذا المنتج ، ويجب أن نترك بعض المراجع عن كل واحد للمساهمين الآخرين.
  2. المكون الأساسي للاتجاه البصري: الذرات. مثل الخطوط والأيقونات والألوان والطباعة ونظام شبكة معياري به مسافة بيضاء وقواعد التحجيم.
  3. العناصر القابلة لإعادة الاستخدام: إنتاج تنفيذ المكون الأساسي لاتجاه التصميم المرئي وقواعده بهدف بناء العناصر الأساسية مثل الأزرار والشارات وعناصر النموذج وما إلى ذلك.
  4. مكون قابل لإعادة الاستخدام: من خلال دمج العناصر القابلة لإعادة الاستخدام معًا ، نقوم ببناء مكونات ذات كتل تصميم أكثر تخصيصًا مثل (بطاقة الملف الشخصي ، معرض الصور ، منشور المدونة ، جداول الأسعار ، المتزلجون ، المساحة المميزة ، بطاقة العنصر ، إلخ). يجب أن نضمن أيضًا أننا لا نزال نلتزم بتوجيه التصميم المرئي.
  5. هيكل IA: من المهم جدًا تحديد قوالب بنية IA - مثال على قالب بنية IA هو محتوى الصفحة الذي يتبع هذه البنية (التنقل العلوي ، ملخص البحث ، العنوان المميز ، المحتوى الرئيسي ، التذييل) - حاملات سلوك التنقل ، المبادئ الأساسية ، ولغة التصميم.
  6. التفاعلات: نحن نهدف إلى الحفاظ على التناسق بين تدفق التفاعلات المختلفة ، والتعليقات ، وما إلى ذلك. من المهم أن نضع دليلًا للتفاعلات يبدأ من التفاعلات الصغرى (مثل التمرير بالماوس أو النقر فوق زر) وينتهي بمقياسه الكبير (على سبيل المثال ، انتقل يقدم ، الخ).
  7. المعايير اللغوية: نحن هنا لا نحدد الصوت والنبرة فحسب ، بل نعرِّف أيضًا نصوص الكتابة على الويب.
  8. مبادئ UX: تقف UX Design دائمًا على مجموعة من المبادئ ، إذا قمت بخرق تلك المبادئ ، فإنك تخسر التجربة. تتحكم مبادئ UX في المخرجات في العديد من الحالات وللحفاظ على تناسق UX - نظرًا لوجود إمكانية لزيادة - يجب أن نضع مبادئ UX هذه وإرشاداتها.

لفهم أفضل لنظام التصميم ، إليك بعض المراجع:

لماذا تصميم النظام؟

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

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

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

كيفية بناء نظام التصميم؟

هناك حالتان ، عندما تقوم بإنشاء منتج جديد أو عندما يكون لديك بالفعل منتج قيد التشغيل. وهنا أفضل الممارسات من تجربتي لكلتا الحالتين.

منتج جديد:

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

منتج موجود:

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

منصات؟

كل ما تريد استخدامه ، واستخدامه. لكن ضع في اعتبارك أنه يجب أن يكون قابلاً للاستخدام في هذه الحالات:

  • دعم الوسائط المتعددة.
  • الأصول القابلة للتحميل.
  • مقتطفات الشفرة.
  • ثابت / بحث متقدم.
  • الملاحة الثابتة وواضحة.

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

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

على استعداد لاتخاذ الخطوة التالية؟

بعد ذلك ، مقدمة في التكرار

المزيد من القراءات ،

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

التقييم الاسترشادي هو طريقة فحص قابلية الاستخدام لبرامج الكمبيوتر التي تساعد على تحديد مشاكل قابلية الاستخدام في تصميم واجهة المستخدم (UI). وهو يتضمن على وجه التحديد مقيمين يفحصون الواجهة ويحكمون على توافقها مع التوصية ...

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

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

تحليل فرص القيمة (VOA) هو نهج لتحديد السمات الطموحة في منتج أو خدمة ، حيث يتم سرد مجموعة من فرص القيمة لمساعدة فرق التصميم على التركيز على العناصر الأساسية لتوصيل الجمهور المستهدف. تعيين ...

الكائنات والبيئات التي تجسد الطبيعة والبساطة والعيوب الدقيقة تحقق جمالية أعمق وأكثر جدوى. Wabi-sabi هي في آن واحد رؤية للعالم ، فلسفة الحياة ، نوع من الجمالية ، وبالتالي ، مبدأ التصميم. ال ...