Instagram Telegram-plane

تعلم التصميم حتى تصل
لمرحلة الاحتراف

تقدم بيكسل بيديا مسارات واضحة وتفصيلية لتعلم اختصاصات التصميم المختلفة

اختر المسار الذي ترغب بتعلمه
أدوات التصميم

مسار تعلم تصميم UI/UX

UI/UX تخصّص يركّز على تصميم وتجربة المستخدم لتطبيقات الويب والأجهزة الذكية.

يهدف تصميم تجربة المستخدم (UI) إلى إنشاء واجهات جذابة وسهلة الاستخدام، مع التركيز على التصميم الجمالي وتوجيه المستخدم في استخدام التطبيق بكفاءة.

أما تجربة المستخدم (UX)، فتركّز على فهم تفاعل المستخدم مع التطبيق، مما يشمل تحليل الاحتياجات، وتصميم مسارات التجربة، وضمان سلاسة التفاعل بين المستخدم والتطبيق.

يدمج UI/UX الفنون التصميمية مع علوم النفس والتكنولوجيا لتحسين تجربة المستخدم وتعزيز رضاه واستخدامه المستمر للتطبيقات.

اقرأ المزيد
  1. المواضيع مرتبة بشكل متسلسل لذلك يفضل اتباع المسار بالترتيب إذا كنت مبتدئاً.
  2. في كل موضوع توجد مواد بمستوى مبتدئ ومواد بمستوى متقدم عن نفس الموضوع، لذلك يفضل الاطلاع على المواد المناسبة لمستواك.
  3. في حال كنت تواجه صعوبة بالاستفادة من المواد باللغة الانجليزية فيمكنك استخدام إضافة Joy للمتصفح لكي تتمكن من ترجمة محتوى الفيديوهات ترجمة آلية للغة العربية، أو استخدم إضافة Google Translate للمحتوى المكتوب.
  • مقالة
  • Ahmad Sekmani
  • المستوى: مبتدئ

1- ما هي الألوان؟ وما هي طرق اختيار الألوان للتصميم؟
  • فيديو
  • DesignerUp
  • المستوى: مبتدئ

2- Super Practical Guide to Color Theory, Color Models and Perfect Color Palettes | UI Design
  • فيديو
  • Jesse Showalter
  • المستوى: مبتدئ

3- 60-30-10 Color Rule
  • فيديو
  • UX Tools
  • المستوى: متقدم

4- How I make UI color palettes
  • فيديو
  • Flux Academy
  • المستوى: متقدم

5- How To Select Colors: Step By Step
  • مقالة
  • Sangeeth kumar
  • المستوى: مبتدئ

1- Create your own Design System: Chapter Typography
  • فيديو
  • Jesse Showalter
  • المستوى: مبتدئ

2- Typographic Scales in Web Design & UI Design
  • فيديو
  • DesignCourse
  • المستوى: مبتدئ

3- Typographic Visual Hierarchy in UI Design (4 Examples)
  • مقالة
  • Ahmad Sekmani
  • المستوى: مبتدئ

1- ما هو التصميم المرئي؟ (العناصر والمبادئ)
  • فيديو
  • DesignWithArash
  • المستوى: مبتدئ

2- UI Design Principles | Everything You Need To Know
  • فيديو
  • Jesse Showalter
  • المستوى: مبتدئ

3- 4 Foundational UI Design Principles | C.R.A.P.
  • مقالة
  • Canva
  • المستوى: مبتدئ

4- The ultimate guide to visual hierarchy
  • فيديو
  • Google Career Certificates
  • المستوى: مبتدئ

5- Understanding Visual Design Principles | Google UX Design Certificate
  • فيديو
  • Jesse Showalter
  • المستوى: مبتدئ

6- Grid Systems in Web & UI Design
  • مقالة
  • Denislav Jeliazkov
  • المستوى: مبتدئ

7- Is Your UI Messy? 7 Common Mistakes to Avoid
  • مقالة
  • CareerFoundry
  • المستوى: مبتدئ

8- 10 Common UI Design Mistakes (and How to Avoid Them)
  • فيديو
  • Ahmad Sekmani
  • المستوى: مبتدئ

1- ما هو Grid وكيف أستخدم في تصميم المواقع والتطبيقات؟
  • فيديو
  • Jesse Showalter
  • المستوى: متقدم

