برنامج لتصميم الواقع بدلا من Adobe Photoshop

لماذا يجب ان تستخدم Adobe Fireworks في تصميم المواقع بدلا Adobe Photoshop؟!

Adobe Photoshop هو البرنامج المفضل للمصممين، فهو يحتل نصيب الأسد من مساحة العمل لأي مصمم سواء كان مصمم ويب أو مطبوعات، لكن دعونا نلقي هذه المعلومة جانباً، ولنفكر نحن المصممين كمبرمجين قليلاً ! دعونا نبحث عن ال  Function أو “الوظيفة” بدلاً من Feature أو “الميزة” فيما نستخدمه من أدوات في عملنا اليومي، هذا المقال ليس هدفه الترويج لـ Adobe Fireworks، أنا مثلك تماماً كمصمم ويب استخدم Adobe Photoshop لتنفيذ المشاريع التي أعمل عليها، مؤخراً بدأت ألتفت إلى Adobe Fireworks، لماذا يتحدث عنه مجتمع التصميم للويب؟ ألا يجب أن يكون الحديث منصب حول Photoshop وفقط ؟ … لذا قررت التحقيق في الأمر … وتوصلت إلى عدد من الامور التي جعلتني أفكر جدياً في استخدام Adobe Fireworks في المشاريع القادمة … وهذا ما سأشارككم به في السطور التالية، فربما تأخذ نفس القرار!

هل الفوتوشوب هو الأداة الأنسب لتصميم المواقع؟

الوظيفة ضد الميزة

المزايا التي ربما تجدها بالمئات في الفوتوشوب ربما لا تستخدم إلا ٢٠٪ منها في التصميم للويب.

ما عنيته بأن نفكر كالمبرمجين قليلاً هو أن نفكر منطقياً في ما يقدمه لنا برنامج Adobe Photoshop من امكانيات ومزايا، وهل هذا حقاً ما نحتاجه في تصميم المواقع؟ من وجهة نظري أن برنامج Adobe Photoshop هو كالجلباب الفضفاض الذي صنعته Adobe ليناسب أي حجم، عندما نرتديه أثناء التصميم للويب يجعل مظهرنا غير لائق، فاحتياجات التصميم للويب من كمية “الجرافيك” التي يقدمها برنامج Adobe Photoshop قليله جداً، فإذا ما بحثنا قليلاً في تاريخ Adobe Photoshop سنجد أنه لم يصنع للويب أساساً.

ما يتيحة لك أي برنامج من مزاياً لا يعني بالضرورة أنك ستستخدمهم فيما تصنعه من منتجات. – الميزة ضد الوظيفة.

ما هو برنامج Adobe Photoshop ؟

برنامج Adobe Photoshop حسب موقع جامعة واشنطن يعرف بأنه ” البرنامج الرائد في تحرير الصور الرقمية لشبكة الويب، والطباعة، وغيرها من التخصصات في وسائل الإعلام الجديد، يستخدم من قبل الملايين من الرسامين والمصممين للطباعة، والعاملين في مجال الاتصال البصري بكافة اشكالة، أيضاً يستخدمه وبشغف واهتمام عالي الناس العادية غير المتخصصة، من المؤكد أن كل صورة رأيتها في حياتك (مثل الملصقات وأغلفة الكتب، الصور، الكتيبات والمجلات ) إما تم إنشاؤها أو تحريرها بواسطة برنامج Adobe Photoshop، فهو يحتوي على أدوات قوية تستخدملتعزيز وتحرير الصور.” ظهر هذا البرنامج عام 1982 اي قبل ظهور جوجل ب 14 عام،

انا اقول أن ” Adobe Photoshop لم يصنع للويب ! ” وإليك بينة هذا الإدعاء!

الأداة الأنسب للوظيفة – لتنفيذ تصميمات الويب

السبب الرئيسي الذي يجعل مصممي الويب يتحولون لإستخدام Adobe Fireworks هو لأنه برنامج بني خصيصا لمصممي الويب، فكما هو الحال مع برنامج Adobe Indesign التي صنعته أدوبي لتصميم المجلات والدوريات المطبوعة فقط، لا يمكن إستخدام Adobe Fireworks لأي غرض آخر غير التصميم للويب، فلا يمكنك انشاء ملف اكبر من 6000×6000 بيكسل واذا حاولت انشاء ملف بهذا الحجم وبدأت في وضع العناصر بداخلة سيبدأ البرنامج في العمل ببطئ شديد ثم سيغلق برسالة خطأ كبيرة Fireowrks in Crashed.

برنامج Adobe Fireworks أسهل وأسرع في التعلم من فوتوشوب، فحتماً هو الخيار الأفضل إذا كنت جديدا في مجال التصميم للويب، المهام البسيطة التي يمكن أن يستغرق تنفيذها دقائق في برنامج فوتوشوب تأخذ ثوان فقط في Adobe Fireworks! هذا لاينفي عنه صفة أنه وبدون أي شك “تطبيق رسومي قوي”.

