الثلاثي الأشهر في تصميم المواقع
فوتوشوبphotoshop إكس ديadobe XD إليستريتورIllustrator
الفوتوشوب Photoshop
يعد الفوتوشوب برنامج تحرير الصور الأكثر رواجا في السوق. ويستخدم بشكل عام للتعديل على الصور وإنشاء رسومات رقمية مشابهة للرسومات اليدوية ونلاحظ أن إمتداد ملفات الفوتوشوب تكون إسم الملف.psd ويمكن تشغيله على نظام الويندوز ونظام macOS . أيضا يستخدم هذا البرنامج في تصميم الواجهات الامامية لمواقع الإنترنت وهذا هو موضوع درسنا الأساسي حيث يمكنك تصميم الموقع كامل من صفحات ولكن يبقى الموقع في النهاية عبارة عن مجموعة من الصور من المفترض أن يتم تحويلها بعد ذلك إلى كود
إستخدامات الفوتوشوب
يعتبر الفوتوشوب من أكثر البرامج المستخدمة من قبل مصممين المواقع الإلكترونية وأيضا أصحاب المهن الإبداعية حيث يوفر لهم العديد من الزايا والأدوات للقيام بالعديد من المهام ومنها :
1) التعديل على الصور كالتلاعب بألوانها وتغيير خلفيتها وإضافة أشخاص أو نصوص كتابية عليها
2) إنشاء تصميمات لصفحات المواقع الإلكترونية قبل البدء في تكويدها وتطويرها من قبل المبرمجين
3) إنشاء رسومات وأعمال فنية
4) لتعديل على الفيديوهات
أدوات الفوتوشوب
1) أدوات العرض :- وتنقسم إلى
1- أداة التكبير zoom tool وتستخدم في تكبير أو تصغير الصور المفتوحة بالبرنامج
2- أداة اليد Hand Tool والتي تستخدم في تحريك الصور والعناصر الأخرى في حيز العمل داخل البرنامج من خلال النقر على ذر الفأرة وسحبها
2) أدوات التحديد :- هي من الادوات التي تستخدم لتحديد الأشكال المختلفة وتحتوي على ما يأتي:
1- اداة التحديد Marquee تقوم بتحديد الأشكال على شكل مستطيل أو بيضوي أو تحدد صفا أو عمودا واحدا ومفتاح الإختصار لها هو M
2- أداة Laso أو أداة حبل التحديد والتى تتيح لك رسم مضلعات حول أجزاء من الصورة بشكل حر ومفتاح الإختصار لها هو L
3- أداة التحديد السريع Quick Selection والتي تقوم بالتحديد وفقا للون ومفتاح الإختصار لها هو W
4- أداة التحريك Move وتستخدم لنقل المنطقة المحددة أو الطبقة ومفتاح الإختصار لها هو V
3) هناك أيضا أدوات للتحسين والرسم والتعديل والتي يمكنك من خلالها القيام بتصميمات إبداعية وتصميم صفحات المواقع الإلكترونية بشكل مبدع ولتحميل البرنامج إضغط هنا
أدوبي إكس دي Adobe XD
برنامج أدوبي اكس دي هو من البرامج المميزة لتصميم واجهات الاستخدام بأنواعها المتعددة. ظهرت النسخة الأولية من أدوبي اكس دي في عام 2015 (قبل 3 سنوات) وكان الهدف الأساسي
من البرنامج هو تدعيم مصممي واجهة الاستخدام ببرنامج يلبي احتياجاتهم ويسهل عليهم العمل , تطرق المصممين لوجود برامج منافسة كثيرة ك Sketch و inVision وغيرها وأن أدوبي
قامت بخطوة متأخرة , حيث أن برنامج Sketch في الاساس قد استحوذ على نسبة كبيرة من السوق ولا يمكن لمنافس جديد أن يأخذ مكانه بسهولة وقد أتفق كثير من المصممين على هذا الرأي
وكنت أنا بنفسي من بينهم , حتى جاء العام 2017
في البداية وحتى نفهم الفائدة الأساسية من Adobe XD علينا أن نفهم ما هو معنى UI/UX Designer بشكل صحيح , فمصمم واجهة الاستخدام UI/UX Designer فعلياً لا يقوم بكتابة
الأكواد ولكن كتابة الأكواد هي عمل UI/UX Developer , فالمصمم هو من يقوم بعمل مخطط للتصميم ثم يقوم المختص بتحويلها الى كود فعلي , في بدايات ظهور هذا المجال كان النصيب
الأكبر للورقة والقلم في التصميم , اعتمد المصممين لاحقاً على برامج مثل فوتوشوب و اليستراتور في تصميم واجهات الاستخدام , لكن مشكلة ثقل البرامج مثل فوتوشوب على بعض الأجهزة
كانت عقبة كبرى , كذلك حاجة المصممين لانشاء كثير من الأمور يدوياً كانت بذرة مشروع Adobe XD و Sketch وغيرها , عند حضور Adobe XD الى الساحة كبرنامج مخصص
لهؤلاء الأشخاص وجود المصممين سهولة ومرونة في التعامل مقارنة ب فوتوشوب واليستراتور , والأهم من ذلك انه مجاني
مميزات برنامج Adobe XD
تختصر عبارة XD في اسم البرنامج جملة Experince Design و من مميزات البرنامج الرائعة هو التركيز على واجهات الاستخدام و التخصص في تصميمها , فليس سهلاً او مرجحاً تعديل
صورة أو انشاء أيقونة نهائية باستخدام Adobe XD - على الرغم من توفر أدوات كافية
ومن أهم مميزات Adobe XD:
- مجاني ! يمكنك تحميله من هنا عبر Creative Cloud
- واجهة مبسطة وفعالة
- اختبار تجاوبية التصميم
- ربط العناصر ببعضها واختبار المنتج
- تحديد أماكن العناصر بدقة (Fixed , absolute)
- تحديد قيمة لتأثيرات الانتقال
- ومن هذا الرابط
https://www.adobe.com/products/xd/features.html
يمكنك تصفح - الميزات الكاملة لبرنامج Adobe XD وتطوراتها منذ وصول البرنامج حتى اليوم
أدوب إليستريتور Adobe Illustrator
هو برنامج الرسوم المتجهة المفضل لدى المصممين في جميع أنحاء العالم.
وهو المفضل لأولئك يريدون إنشاء رسومات وتوضيحات وطباعة رقمية لكل أنواع الوسائط، المطبوعة والمنشورة على الويب والتفاعلية والفيديو والمحمولة.
والآن لنتعرف عن ما هي الرسوم المتجهة Vector ؟
الرسوم المتجهة هي إحدى صيغ الرسوم الشائعة في التصميم.
فالرسوم لها شكلان:
إما رسوم نقطية bitmap أو رسوم متجهة vector
وتتميز الرسوم المتجهة أنها تحافظ على دقة الوضوح، فعند تغيير الحجم لا تتأثر جودة الحدود.
لذلك فإن الرسوم المتجهة، كما التي ينتجها برنامج اليستريتور، مفضلة في تصميم الشعارات، خاصة إذا كانت مجهزة للطباعة على لوحة إعلانية كبيرة، والنتيجة تظهر بجودة عالية ودون بكسلة لأنها رسوم متجهة.
والآن لنتعرف عن أهم الفروق بين الفوتوشوب وبرنامج Adobe Illustrator
برنامج فوتوشوب وبرنامج اليستريتور، كلاهما برامج تصميم وينتميان لشركة أدوبي، لكن فوتوشوب متخصص في التصميمات النقطية، واليستريتور متخصص في التصميمات المتجهة.
الصورة النقطية معروفة بأكثر من مصطلح باللغة الإنجليزية مثل Pixel , Bitmap , Rasterize، والصورة المتجهة معروفة بمصطلحات مثل Vector , Meta , Postscript , Scalable
وتتميز التصميمات النقطية بالفوتوشوب أنها يمكن إخراجها بحجم صغير، كما يمكن إجراء التأثيرات اللونية على الصور بأدوات متخصصة في ذلك.
لكن يعيب على الصور النقطية أن الصورة يحدث بها بكسلة (تكسير) عند تكبيرها بأحجام عالية، كما أن الأشكال المضمنة داخل التصميم لا يمكن تعديلها كوحدات رسومية مستقلة.
وتتميز التصميمات المتجهة بأنها يمكن تكبيرها لأي حجم كبير دون بكسلة أو تشويه لحواف الرسومات، كما يمكن تعديل محتويات الأشكال داخلها في أي وقت، مما يتيح إمكانية عمل رسوم متحركة .ونشير إلى أن برنامج فوتوشوب به بعض الأدوات التي تستخدم لعمل رسوم متجهة
وبرنامج اليستريتور به بعض الأدوات لعمل رسوم نقطية.
وهذا سمت برامج عائلة شركة ادوبي التي تضفي مزايا برامجها داخل بعضها البعض.
لكن يظل الفوتوشوب هو المتخصص في الرسوم النقطية، واليستريتور متخصص في الرسوم المتجهة، والبرنامجان مكملان لبعضهما البعض .
ولتحميل البرنامج إضغط هنا
الخلاصة
في الشرح الموجود بالأعلى نحن أعطينا فقط فكرة بسيطة عن كل برنامج واوضحنا الفرق بينهما ولكن تبقى الخلاصة هنا أنني كي أستطيع تصميم واجهة المستخدم لأى موقع إلكتروني وبشكل إحترافي فإنه لا يوجد أفضل من أحد هذه البرامج الثلاثة
تسجيل الدخول
دروس اخرى مشابهة
