التصميم · آخر تحديث · 2026-09-02

تصميم أيقونات التطبيقات: ما الذي يجعلها تُعرف بنظرة واحدة

من أين تأتي «التعرف بنظرة واحدة»: رمز واحد، والفراغ بوصفه بنية، وتقاسم العمل مع النظام، وضبط النفس في اللون — Apple وGoogle ترويان الحكاية نفسها.

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

قوة الرمز الواحد

التعرف يبدأ من «الأقل». الأيقونات التي تصمد لا يكون فيها تقريبًا سوى بطل واحد: أثر مخلب واحد، حلقة واحدة، حرف واحد. ما إن تتكاثر الرموز حتى تدفع الأيقونات بعضها بعضًا على الشاشة، وكل تفصيلة زائدة تُميّع الذكرى. اضغط جوهر المنتج أولًا في عنصر واحد، ثم ارسمه بأقل عدد ممكن من الأشكال.

أشكال كبيرة، وخطوط سميكة. تُرى الأيقونة في الغالب عند نحو أربعين بكسلًا؛ عند هذا الحجم تختفي الخطوط الرفيعة، وتنتفخ الزوايا الحادة، وتتفتت الإطارات الخطية إلى ضجيج — بينما تحتفظ الأشكال المملوءة بلون صلب بظلّها الخارجي. ترتيب فحص عملي: انظر أولًا إن كانت تقف عند 48px، ثم كبّر وأضف التفاصيل. ارسم بالمتجه كلما استطعت (SVG/PDF مع تحويل النصوص إلى مسارات): كبّر وصغّر كيف شئت، فلن يخونك الظل الخارجي.

الفراغ بنية

الشكل النهائي للأيقونة لا يقرره المصمم: النظام سيقنّعها دائرةً ومربعًا ذا زوايا دائرية، أحيانًا شكلًا خاصًا بالشركة المصنعة. لذا فالفراغ ليس تفضيلًا جماليًا، بل ضرورة بنيوية. أرقام Google تمنح أصدق مرجع: اللوحة 108dp، والحلقة الخارجية 18dp محجوزة منذ البداية للأقنعة وحركة المنظور، ويجب أن يتسع العنصر في منطقة الأمان المركزية 66dp. وبالحساب، لا يشغل العنصر سوى نحو 60% من وسط اللوحة. تعيد Apple الصياغة بصورة مختلفة لكنها تطلب الشيء نفسه: عنصر في المنتصف، خارج متناول أي قناع.

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

النظام هو المصمم الثاني

الأيقونة الحديثة عمل نصف منجز. بعد التسليم، يواصل النظام الرسم: الزوايا يقصّها النظام، والظلال يضيفها النظام، وLiquid Glass في iOS يتراكب فوقها لمعانًا مرآويًا وانكسارًا. مهمة المصمم أن يجهّز سطح عمل جيدًا لهذا «المصمم الثاني»: مادة ممتدة بكامل اللوحة، حواف نظيفة، طبقة مقدمة بظل خارجي حاد غير مموّه — كي يجد لمعان النظام وظلاله موضع هبوط.

العمق يتبع المنطق ذاته: لا تتظاهر به بالتأثيرات، بل احتفظ له بالبنية. داخل طبقة المقدمة، افصل الأمام عن الخلف بفروق الشفافية (أيقونة Photos من Apple هي الحالة التي تدرَّس في الكتب)، أو اترك الأشكال الصلبة تتراكب فيظهر العمق وحده. اللمعان والظلال الذين ترسمهما بنفسك ساكنون، وسيتصارعون إلى الأبد مع الضوء الديناميكي للنظام.

ضبط اللون وإطلاقه

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

يُختبر اللون اختبارًا حقيقيًا في نسخ المظهر. يقدّم iOS أشكال شاشة داكنة وشفافة ومصبوغة، وبين النسخ لا ينبغي أن يتغير سوى الجو اللوني — العناصر لا تتغير أبدًا. إن لم يعد المستخدم يتعرف عليك في اللحظة التي يبدّل فيها المظهر، فقد ضاع كل تصميم سابق. أيقونات Android الموضوعية تدفع هذا الاختبار إلى أقصاه: يسحب النظام ألوانك ولا يبقي سوى طبقة أحادية يعيد صبغها بلون الخلفية — لذا يجب أن يقف الظل الخارجي وحدَه دون أي لون.

اعتزال النص

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

العودة إلى تلك النظرة الواحدة

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

المراجع

تم التحقق في 2026-09-02

العودة إلى القائمة