الظلال Shadows
من أهم الأمور التي يجب التركيز عليها عند تصميم واجهة المستخدم Ui و
عند برمجه صفحات الويب front end.
في هذا الثريد سوف أشارك معكم طريقة سهله و احترافية لعمل ظل shadow مثل
المحترفين 🧙🏻♂️
👇🏻
من أهم الأمور التي يجب التركيز عليها عند تصميم واجهة المستخدم Ui و
عند برمجه صفحات الويب front end.
في هذا الثريد سوف أشارك معكم طريقة سهله و احترافية لعمل ظل shadow مثل
المحترفين 🧙🏻♂️
👇🏻
من أجل تصميم ظل إحترافي يجب التركيز على ثلاث نقاط أساسية.
✴ مكان الظل.
يتم تعديل اتجاة الظل عمودي و أفقي
حسب الحاجة
في أغلب الوقت إستخدام القيم التاليه
عمودي 8px
أفقي 0px
يفي بالغرض 😇
الصوره تحت توضح كيف شكل
الظل قبل و بعد إستخدام القاعده 🧙🏻♂️
✴ مكان الظل.
يتم تعديل اتجاة الظل عمودي و أفقي
حسب الحاجة
في أغلب الوقت إستخدام القيم التاليه
عمودي 8px
أفقي 0px
يفي بالغرض 😇
الصوره تحت توضح كيف شكل
الظل قبل و بعد إستخدام القاعده 🧙🏻♂️
✴ درجه شفافية اللون
من المهم التعديل على درجة الشفافية
أفضل قيم بين (%10 - %30)
✴ ضبابية (blur) الظل.
يفضل إستخدام قيمه بين
(40px - 16px)
👇🏻
من المهم التعديل على درجة الشفافية
أفضل قيم بين (%10 - %30)
✴ ضبابية (blur) الظل.
يفضل إستخدام قيمه بين
(40px - 16px)
👇🏻
مثال أخير
يقارن عندما
تستخدم القواعد ( التي ذكرتها فوق)
و بدون إستخدام القواعد
الصور تحت
المقارنة واضحة و تمثل أهميه
إتباع القواعد فوق 😂
👇🏻
يقارن عندما
تستخدم القواعد ( التي ذكرتها فوق)
و بدون إستخدام القواعد
الصور تحت
المقارنة واضحة و تمثل أهميه
إتباع القواعد فوق 😂
👇🏻
نلتقي في ثريد أخر 😇
إذا أعجبك الثريد لا تنسى تعمل
ريتويت عشان
يستفيد اكبر عدد من الناس 😊
تابع حسابي @naif4web
لجديد المقالات و النصائح
في مجال البرمجة و تصميم الويب
إذا أعجبك الثريد لا تنسى تعمل
ريتويت عشان
يستفيد اكبر عدد من الناس 😊
تابع حسابي @naif4web
لجديد المقالات و النصائح
في مجال البرمجة و تصميم الويب
جاري تحميل الاقتراحات...