ابدأ الآن

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

المقدمة

ما هو نظام الشارقة للتصميم؟

يُعد نظام تصميم الشارقة (SDS) إطارًا موحدًا للتصميم وتجربة المستخدم، يهدف إلى تعزيز الاتساق والوضوح وجودة التجربة عبر جميع الخدمات الرقمية لحكومة الشارقة. ويوفر مجموعة متكاملة من المكونات، والأنماط، والإرشادات التي تُسهم في تصميم وتطوير واجهات رقمية متسقة وفعّالة.

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

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

الموارد

الأصول والأدوات

توفر واجهة المستخدم (UI Kit) مجموعة متكاملة من الأصول التصميمية والأدوات التي تسهم في تبسيط سير العمل وتسريع تصميم واجهات المستخدم. وتشمل جميع المكونات الأساسية، والأنماط، ورموز التصميم، والتخطيطات، بما يتوافق مع معايير نظام تصميم الشارقة. كما تتيح إنشاء الصفحات بسرعة باستخدام عناصر جاهزة، مما يعزز الاتساق، ويحد من إعادة العمل، ويسهم في تقديم تجارب رقمية عالية الجودة بكفاءة أكبر.

تنزيل نظام الشارقة للتصميم بصيغة Figma

الإصدار 1.0

نُشر في ديسمبر 2025

الإرشادات الأساسية

أساسيات نظام التصميم

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

دليل الخط

يحدد تسلسلًا هرميًا واضحًا ويحسن قابلية القراءة عبر جميع الواجهات.

نظام الألوان

يحقق الانسجام البصري ويجسد الهوية الرقمية لإمارة الشارقة عبر جميع المنتجات الرقمية.

الأيقونات

توفر رموزًا بصرية واضحة وعصرية تعزز فهم المحتوى وتوجه المستخدمين نحو تنفيذ الإجراءات بسهولة.

تخطيط الواجهات والمسافات

يرسخ هيكلًا بصريًا متوازنًا يضمن عرض المحتوى بوضوح وتنظيم، ويسهل متابعته.

الحقول والمدخلات

توحد عناصر النماذج لضمان إدخال البيانات بسهولة ووضوح، مع الالتزام بمعايير إمكانية الوصول.

الأزرار

توفر إجراءات واضحة وتساعد المستخدمين على إنجاز المهام بسهولة واتساق.

إمكانية الوصول

تضمن أن يكون كل تصميم قابلًا للاستخدام وشاملًا لجميع الأفراد، بغض النظر عن قدراتهم.

التصميم المتجاوب

يتكيف بسلاسة مع أحجام الشاشات المختلفة، مما يضمن تجربة سلسة ومتسقة عبر جميع الأجهزة.

تصميم المحتوى

يقدم المحتوى بصورة واضحة وموجزة ومنظمة، بما يساعد المستخدمين على فهم المعلومات وإنجاز مهامهم بسهولة.

مقدمة

نظرة عامة على مكونات واجهة المستخدم

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

رأس الصفحة

شريط تنقل مرن ومتجاوب لبنية موقع سريعة ومتسقة.

مسار التنقل

مساعد تنقل يعزز الوضوح عبر الصفحات متعددة المستويات.

الشريط الثابت

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

التذييل

مكون تذييل منظم يوفر روابط ومعلومات أساسية بتنسيق موحد.

اللافتات

عناصر اللافتات المختلفة للمحتوى.

المحتوى

مكونات وعناصر محتوى منظمة مصممة لمعلومات واضحة وقابلة للقراءة وسهلة الوصول.

البطاقات

مكونات بطاقة معيارية تعرض المعلومات بوضوح وبشكل متسق.

الخدمات

مجموعة من الأقسام تعرض بطريقة مرنة وقابلة للتوسع لتنظيم الخدمات الحكومية.

الفلاتر

أدوات تصفية فعالة تنظم مجموعات البيانات الكبيرة إلى نتائج واضحة وقابلة للإدارة.

الأسئلة الشائعة

أنماط الأسئلة الشائعة القابلة للتوسيع التي تساعد المستخدمين في العثور على الإجابات بسرعة وبأقل جهد.

عارض الوسائط

عنصر أساسي في جميع الصفحات الرئيسية لعرض الوسائط وتعزيز السرد القصصي عبر جميع الأجهزة.

معرض الوسائط

تصميم مسبق التجهيز لعرض وتنظيم الصور والوسائط بكفاءة عبر الصفحات.

ترقيم الصفحات

أداة تتيح التنقّل بين صفحات المحتوى بسهولة وسرعة.

الجداول

قوالب جاهزة لترتيب البيانات بوضوح وكفاءة.

زر التبديل

تنويع بارز حيث يتم تمييز المحتوى النشط بقوالب مختلفة.

الشارات

مكونات شارات مدمجة تُستخدم لتسليط الضوء على الحالة والفئات والمؤشرات الرئيسية.

مؤشر الخطوات

أنماط متعددة الخطوات متسقة تساعد المستخدمين على تتبع التقدم بفاعلية.

الإحصائيات

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

القوالب

قوالب جاهزة للاستخدام

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