#مربع_ضوء
اعداد @casket_nahari
الايقونات هي واحدة من أهم أجزاء واجهة المستخدم. إنها لغة مرئية تمثل الأوامر والمحتوى وتكشف المعنى الكامن وراء الوظائف.
بناءً على كيفية تصميمك واستخدامك للأيقونات في منتجك ، يمكنك إضفاء طابع التفرد على العلامة التجارية.
اعداد @casket_nahari
الايقونات هي واحدة من أهم أجزاء واجهة المستخدم. إنها لغة مرئية تمثل الأوامر والمحتوى وتكشف المعنى الكامن وراء الوظائف.
بناءً على كيفية تصميمك واستخدامك للأيقونات في منتجك ، يمكنك إضفاء طابع التفرد على العلامة التجارية.
في هذه السلسلة .. نصائح لمساعدتك في تصميم أيقونات أفضل :
1- قم باعداد شبكة
لن تنشئ أبدًا رمزًا واحدًا فقط. أنت دائما تصمم مجموعة. لتوحيد قوالب الايقونات ، سوف تحتاج إلى شبكة.
حدد المنطقة الآمنة وحدد خطوط العمل. استخدم شبكة ناتجة كقالب لترسيخ جميع نسب الايقونة الخاصة بك وأحجامها.
1- قم باعداد شبكة
لن تنشئ أبدًا رمزًا واحدًا فقط. أنت دائما تصمم مجموعة. لتوحيد قوالب الايقونات ، سوف تحتاج إلى شبكة.
حدد المنطقة الآمنة وحدد خطوط العمل. استخدم شبكة ناتجة كقالب لترسيخ جميع نسب الايقونة الخاصة بك وأحجامها.
2- اجعلها متناسقة
استخدم نفس عرض الخط ونصف قطر الزاوية ونمط التعبئة عند تصميم مجموعتك. سيضمن ذلك أن تبدو الرموز الخاصة بك موحدة ويمكن التعرف عليها بشكل أكبر.
استخدم نفس عرض الخط ونصف قطر الزاوية ونمط التعبئة عند تصميم مجموعتك. سيضمن ذلك أن تبدو الرموز الخاصة بك موحدة ويمكن التعرف عليها بشكل أكبر.
3- اجعلها اكثر وضوحاً
الأقل هو الأكثر في تصميم الأيقونات ( LESS IS MORE ).
استخدم استعارات واضحة بنفس القدر من التفاصيل لتسهيل التعرف على كل رمز وفهمه.
الأقل هو الأكثر في تصميم الأيقونات ( LESS IS MORE ).
استخدم استعارات واضحة بنفس القدر من التفاصيل لتسهيل التعرف على كل رمز وفهمه.
4- استخدم مسافات متساوية
استخدم نفس القدر من المساحة بين عناصر الايقونة لجعل مجموعتك تبدو متناغمة.
يمكنك حساب المسافة بين خطوط المتجه بالضغط على مفتاح ALT في Figma أو Sketch أو XD.
استخدم نفس القدر من المساحة بين عناصر الايقونة لجعل مجموعتك تبدو متناغمة.
يمكنك حساب المسافة بين خطوط المتجه بالضغط على مفتاح ALT في Figma أو Sketch أو XD.
5- التصحيح البصري
قم بمحاذاة عناصر الايقونة بناءًا على المركز البصري و قم بموازنة الأبعاد حسب الكتله .
قم بمحاذاة عناصر الايقونة بناءًا على المركز البصري و قم بموازنة الأبعاد حسب الكتله .
6- املأ الفراغات
قم بتدوير الأيقونات الرفيعة واستخدم المساحة الحاوية بالكامل للحصول على ايقونه أفضل.
قم بتدوير الأيقونات الرفيعة واستخدم المساحة الحاوية بالكامل للحصول على ايقونه أفضل.
7-اجمع بين الأنماط
استخدم أنماط التعبئة والتفريغ لوصف حالة الزر ومساعدة المستخدم على معرفة الواجهة التي هو فيها واتخاذ الخطوة الصحيحة .
المصدر : blog.prototypr.io
استخدم أنماط التعبئة والتفريغ لوصف حالة الزر ومساعدة المستخدم على معرفة الواجهة التي هو فيها واتخاذ الخطوة الصحيحة .
المصدر : blog.prototypr.io
جاري تحميل الاقتراحات...