2- Advanced Grids in UI & Web Design
  • فيديو
  • Jesse Showalter
  • المستوى: مبتدئ

1- Iconography for Designers | Top 3 Tips
  • فيديو
  • Jesse Showalter
  • المستوى: مبتدئ

1- Design Patterns
  • فيديو
  • DesignerUp
  • المستوى: مبتدئ

2- Best UX/UI Design Patterns | Resources and Checklists
  • مقالة
  • UXPin
  • المستوى: مبتدئ

3- UX Design Patterns You Should Focus On
  • مقالة
  • CareerFoundry
  • المستوى: متقدم

4- A Step-By-Step Guide To User Experience (UX) Patterns
  • فيديو
  • Anas Rafaat | أنس رأفت
  • المستوى: مبتدئ

1- إية الفرق بين التصميم للاندرويد والتصميم للأي او إس؟ واية الحاجت اللي لازم نراعيها | Android vs iOS
  • مقالة
  • UXcam
  • المستوى: مبتدئ

2- Mobile UX Design: The Ultimate Guide 2024
  • مقالة
  • Toptal
  • المستوى: مبتدئ

3- Mobile UX Design Principles
  • فيديو
  • Jesse Showalter
  • المستوى: مبتدئ

4- Mobile Design 101: How to Design for Mobile First
  • مقالة
  • Yellowchalk
  • المستوى: مبتدئ

5- The Ultimate Font Size Unit Guide for UI Designers
  • مقالة
  • Altamira
  • المستوى: مبتدئ

6- What Dimensions & Resolution Should Use For iOS And Android App Design?
  • مقالة
  • Ahmad Sekmani
  • المستوى: متقدم

7- ما هو الفرق بين PX و EM و REM؟ ولماذا يجب أن نستخدمه في التصميم؟
  • فيديو
  • Ehab Fayez
  • المستوى: مبتدئ

1- كورس Figma للمبتدئين من الصفر للاحتراف | تصميم المواقع وتطبيقات الموبيل 2024
  • فيديو
  • DesignWithArash
  • المستوى: مبتدئ

2- Free Figma Crash Course for Beginners 2024 | UI/UX Design
  • فيديو
  • Ahmad Sekmani
  • المستوى: مبتدئ

3- 7 ميزات يجب التركيز عليها في فيجما حتى تصبح محترف
  • فيديو
  • Y7IA Graphic Designer
  • المستوى: مبتدئ

4- تصميم تطبيق أثاثات باستخدام فيجما | Figma UX
  • فيديو
  • Flux Academy
  • المستوى: مبتدئ

5- Designing an App in 30min Using Figma (Challenge)
  • فيديو
  • Rachel How
  • المستوى: مبتدئ

6- Redesigning Nespresso’s Website in 1 hour | UI/UX Design Challenge
  • فيديو
  • Rachel How
  • المستوى: مبتدئ

7- Level up your UI design skills in 12 minutes! | EP2
  • فيديو
  • Jesse Showalter
  • المستوى: متقدم

8- Free Figma Course: Design a Video Game App in Figma
  • فيديو
  • Mavi Design
  • المستوى: متقدم

9- Design an App from Scratch in Figma (Tutorial)
  • فيديو
  • Islam Hefney
  • المستوى: مبتدئ

1- شرح الـ Prototype في فيجما – Figma Prototyping Tutorial
  • فيديو
  • Figma
  • المستوى: متقدم

2- Figma tutorial: Prototype with variables
  • فيديو
  • DesignerUp
  • المستوى: متقدم

3- Next-Level Prototyping, Animations and Interaction Design Made Simple! | Figma+ProtoPie
  • فيديو
  • Ahmad Sekmani
  • المستوى: مبتدئ

1- كيفية تحريك تصاميم المواقع والتطبيقات في فيجما؟
  • فيديو
  • Saptarshi Prakash
  • المستوى: مبتدئ

2- 10 EASY Figma Animations for Beginners In 1 HOUR 🔥| Figma Smart Animate Tutorial
  • فيديو
  • Tim Gabe
  • المستوى: مبتدئ

3- 5 Most Useful Figma Animations For UI Beginners
  • فيديو
  • Tim Gabe
  • المستوى: مبتدئ

4- Figma Smart Animate for Beginners (2022 Tutorial)
  • فيديو
  • Flux Academy
  • المستوى: مبتدئ

