التصميم
صورة تُفهَم بسرعة
إن احتاجت أيقونة تسمية لتُفهَم، فهي لا تؤدّي عملها.
نصمّم أيقونات بسيطة ومتّسقة ومؤسّسة على استعارات مألوفة، فيصل معناها فوراً, ونقرنها بتسميات حيث يهمّ الوضوح أكثر.
أيقونات تتواصل فوراً
مقروءة فوراً
المعنى واضح قبل أن يفكّر المستخدم.
متّسقة بصرياً
وزنٌ وأسلوبٌ واحد عبر المجموعة كلها.
مُسمّاة عند الحاجة
مقرونة بالكلمات حيث قد ينزلق المعنى.
الاختبار
أيقونةٌ لا يفهمها أحد مجرّد زينة
إن احتاجت تعليقاً لتُقرأ فهي لا تؤدّي عملها.
تَعِد الأيقونات بالتواصل أسرع من الكلمات, لكن فقط حين يكون معناها بديهياً. رمزٌ ذكيّ يضطر المستخدمون لفكّه يضيف لغزاً لكل شاشة يظهر فيها.
نصمّم الأيقونات حول استعاراتٍ مألوفة، ونبقيها متّسقة بصرياً، ونقرنها بتسمية حيث قد ينزلق المعنى, الوضوح أولاً، والذكاء فقط حين يكون واضحاً أيضاً.
أبرز النقاط
ما يجعلها تعمل
بسيطة
فكرة واحدة واضحة لكل أيقونة.
متّسقة
أسلوب واحد عبر المجموعة.
مألوفة
استعارات يعرفها الناس.
نظرة أقرب
الأيقونة كلمة بخط صغير جداً
تفشل الأيقونات بصمت: لا أحد يفتح بلاغاً يقول إنه لم يفهم الرمز، بل ببساطة لا ينقر. لهذا نختبر الأيقونات كما نختبر النصوص, نعرضها مجردةً على شخص من خارج المشروع ونسأله: ماذا تتوقع أن يفعل هذا الزر؟
الغموض يُحل بالاقتران لا بالذكاء. خارج دستةٍ من الرموز العالمية, البحث، الإغلاق، الإعدادات، الرجوع, ينبغي أن تسافر الأيقونة مع تسمية مكتوبة حتى تثبت التحليلات أن التسمية زائدة. القوائم الغامضة توفر بكسلات وتكلف إنجاز المهام.
الاتساق شبكة بالمعنى الحرفي: هندسة واحدة، وسماكة خط واحدة، ونصف قطر زوايا واحد، بمحاذاة شبكة البكسل كي لا يتشوش شيء عند ١٦ بكسلاً. أيقونة واحدة مرسومة على هيكل مختلف تُقرأ كخطأ إملائي في جملة يمسحها المستخدمون مئات المرات يومياً.
نبني برمجيات لفرق تريد أدواتها أن تناسب طريقة عملها الفعلية — الويب والموبايل والذكاء الاصطناعي والأنظمة التي تربطها. نكتب هنا عمّا نتعلّمه أثناء إطلاقها.