أصنع قائمة أزرار للويب بالفايروركس بإحتراف Create a navigation for a website

نحتاج لهذا الدرس:

• برنامج فايروركس سي إس ثري Fireworks CS3

بدء العمل:

1. افتح لوحة "مستند" جديد في الفايروركس بإختيار New من قائمة File.
2. من النافذة التي ستظهر إختر العرض والطول 400 بيكسل, بخلفية بيضاء.

بدء صنع القائمة:

1. إختار Window-->>Common library.
2. من النافذة الجديدة التي ستفتح بإسم Common library إضغط مرتين علي كلمة Buttons.
3. والأن وقد إنسدلت قائمة بأشكال مختلفة من الأزرار, إستعرض الأزرار بالضغط عليها مرة واحدة لرؤية كل زرار علي حدة.
4. إختار الزرار المناسب لذوقك, "أنا أخترت الزرار التالي.
5. إسحب الزرار من نافذة Common library إلي اللوحة.
6. حدد الزرار.
7. والأن حرك الزرار في المكان الذي يناسبك.

التعامل مع الأزرار:

1. إضغط مرتين علي الزرار بالماوس, ليفتح لك نافذة تتحكم بها في شكل الزرار في حالته المختلفة.
2. حالات الزرار هي:
   1. Up وذلك عند عدم إقتراب مؤشر الماوس من الزرار.
   2. Over وذلك عند الوقف أو المرور بمؤشر الفائرة علي الزرار.
   3. Down وذلك عند الضغط علي الزرار.
   4. Over whil down بعد الضغط علي الزرار يمكنك من تمرير المؤشر عليه ليتغير شكل الزرار.
   5. Active Area وهذه هي المنطقه النشطة التي عند الضغط عليها أو المرور فوقها يتغير شكل الزرار أو يذهب بنا إلي صفحة ويب مربوط بها.
3. بعد إنتهائك من تغير شكل الزرار, بتغيير ألوانه أو الكتابة عليه, إضغط Done.

تكرار الزرار بنص مختلف:

1. لتكرار الزرار لا تصنع نسخ ولصق "هذا لا يجوز مع الأزرار".
2. إختار Window-->>Library.
3. من نافذة Library اسحب إسم الزرار إلي علامة New symbol, كما هو موضح بالصورة اسفل.
4. أعد تسمية الزرار الجديد بأسم مختلف عن أسم الزرار الاصلي.
5. أختار نوع الزرار Button.

إضافة الروابط:

1. إضغط علي كل زرار علي حدة, وأكتب الرابط في نافذة Properties في الجزء Link, وليكن عنوان موقعي http://ispweb.blogspot.com.

أنظر الناتج النهائي.

تلوين الصور الأبيض والأسود في الفوتوشوب

هناك طرق متعددة لتلوين الصور الأابيض والأسود أفضلها هو الطريقة التي تجعل الصورة حية بعد تلوينها. ويعتمد نجاح تلوين الصور علي إختيار الألوان المناسبة لتلوين أجزاء الصورة وخصوصا ذلك الجزء من الصورة الذي يحتوي جلد الإنسان.

بدء العمل:

1. أحفظ الصورة التالية علي جهازك. بالضغط كليك يمين وإختيار Save as.
2. أفتح الصورة السابقة التي تريد تلوينها بإختيار Open من قائمة File بأعلي البرنامج.

التحضير للتلوين:

1. إصنع طبقة جديدة بالضغط علي زرار Create a new layer من نافذة Layer.
2. أعد تسمية الطبقة الجديدة بإسم Color وذلك بالضغط علي إسم الطبقة مرتين.
3. غير نوع الطبقة إلي Color كما هو موضح في الصورة.

بدء تلوين الصورة:

1. اختر اللون الأزرق أو المقارب له أنا إخترت #015bcd. إضغط عل مربع الألوان العلوي Set foreground color. وأكتب بأسف الشاشة التي ستظهر لك الرقم 015bcd كما هو موضح بالصورتين التاليتين.
2. والأن سنلون البحر بذلك اللون, أختار اداة Brush tool او أضغط حرف B في لوحة المفاتيح.
3. كبر حجم الفرشاة أو صغرها تبعا لإختيارك بالضغط علي زراري ] , [ في لوحة المفاتيح للتكبير والتصغير علي التوالي.
4. ابداء بتلوين البحر ولكن تأكد من أنك تلون بالفرشاة فوق الطبقة Color وليس الطبقة الأصلية للصورة Background.

أنظر الصورة بعد تلوين البحر.

صنع قائمة مسدلة بالفايروركس Create a pop-up menu with fireworks cs3

نحتاج في هذا الدرس إلي:

• برنامج فايروركس سي إس ثري "Fireworks CS3".

بداية العمل:

• أفتح مستند جديد في الفايروركس , أبعادها: 400*400 Pixels, لون خلفيتها أبيض.

بداية الرسم:

• أختار أداة rectangle tool, أو إضغط "U".
• إبداء بالضغط ثم السحب علي لوحة الرسم, لرسم مستطيل.
• من شريط الخصائص بالأسفل proprites, غير أبعاد المستطيل إلي 100 عرض و 30 إرتفاع, W=100 , H=30.
• من شريط الخصائص بالأسفل proprites, غير توع اللون إلي متدرج Color=Gradient-->linear.
• من شريط الخصائص بالأسفل proprites, غير لوني التدرج وذلك بالضغط علي المربعين الموضحيت بالرسم إلي اللونين #BCB159 و #F1EEDC من اليسار إلي اليمين.
• لتدوير حواف المستطيل, من شريط الخصائص بالأسفل proprites, أختار Rectangle roundness=56.

بداية صنع القائمة:

• نحتاج لأن نظهر شريط يدعي Behaviors.
• من قائمة Windows بالأعلي نختار شريط Behaviors.
• نتاكد من أننا ممسكين أو محددين المستطيل الذي صنعناه مذ قليل.
• من شريط Behaviors نضغط علي علامة + وتعني أضف أو Add behaviors.
• يظهر لنا مربع حواري يسألنا هل نريد أن نضيف فوق المستطيل المحدد Slice أم Hotspot, نختار Slice.

ملاحظة: "تقوم Slice بتقسيم اللوحة إلي جدول كبير Table كل جدول يحتوي علي خلية أو أكثر Cell كل خلية تحتوي علي قطعة أو شريحة من صورة تسمي Slice."

• في الشريط Behaviors بجوار علامة ال + سيسألنا أي Behavior سنضيف علي الشريحة Slice نختار Set pop-up menu .
• إذا لم يظهر لنا السؤال المذكور, نحدد ال Slice ونضغط علي + ونختار من القائمة الظاهرة Set pop-up menu .

ملاحظة: "في الغالب يظهر لون ال Slice بالأخضر الخفيف."

• الأن وقد ظهر لنا صانع ال pop-up menu, نضغط مرتين بأسفل كلمة Text ونكتب Yahoo! وذلك لإضافة أو محتوي في القائمة.
• أسفل كلمة Link نكتب http://www.yahoo.com وهذا هو رابط موقع ياهوو الشهير.
• الأن نضيف Google , http://www.google.com وكذلك موقعي ISPs , http://ispweb.blogspot.com.
• يمكنك العبث بباقي الخصائص للقائمة, وانصحك بذلك لتجرب أشكال مختلفة وتصاميم للقائمة.
• أضغط علي زرار Done.

تجربة القائمة:

لتجربة القائمة تحتاج إلي تصديرها إلي صفحة HTML.

• أختار من قائمة File, الأمر Export.
• أختار الخصائص كما هو موضح بالرسم.
• اختار Save.

الأن أفتح صفحة ال HTML التي صنعتها وجرب القائمة.

تهانينا لقد صنعت لك أول قائمة منسدلة pop-up menu whith fireworks cs3.