5- How to get micro-interactions right using Figma
  • فيديو
  • Punit Chawla
  • المستوى: مبتدئ

6- Animate Icons in Figma in 1 Click! + Export As Json
  • فيديو
  • developedbyed
  • المستوى: متقدم

7- Awesome Micro Animations With Figma Tutorial
  • فيديو
  • DesignWithArash
  • المستوى: متقدم

8- Animate Text in Figma Like a Pro | Figma Tutorial
  • فيديو
  • Flux Academy
  • المستوى: متقدم

9- Figma Advanced Animations
  • فيديو
  • DesignCourse
  • المستوى: مبتدئ

1- Make an Entire Layout Responsive in Figma – In 10 Minutes
  • فيديو
  • Ahmad Sekmani
  • المستوى: متقدم

2- طريقة جعل العناصر متجاوبة داخل فيجما | مشروع بناء تصميم متجاوب
  • فيديو
  • Flux Academy
  • المستوى: متقدم

3- Responsive Website In Figma
  • مقالة
  • Ahmad Sekmani
  • المستوى: مبتدئ

1- ما هو نظام التصميم Design System؟ كل ما تحتاج لمعرفته عنه
  • فيديو
  • Ehab Fayez
  • المستوى: مبتدئ

2- How to create a design system – ازاي تعمل ديزاين سيستم وايه مميزاته
  • مقالة
  • UXPin
  • المستوى: مبتدئ

3- Design Systems: Step-by-Step Guide to Creating Your Own
  • فيديو
  • Figma
  • المستوى: مبتدئ

4- Overview: Introduction to design systems
  • مقالة
  • Romina Kavcic
  • المستوى: متقدم

5- The Design System Guide
  • مقالة
  • InVisionApp
  • المستوى: متقدم

6- A comprehensive guide to design systems
  • مقالة
  • Ahmad Sekmani
  • المستوى: مبتدئ

1- ما هي إمكانية الوصول Accessibility؟
  • فيديو
  • Ultimez Technology
  • المستوى: مبتدئ

2- Design for Accessibility | 2 min Beginners Guide for UI/UX Designers | Ultimez Technology
  • فيديو
  • Interaction Design Foundation – UX Design Courses
  • المستوى: مبتدئ

3- Mobile Accessibility Principles | Accessible Mobile Design
  • فيديو
  • Ilya Dmitruk - Eleken SaaS Design Agency
  • المستوى: متقدم

4- Breaking Barriers: How to Design Accessible UX
  • فيديو
  • Pimp my Type
  • المستوى: متقدم

5- FIX Color Contrast – Accessibility in Web & UI Design
  • مقالة
  • Ahmad Sekmani
  • المستوى: متقدم

1- ما هي أهم تخصصات تصميم UI/UX الموجودة حالياً؟
  • مقالة
  • EMERGE
  • المستوى: متقدم

2- How to Build a Digital Product Design Team
  • مقالة
  • UX Design Institute
  • المستوى: متقدم

3- How do UX and UI designers work together?
  • مقالة
  • Maze
  • المستوى: متقدم

4- How to structure and manage a UX team: Setting team members up for success
  • فيديو
  • Headway
  • المستوى: متقدم

5- Design Leadership Skills – Growing and Managing a Product Design Team [UX UI Designers]
  • فيديو
  • Neuron - UX/UI Design Agency
  • المستوى: متقدم

6- How to Lead a Design Team
  • مقالة
  • Ahmad Sekmani
  • المستوى: متقدم

7- كيف يمكن لمنصات No-Code مساعدة الشركات الصغير والمشاريع الناشئة؟

قريباً 🙂

شهادات مصممين استخدموا الموقع

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

اختر المسار الذي ترغب بتعلمه

شكراً جزيلاً لـ

المصمم أنس حسناوي على إبداعه في تصميم الهوية البصرية لبيكسل بيديا

نبذة عني

هدفي هو مساعدة الشباب لاحتراف التصميم ودخول سوق العمل، تجدني على لينكدان و تلجرام :)

يجب تسجيل الدخول لاستخدام الموقع بشكل مجاني

سجل دخول عن طريق Google

انسخ رابط الموقع والصقه في أحد المتصفحات

أو اختر “فتح في تطبيق الانترنت”