التخطيط لواجهة تصميم الموقع غالب الأحيان تكون بشكل مباشر على الجهاز بإستخدام برامج الرسم مثل برنامج Adobe Photoshop أو كتابة شفرة XHTML مباشرةً أيضاً أقصد بدون التخطيط المبدئي ، فكرة تصميم أو التخطيط لتصميم قالب موقع ويب بإستخدام برنامج Adobe Illustrator التابع لحزمة شركة Adobe أيضاً مفيدة في عدة أمور وقد جربتها سابقاً ، فقط أفكار أتتني لكتابة هذا الموضوع حول إستخدام Adobe Illustrator في تصميم قالب موقع ويب.
كيف يمكن أن يكون البرنامج مساعد لعملية تصميم الموقع؟
يمكن الإستفادة منه في عدة أمور ما دام أنه أحد برامج (أعبرته أفضلها) المتخصصة في رسومات المتجهية Vector Graphic ولكنه تجاري ، هناك برامج مفتوحه المصدر أيضاً مثل برنامج Inkscape، Karbon14، NodeBox، .. وغيره.
تقطيع التصميم وتحويله إلىxhtml
خلال البرنامج تستطيع إستخدام أداة Slice Tool لتقطيع التصميم كما هو موجود أيضاً في برنامج Photoshop بنفس المهام وطريقة حفظ كل جزء من الأجزاء التي تريدها عن طريق Save for Web & Devices … من قائمة File ..
التخطيط للموقع
طرق التخطيط لواجهة الموقع أو قالب الموقع تختلف حسب طريقة الشخص، إمكانيات البرنامج تتيح لك كافة الطرق الممكنة، ومن الطرق التي أستخدمها للتخطيط لقالب الموقع أو لمهام تطبيق ويب مثلاً هي الخريطة الذهنية Mind Mapping ويمكن عملها بسهولة بأدوات البرنامج مثل أداة القلم Pen Tool أو أدوات الأشكال مثل المربعات والدوائر أو أداة الفرشاة Paintbrush Tool.
يمكنك من خلال اليستريتر التخطيط لشكل الموقع(التخطيط المبدئي) صحيح أنه لا توجد أدوات لعمل ذلك بشكل مباشر وهناك نماذج موجودة في برنامج Fireworks على سبيل المثال ولكن ادوات البرنامج يمكن أن تلبي طلبك مثل الأدوات التي ذكرتها مسبقاً كأداة Pen Tool و Paintbrush Tool، هناك موضوع آخر كتبته حول واجهة المستخدم يمكنك الإستفادة منه.
تصميم الأيقونات
أغلب عملية تصميم الأيقونات في مواقع الويب يتم عملها في برنامج اليستريتر سواء كانت العملية من التخطيط أو رسمها مباشرةً، هناك عدة دروس حول تصميم الأيقونات منتشرة في الويب، من أفضل المقالات التي أعجبتني ضمن مجلة Smashing Magazine في السنة الماضية أضافت درس رائع لتصميم الأيقونات وأفضل شيء هو أن اليستريتر أحد برامج الرسومات المتجهية فالدقة موجودة بالطبع، مصادر:
ملقات بدقة عالية
وهذه الميزة الرئيسية للبرنامج لأنه من برامج Vector Graphic ويمكنك رؤية المقارنة بين Vector و Raster ، تستطيع حفظ ملفاتك لإستخدامها لاحقاً في برامج 2d و3d عن طريقة حفظها بالنسخة الثامنة من برنامج Illustrator وذلك عند حفظها بعد الإنتهاء من عملك في البرنامج وإختيار إصدار البرنامج الخاص بالملف Illustrator 8.
وبعدها تستطيع فتحها بسهولة إما عن طريق برامج الجرافك 2d أو 3d، هذا مثال لتحويل كلمة مكتوبة باليستريتر(خط حر):
وتحويلها إلى كلمة ثلاثية الأبعاد بعد حفظها بالطريقة السابقة:
هذا مجرد مثال توضيحي فقط، أحببت أوضح إستخدامات البرنامج في عدة أمور.
حسين (تصميم مصري)
جميل احمد فكرة التخطيط والأليسترتور برنامج رائع وصراحة أحس أنه غير مهتم بيه عريبا
بالمناسبة ما البرنامج الذي تستخدم لتحويل كتابة الخط الحر في الأليستور إلي 3D
أحمد الكثيري
أهلاً أخي حسين، إذا كنت تقصد عمل 3D نفسه فأنا أستعمل Cinema 4d ولكن قصدت بالطريقة هذه أيضاً فتح ملف الكتابة (كتابة الخط الحر الذي عملته باليستريتر) في برنامج Cinema 4d وأي برنامج آخر والسبب هو حفظه بصيغة الإصدار الثامن من البرنامج.
لأن حفظه بصيغة إصدار آخر حتى لو كان الأخير مثلاً CS3 أو CS4 من الصعب فتح ملف في أي برنامج آخر إلا إن كان من مجموعة برامج Adobe بشكل عام ، بعض المصممين لا يعلم بهذه الطريقة في تهيئة ملفات هذا البرنامج لإستخدامها في برامج أخرى.
تولين
مرحبا مبدع ،..
المدونة ثمينة بمحتواها ،..
عقدت قبل مدة تعلم هذا البرنامج ،، لكن وجدت المحتوى العربي يفتقر الى دروس احترافية ،..
أعتقد ان دروس الايقونات ستفيدني كثيرا ،..
شكرا ،..
Abdallh
احب الالستريتر لكن لم اصل به الى مراحل متقدمة مثل الفتوشوب
محمد خفاجى
مقال جميل لاكنة موجز بعض الشئ , ممكن ان تكمله مستقبلا بالتفصيل بأذن الله , شكرا لك