علي الجانب الآخر لا يمكن أن ننكر أن Adobe Photoshop يمكنه تنفيذ عدد من الامور التي لا يستطيع Fireworks أن ينفذها، كما أنه يعمل بطريقة مختلفة تماماً، فيمكنه العمل مع ألوان CMYK، يستطيع التعامل مع الملفات ذات الدقة العالية – أكبر من 72 dpi –  وأحجام ملفات أكبر من 2G، الفوتوشوب أصبح وسيلة شعبية، فهو أداة قوية للتلاعب بالصور والأعمال الفنية، الجميع يعلم أنه يمكن أن تفعل أي شيء بالفوتوشوب، انا اعتقد أن هذا السبب هو الذي يقف وراء إتجاه العديد من مصممي المواقع الإلكترونية -وأنا كذلك- لإستخدام الفوتوشوب بدلاً من أي تطبيق رسومي آخر.

هل هذا هو كل شئ عن Fireworks ؟ لندخل قليلاً في التفاصيل  …

كل شئ عبارة عن Vector في Adobe Fireworks

كل شئ عبارة عن فيكتور في Fireworks

Adobe Fireworks يوفر عدد من الادوات التي تتيح التعديل على الصور من نوع بيتماب Bitmap كما يوفر عدد أكبر من الادوات التي تتيح صناعة وتعديل صور الفيكتور Vector، عندما تنشيء أي كائن في Adobe Fireworks سيكون بالأساس فيكتور Vector مما يعني سهولة التعديل في الابعاد المختلفة لهذا الكائن دون أن يفقد دقته.

التأثيرات تأخذ نفس اتجاه تدوير العناصر

التأثيرات تأخذ نفس اتجاه التدوير

من المعروف انه في Adobe Photoshop عندما تدور عنصر ما وليكن مستطيل به تأثير ظل Drop Shadow فإن الظل لا يأخذ نفس اتجاه التدوير، بل يظل في نفس الإتجاه الذي انشأته عليه، علي العكس في Adobe Fireworks عندما تقوم بتدوير عنصر ما، فإن التأثيرات التي طبقتها عليه تأخذ اتجاه التدوير، مما يعني وقت أقل في نقل وتعديل اتجاه التأثيرات حسب اتجاه التدوير الجديد.

المحاذاة أسهل بكثير على Adobe Fireworks

المحاذاة اسهل بكثير في Adobe Fireworks

التصميم للويب أكثر أنواع الاتصال البصري حرصاً علي التوازن والتوزيع الجيد للعناصر، Adobe Fireworks – وكأي برنامج فيكتور – يوفر خطوط توضيحية تظهر تلقائياً أثناء تحريك العناصر، كخط المنتصف الذي يظهر تلقائياً ويفصل الجزء الايمن للصفحة عن الايسر، مما يعني وقتاً أقل في المحاذاة والترتيب.

ضغط الصور في Fireworks أفضل من Photoshop

صغط الصور افضل في Fireworks من Photoshop

من واقع تجربتي الشخصية، عندما قمت بتصميم ملفين بنفس الحجم والألوان علي برنامج  Fireworks وبرنامج Photoshop وقمت بحفظ الصور بنفس الاعدادات، يظهر بوضوح قدرة Fireworks علي ضغط الصور أفضل من Photshop، علي الرغم من أن هذا الضغط الجيد في Fireworks ليس الافضل على الإطلاق فمازال أداء برامج Adobe فيما يتعلق  بضغط الصور أقل من أدوات كثير اخرى متاحة اون لاين.

حواف دائرية أسهل وأسرع في Adobe Fireworks

الحواف الدائرية اسهل في صنعها وتعديلها

أن تصنع مستطيل بحواف دائرية في Fireworks آسهل وأسرع بكثير من مثيلتها في Photoshop، يظهر عدد من النقاط عند الحواف الدائرية، حركها فقط لكي تصل للنتيجة التي تريدها، من تجربتي في Photoshop أجد أن الامر يأخذ وقت قليلاً.

صناعة التدرجات اللونية على الأشكال

تنفيذ التدرج اللوني أسهل بكثير بفيروركس

التدرجات اللونية في Fireworks أسهل في صناعتها من Photoshop، تطبيق التأثير يتيح ظهور نقطتين يوضحان اتجاه التدرج، يمكنك تحريكهم في الاتجاه الذي ترغب فيه، كما يوجد عدد من التدرجات اللونية الملحقة بالبرنامج، تماماً مثل فوتوشوب.

قوالب للصفحات المتكررة

يمكنك صناعة قوالب لصفحات بعينها في Fireworks

أحد أهم المزايا التي أجدها رائعة في Fireworks انه يمكنك صناعة قوالب لصفحات بعينها، في التصميم للويب عادة الصفحة الرئيسية هي التي تكون مختلفة، لكن الصفحات الداخلية للموقع بها عناصر ثابتة ( كالهيدر- والقوائم الجانبية – الفوتر ) في Fireworks تستطيع أن تصنع قالب من هذه العناصر التي تكررها في مشروعك، فتصنع قالب للصفحة الداخلية وقالب للمعرض .. الخ. عندما تغير في القالب الرئيسي سيتغير بالتبعية في كل الصفحات التي تسير علي نفس هذا القالب، وهذه ميزة مفيدة جداً.

