أغراض تأطير الأسلاك (Purposes of wireframing)
تأطير الأسلاك هو عملية توضيح كيف ستعمل واجهة المستخدم وكيف ستبدو قبل بدء عملية التصميم الفعلية. هو مثل الرسم البياني للتطبيق الخاص بك، يساعد على تنظيم الفكرة وتوضيحها.
الهدف الرئيسي لتأطير الأسلاك هو تحديد العناصر المختلفة التي ستتواجد على الشاشة وكيف ستتفاعل مع بعضها البعض. هذا يشمل الأزرار، القوائم، الصور، النصوص، وغيرها من العناصر.
تأطير الأسلاك يساعد أيضا على تحديد وتوضيح المسارات التي يمكن أن يتبعها المستخدم عند استخدام التطبيق. على سبيل المثال، كيف سيتنقل المستخدم من الشاشة الرئيسية إلى الشاشات الفرعية والعودة.
الحفاظ على عملية التطوير مركزة على المستخدم (Keep the development process user-centric)
في عملية تصميم التطبيقات، من الضروري دائمًا الحفاظ على المستخدم في الصدارة. هذا يعني أن كل قرار تصميم يجب أن يتم اتخاذه بناءً على كيفية تحسين تجربة المستخدم وتلبية احتياجاته.
تأطير الأسلاك يساعد في تحقيق ذلك من خلال التركيز على وظائف التطبيق وكيفية تفاعل المستخدمين معها. وهذا يساعد في التأكد من أن الواجهة بسيطة ومنطقية وسهلة الاستخدام، مما يساهم في تحسين تجربة المستخدم النهائية.
البدء بتدفقات المستخدم (Start with user flows)
تدفقات المستخدم تشير إلى المسارات المختلفة التي يمكن للمستخدم اتباعها خلال استخدام التطبيق. إنها توفر نظرة شاملة على الطرق التي يمكن للمستخدم من خلالها التنقل في التطبيق، وتعمل كنقطة بداية جيدة لتأطير الأسلاك.
يمكن لتدفقات المستخدم أن تساعد في التحقق من أن كل خطوة في تجربة المستخدم قد تم تصميمها بالشكل الصحيح. إنها تساعد أيضا في تحديد أي نقاط قد تكون محيّرة أو غير واضحة للمستخدمين.
مثال على تدفق المستخدم قد يكون كالتالي: الشاشة الرئيسية > قائمة المنتجات > صفحة المنتج > عربة التسوق > تأكيد الطلب > الشاشة النهائية.
رسم العناصر الأساسية والشاشات (Sketch the core elements and screens)
بعد تحديد تدفقات المستخدم، يمكنك البدء في رسم العناصر الأساسية والشاشات لتطبيقك. هذه العناصر يمكن أن تشمل الأزرار، القوائم، الصور، النصوص، وغيرها من العناصر التي ستتواجد على كل شاشة.
إذا كانت هناك عناصر مشتركة بين الشاشات، مثل القائمة الرئيسية أو الشريط العلوي، فيجب رسمها بنفس الطريقة على كل شاشة للحفاظ على الاتساق.
في هذه المرحلة، ليس من الضروري التركيز على التفاصيل الصغيرة مثل الألوان أو الخطوط. الهدف هو فقط الحصول على فكرة عامة عن كيفية توزيع العناصر على الشاشة وكيف ستتفاعل مع بعضها البعض.
تأطير الأسلاك لأوضاع الأجهزة المختلفة (Wireframing for different device orientations)
عند تصميم تطبيق للهاتف المحمول، من المهم أن نضع في الاعتبار كيف سيظهر التطبيق في كل من الوضع الأفقي والعمودي. قد يتطلب الأمر إعادة ترتيب العناصر أو تغيير حجمها حتى تتناسب مع كل اتجاه.
على سبيل المثال، قد تقرر أن تضع القائمة في الجزء السفلي من الشاشة عندما يكون الهاتف في الوضع العمودي، ولكن عند تحويل الهاتف إلى الوضع الأفقي، قد تحتاج إلى نقل القائمة إلى الجانب الأيمن من الشاشة.
استخدام قوالب الأنماط التصميمية (Use design pattern templates)
القوالب النمطية للتصميم هي مجموعات من الحلول التصميمية التي تم تطبيقها على مشاكل تصميم معينة وثبتت فعاليتها على مر الزمن. يمكن استخدام هذه القوالب كأداة فعالة لحل مشاكل التصميم الشائعة بشكل أسرع وأكثر كفاءة.
على سبيل المثال، إذا كنت ترغب في تصميم شاشة تسجيل الدخول، يمكنك البحث عن قوالب نمطية لشاشات تسجيل الدخول واستخدامها كنقطة بداية في تصميمك. هذا يوفر الوقت ويضمن أنك تستخدم حلولًا تصميمية ثبتت فعاليتها.
تضمين النص الحقيقي حيثما كان ذلك ممكنًا (Include real copy wherever possible)
في الكثير من الأحيان، خلال مرحلة تأطير الأسلاك، يتم استخدام نصوص رمزية أو ملء المكان مكان النص الفعلي. ومع ذلك، يمكن أن يكون من المفيد استخدام النص الحقيقي حيثما كان ذلك ممكنًا.
إضافة النص الفعلي يمكن أن يساعد في فهم كيف ستتناسب الكلمات والجمل في الفضاء المتاح، ويمكن أن يساعد في تقدير كمية النص المناسبة التي يجب استخدامها.
على سبيل المثال، في شاشة تسجيل الدخول، يمكن استخدام العبارات الفعلية مثل “اسم المستخدم” و”كلمة المرور” بدلاً من استخدام النص الرمزي.
اهتمام بحجم الأهداف اللمسية (Pay attention to tap target sizes)
في تطبيقات الهواتف المحمولة، من المهم الاهتمام بحجم الأهداف اللمسية. هذه الأهداف هي العناصر التي يمكن للمستخدمين الضغط عليها على الشاشة، مثل الأزرار والروابط والعناصر القابلة للتحديد.
توجد مبادئ توجيهية لحجم الأهداف اللمسية لضمان الراحة والدقة عند الضغط. على سبيل المثال، قد توصي أبل بأن تكون الأهداف اللمسية على الأقل 44 بكسل × 44 بكسل في الحجم.
استخدم هذه المبادئ التوجيهية عند تصميم الأزرار والروابط والعناصر القابلة للتحديد في تطبيقك لضمان تجربة مستخدم سلسة وخالية من الأخطاء.
الخاتمة
إن التأطير السلكي للتطبيقات المحمولة هو عملية أساسية في عملية التصميم. من خلال التركيز على المستخدم والتفكير في تدفق العمل والتخطيط لأوضاع الأجهزة المختلفة، يمكنك تصميم تجربة مستخدم أفضل وأكثر فعالية. استخدم النصوص الحقيقية حيثما كان ذلك ممكنًا، واهتم بحجم الأهداف اللمسية لضمان تجربة مستخدم سلسة.
الأسئلة الشائعة (FAQ)
ما هو التأطير السلكي للتطبيقات المحمولة؟
التأطير السلكي هو خريطة أولية لتطبيق الهاتف المحمول يتم استخدامها لتحديد المتطلبات الأساسية للتصميم، مثل التنقل والتخطيط العام والهيكل الأساسي للصفحات.
لماذا يجب علينا البدء بتدفقات المستخدم عند التأطير السلكي؟
تدفقات المستخدم تساعد في فهم كيف سيتفاعل المستخدمون مع التطبيق، وتعطينا نظرة عامة على كيف يمكن تنظيم الصفحات والعناصر.
ما الذي يجب الأخذ في الاعتبار عند التأطير السلكي لأوضاع الأجهزة المختلفة؟
يجب مراعاة الفرق في الحجم والتوجيه بين الوضع الأفقي والعمودي، والتأكد من أن التطبيق يعمل بشكل صحيح وبطريقة مريحة للمستخدم في كلا الاتجاهين.
لماذا يجب الانتباه لحجم الأهداف اللمسية في تطبيقات الهاتف المحمول؟
الأهداف اللمسية الكبيرة تجعل من السهل على المستخدمين الضغط على الأزرار والروابط والعناصر القابلة للتحديد، مما يزيد من الراحة والدقة ويقلل من الأخطاء.
