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