أسهل طريقة تخلي واجهة تطبيقك تبيّن هواة: أيقونات من خمس مكتبات مختلفة. وحدة سميكة، وحدة رفيعة، وحدة مصرّفة، ووحدة فيها تفاصيل ما تنشاف بحجم صغير. المشكلة مو جمالية بس — الاتساق يقلل وقت فهم المستخدم للشاشة.
اختر نمط واحد لكل الواجهة: خطي (outline) أو معبأ (filled). لا تخلط بينهم إلا لتمييز حالة محددة، مثل العنصر المختار في القائمة السفلية. إذا احتجت نمطين، خلّي القاعدة معروفة للفريق: \"معبأ = مفعّل، خطي = غير مفعّل\".
ثلاثة مقاسات تكفي: 16 بكسل للعناصر الصغيرة، 24 للشريط العلوي والقوائم، 32 للمساحات الأكبر. لا تستخدم أيقونة 16 مكبرة إلى 32 — الخطوط تطلع مشرشرة. استخدم ملف SVG وصمم المقاس الأصلي صح.
أول خطأ: الاعتماد على الأيقونة وحدها بدون نص. أيقونة \"مشاركة\" أو \"حفظ\" مو واضحة للجميع — النص يحل الالتباس في ثانية. الثاني: أيقونات ملونة بلا داعٍ في واجهة رمادية. الثالث: تجاهل الوضع الليلي، فتنقلب الأيقونات السوداء لغير مرئية.
نقطة يغفلها البعض: حق النص البديل (alt text) والوصف للقارئ الشاشي. أيقونة بلا وصف تعني زر مغلق بالنسبة لمستخدم قارئ الشاشي. في Q8DM نعتبر هالتفاصيل جزء من التصميم وليست إضافة لاحقة.
الاتساق ما يصير مرة واحدة، هو عادة. أنشئ مجلد واحد اسمه \"أيقونات المشروع\" وفيه الملفات المعتمدة فقط — أي أيقونة جديدة تدخله لازم تمر على مراجعة. هالمجلد يصير المرجع الوحيد، وأي مصمم جديد يفتحه ويعرف القاعدة بدون شرح طويل.
وحّد التسمية كمان: أسماء واضحة مثل user-profile و trash-delete أفضل من icon-1 و icon-2. الفايدة تظهر بعد ست أشهر لما تدور على أيقونة معينة بين مئة ملف.
خذ الشاشة الرئيسية وحط الأيقونات جنب بعض بحجم 24 بكسل. إذا وحدة منهم تبيّن أثقل أو أفتح من الثانية، أو إذا احتجت تقرّب عينك عشان تفهم شنو ترسم — عندك مشكلة اتساق. الاختبار هذا يكشف أكثر مما تكشفه مراجعة ملفات التصميم.
الاتساق في الأيقونات مو تفصيل جمالي، هو شكل من أشكال الوضوح. حدد نمط واحد، شبكة واحدة، وسماكة واحدة، وطبّقها. شركة Q8DM تقدم برمجة وتصميم وتدريب في الكويت منذ 1998، وتصميم واجهات الاستخدام من صميم شغلنا.
وإذا تستخدم مكتبة أيقونات جاهزة، لا تعدّل عليها بيدك بدون سبب — كل تعديل يدوي يخلق أيقونة شاذة تحتاج تذكرها بعد سنة. الأفضل تختار مكتبة قريبة من ذوقك من البداية وتلتزم فيها.
واحفظ الأيقونات بصيغة SVG مو PNG. الملف الواحد يشتغل بكل المقاسات وبلون واحد، وبالتالي تختفي مشكلة النسخ المتعددة للأيقونة نفسها.
وأخيراً، اعمل صفحة داخلية واحدة فيها كل الأيقونات المعتمدة — المرجع السريع للفريق والمطور.
تبي مراجعة تصميم واجهتك؟ تواصل معنا على q8dm.com.