كورس تعليم برنامج
Вставка
- Опубліковано 7 жов 2024
- كورس Ui - UX Design | باللغة العربية من الصفر #02 الادوات
كورس تعليم برنامج #Adobe_xd UI & UX | باللغة العربية من الصفر
Ui - UX Design Course | by Mena Boules Fouad
كورس تصميم واجهة البرامج و المواقع تقديم المبرمج مينا بولس (UI - UX Designing)
___
رابط المحاضرة الاولي : • كورس تعليم برنامج #Ado...
رابط المحاضرة الثالثة : • كورس تعليم برنامج #Ado...
ـــــ
في هذا الدرس سنتحدث عن بداية المصمم ، و البرامج المستخدمة في هذا الكورس
User interface design , User Experience
كلمة UI هي اختصار ل User Interface ومعناها واجهة المستخدم وهي الواجهة التي يراها المستخدم عند الدخول لموقعك أو التطبيق الخاص بك أما UX هي اختصار ل User Experience ومعناها تجربة المستخدم وهي كل ما يخص التجربة التي يقوم بها المستخدم داخل موقعك أو تطبيقك, وهي تعتمد على تسهيل التجربة الخاصة به عن طريق أن تقوم بعمل ألوان جيدة مريحة للعين وأن تجعل العناصر سهل الوصول إليها وأن تجعل التجربة بسيطة وسلسة في موقعك والوصول لكل شيء يكون بسيط ولا يوجد أي شيء معقد في موقعك.
__
وظيفة UI/UX Designer هي الوظيفة الخاصة بتصميم Prototype + Mockup للتطبيق الخاص بك ورسم رحلة المستخدم كاملة User Journey وتجربة المستخدم والألوان المستخدمة وكل ما يخص التصميم قبل تنفيذ الكود وطبعا هذا تعريف بسيط جدا للوظيفة لمعرفة الفكرة فقط ومن أهم الأدوات برامج مثل Adobe XD أو Experience Design أو برنامج مثل Figma وهناك برنامج رائع على نظام Apple Mac هو Sketch.
__
ما هو برنامج Adobe XD ?
برنامج أدوبي اكس دي هو من البرامج المميزة لتصميم واجهات الاستخدام بأنواعها المتعددة , ظهرت النسخة الأولية من أدوبي اكس دي في عام 2015 (قبل 3 سنوات) وكان الهدف الأساسي من البرنامج هو تدعيم مصممي واجهة الاستخدام ببرنامج يلبي احتياجاتهم ويسهل عليهم العمل , تطرق المصممين لوجود برامج منافسة كثيرة ك Sketch و inVision وغيرها وأن أدوبي قامت بخطوة متأخرة , حيث أن برنامج Sketch في الاساس قد استحوذ على نسبة كبيرة من السوق ولا يمكن لمنافس جديد أن يأخذ مكانه بسهولة وقد أتفق كثير من المصممين على هذا الرأي وكنت أنا بنفسي من بينهم , حتى جاء العام 2017 ...
أولاً لنفهم الفائدة الأساسية من Adobe XD علينا أن نفهم ما هو معنى UI/UX Designer بشكل صحيح , فمصمم واجهة الاستخدام UI/UX Designer فعلياً لا يقوم بكتابة الأكواد ولكن كتابة الأكواد هي عمل UI/UX Developer , فالمصمم هو من يقوم بعمل مخطط للتصميم ثم يقوم المختص بتحويلها الى كود فعلي , في بدايات ظهور هذا المجال كان النصيب الأكبر للورقة والقلم في التصميم , اعتمد المصممين لاحقاً على برامج مثل فوتوشوب و اليستراتور في تصميم واجهات الاستخدام , لكن مشكلة ثقل البرامج مثل فوتوشوب على بعض الأجهزة كانت عقبة كبرى , كذلك حاجة المصممين لانشاء كثير من الأمور يدوياً كانت بذرة مشروع Adobe XD و Sketch وغيرها , عند حضور Adobe XD الى الساحة كبرنامج مخصص لهؤلاء الأشخاص وجود المصممين سهولة ومرونة في التعامل مقارنة ب فوتوشوب واليستراتور , والأهم من ذلك انه مجاني !
ketch وغيرها , عند حضور Adobe XD الى الساحة كبرنامج مخصص لهؤلاء الأشخاص وجود المصممين سهولة ومرونة في التعامل مقارنة ب فوتوشوب واليستراتور , والأهم من ذلك انه مجاني !
مميزات برنامج Adobe XD :
تختصر عبارة XD في اسم البرنامج جملة Experince Design و من مميزات البرنامج الرائعة هو التركيز على واجهات الاستخدام و التخصص في تصميمها , فليس سهلاً او مرجحاً تعديل صورة أو انشاء أيقونة نهائية باستخدام Adobe XD - على الرغم من توفر أدوات كافية .
ومن أهم مميزات برنامج Adobe XD
مجاني ! يمكنك تحميله من( creativecloud.... ) عبر Creative Cloud
واجهة مبسطة وفعالة
اختبار تجاوبية التصميم
ربط العناصر ببعضها واختبار المنتج
تحديد أماكن العناصر بدقة (Fixed , absolute)
تحديد قيمة لتأثيرات الانتقال
ومن هذا الرابط www.adobe.com/... يمكنك تصفح الميزات الكاملة لبرنامج Adobe XD وتطوراتها منذ وصول البرنامج حتى اليوم
ما الممكن تحقيقه مع Adobe XD ?
الكثير فعلاً , تحدت شركة أدوبي نفسها و خرجت بمنتج خيالي استطاع احتلال مكانة كبيرة بين المصممين بسهولة , ولن أطيل في الكلام عن ما يمكنك تحقيقه , مجرد فيديو قصير مدته 3 دقائق مقدم من قناة Dansky المهتمة بالتصميم ستشرح لك شيئ من ما يستطيع عمله هذا البرنامج
___
Adobe XD
Adobe XD (also known as Adobe Experience Design ) is a vector-based user experience design tool for web apps and mobile apps, developed and published by Adobe Inc. It is available for macOS and Windows, and there are versions for iOS and Android to help preview the result of work directly on mobile devices. Adobe XD enables website wireframing and creating click-through prototypes.
Mena Boules Fouad
Mina Boules Fouad
مينا بولس فؤاد لبيب
![شرح فيجما Figma في 25 دقيقة | تعلم تصميم واجهات المستخدم [ Figma Crash Course 2023 ]](/img/n.gif)
ينفع انزله ع الفون
لا للاسف
عادى لو اشتغلت على Figma عشان لابتوب المعيا امكنياته مش قويه؟
عادي جدا جدا . فيجما جظيل جدا و حاليا اكثر انتشارا
هل ال coding بيبقا وظيفة الback end
الفرونت في حالة Ui
الباك ايند في البروتو تايب و ال logic
شكرا جدا لحضرتك مقدما + انا عندي فكرة مشروع لازم اخد الكورس دا صح وهل هوا الاول ولا فلاتر
لاشكر علي واجب تحت امرك.. لا التصميم الاول اللي هوا ui ux بعد كده البرمجة
لو كنت مطور ويب فرونت اند هل يفيدني هذا الكورس ؟
هيفيييدك اووووووي ، لاني اصلا Front End Developer
هو ادوبي XD مبقاش موجود ؟
مازال موجود لكن في ادوبي فيجما اللي طالع و هنعمل شرح ليه ان شاء الله
هل من الممكن ان ابدأ تعلم ال Ui ux وفي نفس الوقت اتعلم ال كودينج ولا دا صعب ؟
الاستعجال مش افضل حاجا ياصديقي ❤ خطوة خطوة والدنيا هتكون تمام ، خلص ui ux واحترفها بعد كدا coding (Front End)
واحترفها ❤ ادي كل حاجا حقها
@@minaboulesfouad لعلمك انا ليا سنه بدأت بتعلم فوتشوب اليستريتور وافترافكت بريمير بس مجوش معايا سكه والتنافس عليهم عالي ومعرفتش اسوق نفسي ف اي حاجه فيهم وفي نفس الوقت كنت حابب شغل الموشن جرافيك اكتر حاجه وعملت عليه كذا تجربه والمونتاج برضو
بس الفكره ان دول كلهم حاسسهم انهم حاجات مش مهمه عشان خاطر دخول الذكاء الصناعي فقولت اغير الدفه
وابدأ بال xd بس انا ليا يومين بدور عشان أحمله بالكراك ومش عارف لو تقدر تبعتلي رابط يبقى عملت الصح👌 ❤️🌹
@@AmrTheLionHeartكلامك حلوا بس انا برئي انوا اي حاجة بتتعلمها بتفيدك بعدين يعني انا مبرمج بس بشتغل مصمم جرافيك انتا هتتعلم اي حاجة هتيجي بعدين تفيدك في حاجة يعني مثلا ممكن تاخد شكل من الاليتريتور وتدعه في الxd وممكن يكون ارع ليك
الكورس بقدر اقدم على شغل فرىلانسر بعد كده و اعمل مشروع بدون ما احتاج اتعلم كورس تانى
هتحتاج بس حاجات بسيطة انك تعمل مشاريع كتير و تشوف ناس علي اليوتيوب بتعمل مشاريع وتتعلم منهم وتقري شوية عن المجال وكدا و ربنا معاك ❤❤
@@minaboulesfouad شكرا جدا على رد حضرتك لكن ممكن حضرتك ترشحلى حد بينزل مشاريع او شخص محدد
قناة Designsense
ua-cam.com/users/DesignSense
الكورس يؤهل للعمل ولا في اضافات ؟
يؤهل :
بس لازم تطبق كتير
تقرا شوية عن المجال
@@minaboulesfouad شكرا ي هندسه
لاشكر علي واجب تحت امرك ❤❤
هل برنامج Adobe xd مجاني او مدفوع ؟؟ اذا كان مدفوع هل يوجد له برنامج مجاني بديل ؟؟
مدفوع بس في نسخ منه مجانا
عاشت ايدك صديقي بس اعتقد لو تشرح عن ux فل بدايه احسن وشكراً ❤
ميرسي ليك ❤❤ تسلملي .. ان شاء الله ❤❤
طيب لو بدي اعمل قياس بيزبط على كل شي شو الحل يعني الموقع ممكن ينفتح من موبايل أو كومبيوتر
دي بتظبط بالكود شغل الفرونت اعتقد يعني
لا في plug-ins في Adobe xd و Figma
بتسمحلي اني اكرر الصفحات بمختلف المقاسات و انت تعدل وتظبط حاجات بسيطة ودا اسمه Responsive design .
الحل التاني من الcss في مرحلة الكودنج ان المبرمج او المصمم يستخدم Media Query
لا في plug-ins في Adobe xd و Figma
بتسمحلي اني اكرر الصفحات بمختلف المقاسات و انت تعدل وتظبط حاجات بسيطة ودا اسمه Responsive design .
الحل التاني من الcss في مرحلة الكودنج ان المبرمج او المصمم يستخدم Media Query
@@minaboulesfouad تمام شكرا جدا لحضرتك
لاشكر علي واجب تحت امرك ❤
ممكن رابط xb
helpx.adobe.com/mena_ar/xd/get-started.html
تفضل ولو في اي مشكله تواصل معي علي التليجرام
t.me/Mina_Narmar
هل هو free و لا لمدة معينة ؟؟
في برامج تكون مجانية غير الxd ؟
ممكن تتواصل معايا علي التليجرام و ان شاء الله اجبلك بديل للبرنامج مجاني
@mina_boules
@@minaboulesfouad مش موجود على التليجرام فى بديل اى مجانى بليز😢
@@minaboulesfouad مش موجود على التليجرام فى بديل اى مجانى بليز😢
ممكن قناتك ع التليجرام؟؟
@Mena_boules