- 91
- 1 545 722
Safaa Saeed
United States
เข้าร่วมเมื่อ 29 ก.ค. 2020
UI UX Designer - Frontend Developer
effect style shadow blur backdrop blur in figma
في فيديو النهاردة هنتكلم عن الـ "Effect Style"
في Figma هو عبارة عن ميزة تسمح لك بإضافة تأثيرات مختلفة على العناصر في تصميمك، زي الـ shadow & blur & backdrop Blur وغيرها.
بتقدر تضيف التأثير ده لأي عنصر في التصميم عن طريق الذهاب لقائمة "Effects" في لوحة الخصائص واختيار التأثير اللي تريده وتعديل إعداداته على حسب الشكل اللي تريده . الـ"Effect Style" دي بتدي للعناصر شكل مميز وتفاعلي يزيد من جاذبيتها ويخلي التصميم أكتر حيوية.
ملف فيجما
www.figma.com/community/file/1464633712182326405/effect-style
______________________________________
✰ محتوي الفيديو ✰
مقدمة 00:00
تعريف الـ effect style 00:12
أهمية الـ effect style 00:21
أنواع الـ effect style 00:37
استخدامات الـ Blur 00:46
استخدامات الـ shadow 01:03
استخدامات الـ backdrop Blur 01:08
الفرق بين backdrop & Blur 01:13
أرقام الـ shadow 01:45
عمل استايل للـ shadow 06:31
أرقام الـ Blur 08:09
عمل استايل للـ Blur 09:14
أرقام الـ backdrop Blur 10:41
عمل استايل للـ backdrop Blur 12:05
تجربة التأثيرات 13:33
الفيديو القادم 15:11
______________________________________
انضموا للجروب فيجما 🎉
t.me/+aR3VTdRTgpdkNGVk
قناتي في التليجرام
t.me/safaauiux
يسعدني سماع أفكاركم واقتراحاتكم وأسئلتكم
لا تتردد في ترك تعليق أدنى الفيديو 💖
شكرا لك على المشاهده , فعّل زر التنبيهات ( 🔔 ) لحتى توصلك الفيديوهات الجديده على طول و بأسرع وقت!
safaa.uiux
x.com/safaauiux
في Figma هو عبارة عن ميزة تسمح لك بإضافة تأثيرات مختلفة على العناصر في تصميمك، زي الـ shadow & blur & backdrop Blur وغيرها.
بتقدر تضيف التأثير ده لأي عنصر في التصميم عن طريق الذهاب لقائمة "Effects" في لوحة الخصائص واختيار التأثير اللي تريده وتعديل إعداداته على حسب الشكل اللي تريده . الـ"Effect Style" دي بتدي للعناصر شكل مميز وتفاعلي يزيد من جاذبيتها ويخلي التصميم أكتر حيوية.
ملف فيجما
www.figma.com/community/file/1464633712182326405/effect-style
______________________________________
✰ محتوي الفيديو ✰
مقدمة 00:00
تعريف الـ effect style 00:12
أهمية الـ effect style 00:21
أنواع الـ effect style 00:37
استخدامات الـ Blur 00:46
استخدامات الـ shadow 01:03
استخدامات الـ backdrop Blur 01:08
الفرق بين backdrop & Blur 01:13
أرقام الـ shadow 01:45
عمل استايل للـ shadow 06:31
أرقام الـ Blur 08:09
عمل استايل للـ Blur 09:14
أرقام الـ backdrop Blur 10:41
عمل استايل للـ backdrop Blur 12:05
تجربة التأثيرات 13:33
الفيديو القادم 15:11
______________________________________
انضموا للجروب فيجما 🎉
t.me/+aR3VTdRTgpdkNGVk
قناتي في التليجرام
t.me/safaauiux
يسعدني سماع أفكاركم واقتراحاتكم وأسئلتكم
لا تتردد في ترك تعليق أدنى الفيديو 💖
شكرا لك على المشاهده , فعّل زر التنبيهات ( 🔔 ) لحتى توصلك الفيديوهات الجديده على طول و بأسرع وقت!
safaa.uiux
x.com/safaauiux
มุมมอง: 101
วีดีโอ
grid style figma for beginners
มุมมอง 29214 วันที่ผ่านมา
الـ Layout grids بتعني الشبكات التصميمية. دي بتستخدم في تقسيم المساحة الخاصة بالتصميمات إلى أجزاء متساوية، زي أعمدة وفجوات وهوامش. الشبكة دي بتساعد على وضع العناصر بتنظيم وتناسق على الصفحة. في البداية، الـ Layout grids كانت بتستخدم في تصميمات الطباعة، عشان يتم تحديد مكان النصوص والصور. ولكن دلوقتي بقت مهمة جدًا في تصميم الويب، خصوصًا مع التطورات الجديدة في تصميم المواقع وضرورة التكيف مع شاشات م...
How to create figma pro account free
มุมมอง 800หลายเดือนก่อน
في هذا الفيديو هنتعرف كيفية الحصول على حساب فيجما برو مجاناً 🔥 خطة فيجما للطلاب www.figma.com/pricing/ لينك كورسيرا www.coursera.org/learn/ux-design-jobs شهادة ux drive.google.com/file/d/1xO8fCsm3cxOWfpuDXr2F8PImT66GiItX/view سبب الانضمام I am applying for a free Figma Education plan to enhance my design skills and knowledge through access to Figma's advanced features. انضموا للجروب فيجما 🎉 t.m...
The art of choosing colors and creating a color style in Figma for beginners
มุมมอง 701หลายเดือนก่อน
في فيديو النهاردة سنتناول خطوة بخطوة كيفية اختيار الألوان المناسبة لمشاريع التصميم وكيفية تطبيق مبادئ التوازن والتناغم البصري. كما سنقدم نصائح وإرشادات عملية للمبتدئين لإنشاء نظام Color Style يوفر توحيدًا وتنسيقًا لألوان مشاريعهم. محتوى الفيديو : مقدمة 00:00 1- فهم معاني الألوان 00:53 2- عمل تغذية بصرية 01:45 3- عمل مود بورد 02:21 4- تجربة الألوان اللي اخترتها 03:11 موقع palettemaker 03:25 موقع...
Text Styles in Figma
มุมมอง 302หลายเดือนก่อน
في فيديو النهاردة هنتكلم عن Typography وText Style في فيجما . ملف فيجما t.me/safaauiux/53 محتوى الفيديو: مقدمة 00:00 اختيار الخط 00:15 أوزان الخط 00:37 عمل أحجام مختلفة للخط 01:06 التسمية 01:47 اختيار أوزان الخط 02:41 ارتفاع الخط 03:10 شرح TailwindCSS 04:08 عمل Text style 04:43 عمل Typography Style guide 10:44 تجربة Responsive Typography 11:20 نسخ Text style لمشاريع أخرى 14:48 انضموا للجروب فيج...
دليل شامل: كيف تبدأ مشروع UI/UX من الصفر خطوة بخطوة | (فيديو مهم)
มุมมอง 3.8K2 หลายเดือนก่อน
مرحبًا بكم في هذا الدليل الشامل حول كيفية بدء مشروع UI/UX من الصفر! ستتعلم في هذا الفيديو خطوة بخطوة كيفية البدء في تطوير تجربة المستخدم وتصميم الواجهة بشكل فعال واحترافي. محتوى الفيديو : مقدمة 00:00 أسئلة للعميل 00:15 دراسة حالة 02:25 المتطلبات 03:26 مراحل تنفيذ للمشروع 03:45 الجدول الزمني للمشروع 04:12 البحث 04:36 المقابلات 05:17 الاستبيان 06:09 تحليل المنافسين 07:32 التحليل 10:09 خريطة التعا...
How to Prototype in Figma: Smart Animate, Prototyping and Scrolls (Tutorial)
มุมมอง 6703 หลายเดือนก่อน
في هذا الفيديو، ستتعرف على أساسيات Prototyping في فيجما وكيفية استخدامها في تصميم التطبيقات بشكل فعال. ملف فيجما t.me/safaauiux/49 محتوى الفيديو: مقدمة 00:00 تعريف البروتوتايبنج 00:34 After Delay - navigate to 02:18 Scroll behavior 06:10 Open overlay 11:15 إعدادات الـ prototype 13:08 حذف الـ prototype 14:27 انضموا للجروب فيجما 🎉 t.me/ aR3VTdRTgpdkNGVk قناتي في التليجرام t.me/safaauiux يسعدني سم...
List of Cards and Master Component Properties in Figma: Text, Boolean, and Instance Properties
มุมมอง 5083 หลายเดือนก่อน
في الفيديو ده هنشرح بطريقة سهلة وبسيطة إزاي تستخدم الـvariants في فيجما لعمل تغييرات على بطاقات التصميم. هنتعلم مع بعض إزاي نقدر نعمل نسخ متغيرة لنفس البطاقة بدون ما نعمل تصميم جديد كل مرة. هنشوف إزاي نغير الألوان والأشكال ونجرب تصاميم مختلفة بكل سهولة. إذا كنت مبتدئ في هذا المجال، متقلقش، الشرح هيكون بسيط ومفهوم. محتوى الفيديو: مقدمة - 00:00 تعريف الـ variants 00:24 عمل البطاقة الأساسية 02:10 ...
كيفية التحديث إلى واجهة الجديدة في دقيقة | Figma ui3
มุมมอง 5865 หลายเดือนก่อน
في هذا الفيديو القصير الذي يستغرق دقيقة واحدة، سوف تتعلم كيفية التحديث إلى واجهة المستخدم الجديدة UI3 في Figma بخطوة بسيطة وسريعة. Enable UI3 Beta for Figma chromewebstore.google.com/detail/enable-ui3-beta-for-figma/gdjldebhilhckhblmhklofdebemiahhi انضموا للجروب الخاص بفيجما 🎉 t.me/ aR3VTdRTgpdkNGVk قناتي في التليجرام t.me/safaauiux يسعدني سماع أفكاركم واقتراحاتكم وأسئلتكم لا تتردد في ترك تعليق...
Learn about Components Properties | Figma tutorial
มุมมอง 5757 หลายเดือนก่อน
النهاردة هنشرحلكم خصائص المكونات في Figma، بطريقة سهلة. 😍👋 عاوز تعرف إيه المكونات؟ هو ببساطة هما عبارة عن أجزاء بنصممها مرة واحدة ونقدر نستخدمها في أكتر من مكان في التصميم بتاعنا. والحلو في الموضوع إن لما نغير في المكونة دي من مكان واحد، كل الأماكن اللي استخدمناها فيها هتتغير تلقائي! ده بيوفرلنا وقت كتير وكمان بيساعدنا نبقى أكثر انتاجية في التصميم 💛🥰 محتوى الفيديو: تعريف الكومبونت - 0:00 آليه ع...
constraints in figma
มุมมอง 4838 หลายเดือนก่อน
في Figma، تعتبر Constraints (القيود) أحد المفاهيم الأساسية في تصميم واجهة المستخدم المتجاوبة. تساعد القيود على تحديد سلوك العناصر وتحديد كيفية تغير حجمها وموقعها بناءً على حجم الشاشة أو العنصر الأصلي. انضموا للجروب الخاص بواجبات ومشروعات فيجما 🎉 t.me/ aR3VTdRTgpdkNGVk قناتي في التليجرام t.me/safaauiux يسعدني سماع أفكاركم واقتراحاتكم وأسئلتكم لا تتردد في ترك تعليق أدنى الفيديو 💖 شكرا لك على المش...
Responsive Website In Figma
มุมมอง 1K9 หลายเดือนก่อน
هنشرح في الفيديو ده إزاي تقدر تستخدم الأداة Auto layout عشان نصمم موقع على الإنترنت يتكيف مع كل الشاشات. المقدمة 00:00 تصميم الموقع 00:09 عمل الريسبونسف 11:26 الفيديو القادم 19:09 انضموا للجروب الخاص بواجبات ومشروعات فيجما 🎉 t.me/ aR3VTdRTgpdkNGVk قناتي في التليجرام t.me/safaauiux يسعدني سماع أفكاركم واقتراحاتكم وأسئلتكم لا تتردد في ترك تعليق أدنى الفيديو 💖 شكرا لك على المشاهده , فعّل زر التنبي...
responsive cards design in figma
มุมมอง 7009 หลายเดือนก่อน
في الفيديو دا هنتعرف على كيفية تصميم كارت استجابة في فيجما، أحد الأدوات الشهيرة لتصميم واجهات المستخدم. ستمكننا فيجما من إنشاء تصميم مرئي متجاوب يتكيف مع مقاسات الشاشات المختلفة بسهولة وفعالية. انضموا للجروب الخاص بواجبات ومشروعات فيجما 🎉 t.me/ aR3VTdRTgpdkNGVk يسعدني سماع أفكاركم واقتراحاتكم وأسئلتكم لا تتردد في ترك تعليق أدنى الفيديو 💖 شكرا لك على المشاهده , فعّل زر التنبيهات ( 🔔 ) لحتى توصلك...
شرح الـ Min Max Width والـ Min Max Height في فيجما الجزء الثاث | كورس فيجما الدرس 17 ✰
มุมมอง 5499 หลายเดือนก่อน
شرح الـ Min Max Width والـ Min Max Height في فيجما الجزء الثاث | كورس فيجما الدرس 17 ✰
كل حاجة عن FILL CONTAINER, HUG CONTENTS and FIXED WIDTH الجزء الثاني | كورس فيجما الدرس 16 ✰
มุมมอง 6779 หลายเดือนก่อน
كل حاجة عن FILL CONTAINER, HUG CONTENTS and FIXED WIDTH الجزء الثاني | كورس فيجما الدرس 16 ✰
شرح الـ Auto Layout للمبتدئين الجزء الأول | كورس فيجما الدرس 15 ✰
มุมมอง 1.1K10 หลายเดือนก่อน
شرح الـ Auto Layout للمبتدئين الجزء الأول | كورس فيجما الدرس 15 ✰
Top 10 Plugins for Figma | Figma course, lesson 14 ✰
มุมมอง 31411 หลายเดือนก่อน
Top 10 Plugins for Figma | Figma course, lesson 14 ✰
كيفية إضافة خطوط إلي فيجما | كورس فيجما الدرس 13 ✰
มุมมอง 2.9K11 หลายเดือนก่อน
كيفية إضافة خطوط إلي فيجما | كورس فيجما الدرس 13 ✰
الكتابة في فيجما | كورس فيجما الدرس 12 ✰
มุมมอง 51511 หลายเดือนก่อน
الكتابة في فيجما | كورس فيجما الدرس 12 ✰
شرح الPEN TOOL و pencil tool في فيجما | كورس فيجما الدرس 11 ✰
มุมมอง 69511 หลายเดือนก่อน
شرح الPEN TOOL و pencil tool في فيجما | كورس فيجما الدرس 11 ✰
الواجب الاول تصميم شاشة تسجيل دخول تطبيق ملابس | كورس فيجما الدرس 10 ✰
มุมมอง 2K11 หลายเดือนก่อน
الواجب الاول تصميم شاشة تسجيل دخول تطبيق ملابس | كورس فيجما الدرس 10 ✰
شرح الأشكال والألوان في فيجما | كورس فيجما الدرس 9 ✰
มุมมอง 1.1K11 หลายเดือนก่อน
شرح الأشكال والألوان في فيجما | كورس فيجما الدرس 9 ✰
شرح الـ frame وsection وslice | كورس فيجما الدرس 8 ✰
มุมมอง 1.1K11 หลายเดือนก่อน
شرح الـ frame وsection وslice | كورس فيجما الدرس 8 ✰
شرح أداة الـ move tool و scal | كورس فيجما الدرس 7 ✰
มุมมอง 1.1K11 หลายเดือนก่อน
شرح أداة الـ move tool و scal | كورس فيجما الدرس 7 ✰
شرح واجهة فيجما | كورس فيجما الدرس 6 ✰
มุมมอง 1.6K11 หลายเดือนก่อน
شرح واجهة فيجما | كورس فيجما الدرس 6 ✰
تفعيل وضع دارك مود في فيجـما | كورس فيجما الدرس 5 ✰
มุมมอง 1.1K11 หลายเดือนก่อน
تفعيل وضع دارك مود في فيجـما | كورس فيجما الدرس 5 ✰
تنزيل فيجما علي desktop | كورس فيجما الدرس 4 ✰
มุมมอง 1.3K11 หลายเดือนก่อน
تنزيل فيجما علي desktop | كورس فيجما الدرس 4 ✰
كيفية الحصول على Figma Pro مجانًا لا توجد بطاقة ائتمان 3 ✰
มุมมอง 4.9Kปีที่แล้ว
كيفية الحصول على Figma Pro مجانًا لا توجد بطاقة ائتمان 3 ✰
ابدأ رحلتك في التصميم مع فيجما 2024 | مقدمة 1 ✰
มุมมอง 4.9Kปีที่แล้ว
ابدأ رحلتك في التصميم مع فيجما 2024 | مقدمة 1 ✰
عاااش ❤
الإبداع في كلمة ❤
عاااااش ❤
اتمني تكملي ومتتغيريش مع الوقت ❤
هاذ الدروس المجانية المفصلة تقريبا انقضرت من اليوتيوب كلها فيديوهات قصيرة هدفها المشاهدات اكثر منها تعليمية شكرا على الجهد الذي تقومين به الاخت صفاء
شكرا لمجهودك الرائع 💕
الله يسعد قلبك سعادة ليس بعدها شقاء🤍🤍
thanks
هل كل الى معي بالفريق يستعملونه مجاني ؟او خصم ؟
ربنا يكرمك ويوفقك يارب أفضل من شرح بالعربي بضمير في ال ui & ux ✌✌🤝🤝
الموسيقى لاتجوز
ألوانك المستعملة في السلسلة جميلة هل ممكن تعطيني الكود بتاعها ؟
شكراااااً على المحتوى الهادف والصادق ❤❤❤
حقيقي اشطر من ناس كتير مشهورة بجد ❤
شكرا كتير, تسلم ايدك و الله يجزيكي الخير يا رب
الله يعطيك العافية ويوفقك يا أختي يارب كل اللي تتمنينه يتحقق لك و يتحقق لك كل شيئ جميل حتى لو ما تمنيتيه. 🇸🇦🕋💐 تستاهلين المتابعة 🤩🥰
الله يحفظك
th-cam.com/video/Uq_3GuHznEM/w-d-xo.htmlsi=-3BmGaXcL726bFID
لتصميم الصفحات فقط ولا التصميم بشكل عام زي سوشيال ميديا وهكذا ؟
@@sayedmohammed8663 التصميم بشكل عام بنستعمل الgrid .. لكن انا شرحت هنا للمواقع والتطبيقات
حلو يا صفا شرحك ممتاز عندي سؤال انتي دارسة التصميم ولا تعليم ذاتي
@@Amro-Omran self study
@@safaasaeed برافو عليكي انا بحب اتفرج على فيديوهاتك ومن شرحك عرفت انك بتطوري نفسك بنفسك عشان انا وصلت لنفس هذه المعلومات بس بعد بحث كبير في الانترنت والتجربة والخطأ وفيديوهاتك ببعتها لأختى عشان تكون زيك استمري 👍👏
ممكن توضحي اخترتي الارقام بناء على ايه؟ ولا دي ارقام ثابته
@@farahmahfouz2056 لا الأرقام دي مش ثابتة .. أنا اخترتها لأنها شائعة الاستخدام وتبع Bootstrap
2
@@mohamedabuelela9251 👏👏
مجهود رائع ....شكرا صفاء
@@mohammedhassbo4449 welcome 😊
فعلا نقطة مهمة جدا في التصميم واللي الكثير من المصممين لا يستخدمونها شكرا الاخت صفاء شرح مميز كالعادة
فعلا مهمة كمان في الديزاين سيستم.. العفو بالتوفيق
2
Correct 🎉
ما دام انك فعلت بحث في الفلسفه هل من الممكن ان تفعلي بحث عن الصين واليابان❤ شرحك رائع وبحثك بيجنن
رائع هذا التطبيق حتى قناتك عرفت كيف تشرحي كيف اصمم بحث
حلو جدا ❤
الله يسعدك دنيا واخيرا فعليا شكرا لانه كنت محتاجته لمشروع تخرجي🤍🤍
شكرا جزيلا شرحك مرة روعة .. ممكن تكملي السلسلة التعليمية
👍
عظيم
هو كل ده من كانفا؟؟
ياريت تعرفينا كيف نحمل خطوط عربية او زخرفيه بكانفا
شرح وافي وسهل وفقك الله
حقيقى تسلمى جدا ربنا يبارك لك على الافادة
روعة فيدوهاتك شرحها مبسط ومحترف
thank you
You’re welcome! 😊
ty <33
ازاي اجيب الشهادة
موجودة في الوصف
@@safaasaeed حاولت أنزل البانر بتاعة سنة 2023 لكن مقدرتش ممكن مساعدة إذا سمحتِ لأنها جميلة وعجبتني. وشكرا جزيلا
@@israa-jh4bh drive.google.com/file/d/1lYTBmDtGAFtNCeJp9hjgpwEP5EAdG_70/view
شكرا جزيلا وتسلم إيدك @@safaasaeed
يسعد دينك شرحك حلو
والقياس بالميلمتر كم
وين التعليق يلي كتبتيه في الموقع عن سبب اخده مجانا
I am applying for a free Figma Education plan to enhance my design skills and knowledge through access to Figma's advanced features.
شرحك بسيط وجميل ومفهوم وواضح اشكرا ❤
انا مسجل في الفري لو غملت الخطوات هتحول برو ولا لازم اسجل بجميل جديد
@@mohamedyousri4614 اه عادي هيتحول حسابك لبرو من غير ماتسجل من جديد
شكرا على المحتوى، الناس اللى تريد الانضمام إلى أي فريق لازم يكون عندهم كمن figma education. وإلا ما تمشي
من ابرز متابعينك ممكن هدية 🎁
اجندة ٢٠٢٥ ؟
الله يرحم والديك
شرح جميل ❤❤
شكرًا جزيلا 😍