مولد مدمج لكود CSS

مولد مدمج لكود CSS للعناصر التي تصممها علي Fireworks

أحد أهم المزايا أيضاً هو مولد كود CSS المدمج في برنامج Fireworks، كل عنصر تستطيع أن تحصل علي كود CSS الذي يمثله، كما تستطيع أن تحصل على أكواد CSS للصفحة التي تصممها بالكامل من خلال خيار الحفظ “CSS and images”

مؤخراً ظهر عدد من الاضافات لبرنامج Photoshop التي تولد كود CSS لأي عنصر تصممه في برنامج Photoshop، ولكن هذا يثبت الادعاء أن Photoshop يحتاج إلى “ترقيعات” ليلائم التصميم للويب.

Find And Replace

يتيح لك برنامج Fireworks ان تبحث عن لون محدد او نص او فونت، وتستبدلة بقيمة اخري

ميزة أخرى رائعة، وهي Find And Replace، يتيح لك برنامج Fireworks أن تبحث عن لون محدد أو نص أو فونت، وتستبدله بقيمة أخرى، سواء في الجزء المحدد، أو في الصفحة المفتوحة أو في الصفحات المفتوحة كلها، ميزة رائعة أليس كذلك؟

Fireworks لا يملك كل شيء تريده ..

لكي أكون منصفاً برنامج Fireworks لم أجد به كل ما اريده، على الرغم من أن Adobe اصدرت منه 12 اصدار – اخر اصدار من البرنامج هو Adobe Fireworks CS6 – إلا أن البرنامج مازال به بعض العيوب …

• واجهة البرنامج يبدوا وكأنها تقريباً نفس واجهة برنامج Macromedia Flash، من الوهلة الاولى ربما تعتقد أن البرنامج لم يُحدث منذ عام 2005 
• الاختصارات الافتراضية التي تعتمدها في Photoshop ليست بالمثل في Fireworks.
• لا يوفر اعدادات متقدمة للتعامل مع الصور من نوع Bitmap.
• لا يوجد مجتمع داعم كبير حوله مثل برنامج Photoshop
• الاضافات والخامات والملفات المجانية ستجد صعوبة في الحصول عليها لهذا البرنامج.
• علي الرغم من Adobe اعلنت انها اوقفت تطوير البرنامج في ٦ مايو ٢٠١٣ … الا ان Fireworks مازال موجود ومازال هو الانسب للتصميم للويب – حتي الآن - فالإضافات المتاحة له تجعل منه اداة قوية للتصميم للويب، ما يوفرة من امكانيات لتنسيق النصوص وال Typography لم اجدها بأي برنامج آخر، مجرد فكرة التحول من Photoshop لأداة مناسبة اياً كانت هو جوهر المقال، مازالت Adobe تحاول ان تطلق برامج اخري اكثر مناسبة للتصميم للويب من برنامج Photoshop، وحتي ان يشق احد هذة البرامج الطريق وليكن مثلاً Adobe Edge سيظل Fireworks هو الاداة الانسب حتي الآن للتصميم للويب. اي برنامج آخر ستبنية Adobe للتصميم للويب يجب ان يكون مبنياً علي ما قدمة Fireworks من مزا

في رأيي ان البرنامج يمثل جوهر التصميم للويب، فلن تجد به إلا ما يجب أن يوضع في صفحة الموقع الذي تصممه، اذا كنت مثلي تعتقد أن الصور الجرافيكية ليست إلا اضافة جمالية للموقع لا تخدم المحتوى – إلا ما نُفذ منها بشكل جيد – اتجه فوراً لبرنامج Fireworks وابدأ العمل عليه، فأنت في الغالب لن تشعر بفرق بينه وبين Photoshop.

اذا احتجت إلى أن تصمم قطعة جرافيكية لا يوفر لك Fireworks الادوات المساعدة التي تخدمك لهذه الوظيفة، اتجه إلى Photoshop واصنعها ثم عد مرة اخرى ل Fireworks واكمل العمل.

الخلاصة

هذا المقال لم يسلط الضوء على كل مزايا Fireworks فالبرنامج أجده بارعاً في التعامل مع ال Typography اكثر من أي برنامج آخر، لم يتسع المقام لسردها، ربما نوضحها في مقالات قادمة، أنا اعتقد وبقوة أن التصميم للويب يتجه بعيداً عن “التصميمات الجرافيكية الثقيلة” انه يتجه للبساطة، يتجه إلى المعنى أكثر من الشكل، يتجه إلى توزيع العناصر والتوازن أكثر من الموضة، يتجه إلى قلب المعنى مباشرةً ! نصيحتي لأي مبتدأ في مجال التصميم للويب، ابتعد عن Photoshop، واقترب اكثر من Fireworks، أعلم جيداً أن التصميم للويب مختلف تماماً عما قد تصنعه بـ Photoshop.