الكتابة بالأشكال

الكتابة بالأشكال 1

السلام عليكم ورحمة الله وبركاتة

درس الكتابة بـ لاشكال


نبدأ ادرس

أمثلة على الدرس

خطوات التنفيذ

الخطوة الأولى

قم بفتح مساحة عمل جديدة،، عن طريق:

File >> New

ستظهر لك نافذة لاختيار إعدادات مساحة العمل ،، أدخل المقاييس التالية:

العرض:400Pixels Width:الطـول:150 PixelsHeight:الدقة النقطية: 72 Pixels/inch Resolution:نمط اللون: RGB Color Color Mode:لون الخلفية:WhiteBackground Contents:

لاحظ الصورة ...

ملاحظة: عند لون الخلفية Background Contents .. يمكنك أن تختار الخلفية الشفافة Transparent .. في حال رغبت أن تطبق التصميم بدون خلفية (كما في المثال الثاني) ..

بعد تغيير الحقول حسب المطلوب .. اضغط على .. Ok

ستلاحظ ظهور مساحة العمل كما في الصورة:

الخطوة الثانية

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

ملاحظة: يمكنك تجاهل هذه الخطوة إذا لم تكن مهمتاً بالدقة ..

ولكن إذا طبقتها .. ستكتسب مهارة جديدة يكاد لا يستغني عنها محتروفوا الفوتوشوب .. وقد تكون واحداً منهم في المستقبل

..

اتجه لقائمة View ثم ضع علامة صح عند كلمة Rulers .. أو من لوحة المفاتيح اضغط على Ctrl+r

لاحظ التغيير الذي طرأ على مساحة العمل ـ لقد ظهرت المساطر على جانبي مساحة العمل:

والآن باستخدام أداة المؤشر اسحب خطين عموديين من المسطرة العمودية (اسحب خطاً واحداً في كل مرة) .. وضع الخط الأول على الهامش الأيمن .. والخط الثاني على الهامش الأيسر ..

لاحظ الصورة بعد تنفيذ ما سبق ..

الخطوة الثالثة

في هذه الخطوة سنقوم بإضافة النص ..

في الدرس .. سأكتب رمضان كريم .. وذلك لأنني جهزته في شهر رمضان المبارك ..

عودة للتطبيق ..

اتجه لقائمة الأدوات .. واختر أداة الكتابة

في الدرس .. قمت بالتغييرات التالية:

نوع الخط:Times New Romanالحجم:60المحاذاة:لليمين اللون المستخدم:006699 #

لاحظ الصورة التوضيحية للتغيرات التي قمت بها في شريط خصائص أداة الكتابة ..

هل جهزت أداة الكتابة؟؟

جيد .. والآن لنستفد من خطوط المسطرة ..

باستخدام أداة الكتابة .. ارسم مربع للنص ما بين خطي المسطرة .. واكتب العبارة التي تريدها ..

ممتاز ..

نصيحة .. أفضل ألا تختار نصاً طويلاً .. خاصة لو كنت مبتدئاً في الفوتوشوب وتطبق الدرس للمرة الأولى .. كل ما كان النص قصيراً كان أفضل ..

لاحظ وضع بوكس الليرات بعد انتهائك من هذه الخطوة:

سنعود للنص في وقت لاحق .. أما الآن اتجه للخطوة الرابعة .. كي نرسم الشكل

يتبع

الخطوة الرابعة

1- اتجه لبوكس الليرات .. وقم بإضافة لير جديد .. عن طريق الضغط على المربع الصغير الموجود أسفل بوكس الليرات

2- اتجه لمربعات الألوان التي في قائمة الأدوات .. وغير لون مربع الواجهة للأزرق السماوي ..
وقد استخدمت هذه الدرجة: 99ccff #

3- وأخيراً .. بعد هذه الاستعدادات البسيطة .. اتجه لقائمة الأدوات واختر أداة الأشكال
اختر الشكل الذي يعجبك .. بالنسبة لي اخترت شكل الهلال كي يتناسب مع العبارة التي كتبتها ..

لاحظ الإعدادت التي قمت باختيارها في شريط خصائص الأشكال ..

بعد هذه الخطوة .. ارسم الشكل بجانب النص ..

شاهد وضع مساحة العمل وبوكس الليرات بعد هذه الخطوة ..

لاحظ أنني قمت بوضع شكل الهلال على هامش خط المسطرة في مساحة العمل ..

الآن .. يمكنك أن تنتقل للخطوة الخامسة .. أو يمكنك أن تطبق معي هذه الخطوة التجميلية البسيطة ..
سنقوم بإضافة ظل لشكل الهلال .. ستكون النتيجة رائعة .. أعدك بذلك!

4- اتجه للقائمة الرئيسية .. وطبق ما يلي:
Layer >> Layer Style >> Drop Shadow…


ستظهر لك نافذة كبيرة .. كل ما عليك فعله هو الضغط على OK

والنتيجة:




نعم .. وأنا أيضاً ..

بالمناسبة .. لقد انتهينا من تصميم البرواز الأخير

الخطوة الخامسة

حان وقت الجد ..

ركز معي ..

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



لا ترتبك .. الأمر بسيط .. فقط تابع معي ..

1- اتجه لبوكس الليرات .. سنقوم بشيء بسيط جداً جداً جداً ...

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

لاحظ الصورة المتحركة:

2- مازلنا في بوكس الليرات .. اتجه للير النص .. وقم بنسخه ..

لاحظ الصورة التوضيحية بعد أن قمت بنسخ لير النص ..



3- مازلنا نعمل في بوكس الليرات .. سنقوم بتغيير نوع اللير الذي قمنا بنسخه .. سنحوله من لير نص إلى لير عادي ..

تذكر أن لير copy رمضان كريم .. مازال مفعلاً ـ أي أن لونه أزرق فاقع ـ

اتجه للقائمة الرئيسية وطبق ما يلي:

Layer >> Rasterize >> Type



لاحظ شكل اللير في بوكس الليرات بعد هذه الخطوة ..

قبل بعد

بالمناسبة: يمكننا أن نطبق الخطوة السابقة (تغيير نوع اللير) بطريقة أخرى .. في بوكس الليرات .. انقر بالزر الأيسر من الفأرة (الماوس) على لير النص الذي ترغب بتغيير نوعه كي تنشطه أو تفعّله .. ثم اضغط عليه مرة أخرى بالزر الأيمن من الفأرة (الماوس) ستظهر لك قائمة .. اختر منها Rasterize Type ..

شيء أخر عن هذه الأمر .. بعد أن تغير نوع لير النص إلى لير عادي .. لن تتمكن من تعديل النص .. لأن البرنامج سيتعامل معه كصورة .. لذا تأكد جيداً مما كتبته قبل أن تنسخ لير النص وتحوله لصورة ..

4- ارفع علامة العين عن لير النص الأصلي .. والطريقة سهلة .. فقط انقر بالزر الأيسر من الفأرة (الماوس) على علامة العين الموجودة على يسار لير رمضان كريم ..

شاهد الصورة التوضيحية بعد هذه العملية ..

كل الخطوات التي طبقناها في الخطوة الخامسة .. لن تلاحظ أي تغيير فعلي لها على مساحة العمل .. ولكن تنفيذها ضروري جداً لمتابعة بقية الدرس دون أخطاء ..

جيد حتى الآن .. لقد رتبنا أمورنا في بوكس الليرات

انتقل للخطوة السادسة .. كي نعمل قليلاً على مساحة العمل ..

الخطوة السادسة

هذه الخطوة أشبه باللعبة .. باختصار سنقوم بالآتي .. سنحذف حرفاً من النص .. ثم سنقوم بنسخ اللير .. بعدها سنرفع علامة العين عن اللير السابق .. لنحذف حرفاً آخر من اللير الجديد .. ثم ننسخه .. ثم نرفع علامة العين .. ثم ..........

عفواً .. هل سنتابع التطبيق أم ماذا ؟؟!!

عذراً لقد استرسلت قليلاً ... هههخخخ

احم .. لنتابع ..

1- في بوكس الليرات تأكد من أن لير copy رمضان كريم قد تم تفعيله ـ أي أن لونه أزرق فاقع ـ

2- اتجه لقائمة الأدوات واختر أدام الممحاة

وبالنسبة لإعدادت الأداة .. لقد اخترت الممحاة الدائرية ذات الحواف الحادة .. بحجم 19 بيكسل ..

ثم اتجه لمساحة العمل وامسح الحرف الأخير من عبارتك ..

بالنسبة لي سأمسح حرف الميم من كلمة كريم ..
لاحظ شكل مساحة العمل أثناء تنفيذ هذه الخطوة ..

3- عودة لبوكس الليرات .. قم بنسخ لير copy رمضان كريم .. ثم ارفع علامة العين عنه ..

لاحظ بوكس الليرات عندي بعد أن طبقت ما سبق:

4- تأكد من أن اللير الجديد الذي قمت بنسخه .. واسمه عندي copy 2 رمضان كريم قد تم تفعيله .. أي لون أزرق ..

ثم مرة أخرى .. باستخدام أداة الممحاة .. امسح الحرف الأخير عندك ..

بالنسبة لي سأمسح حرف الياء ..
لاحظ مساحة العمل بعد تنفيذ ما سبق:

5- عد لبوكس الليرات .. وانسخ اللير الذي عملت عليه قبل قليل .. واسمه عندي copy 2 رمضان كريم .. ثم ارفع عنه علامة العين ..

6- تأكد من تنشيط اللير الجديد .. واسمه عندي copy 3 رمضان كريم ثم باستخدام أداة الممحاة امسح الحرف الأخير .. وعندي سأمسح حرف الراء ..

شاهد وضع مساحة العمل مع بوكس الليرات بعد تنفيذ ما سبق ..

7- كرر هذه العملية إلى أن يتبقى لديك حرف واحد فقط ..

شاهد وضع بوكس الليرات ومساحة العمل بعد أن انتهيت من عملية النسخ والحذف ..

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

تنويه: إذا كنت تستخدم الإصدار السابع 0.7 أو الثامن cs .. أو التاسع sc2عليك أن تنتقل لبرنامج الإمج ردي ..

إذا كنت تستخدم الإصدار التاسع cs2 أو العاشر cs3 أو الحادي عشر cs4 يمكنك تنفيذ هذه الخطوة في الفتوشوب نفسه ..

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

انتقل للخطوة السابعة ..

الخطوة السابعة


1- إن كنت من محبي الدقة في التصميم .. أنصح بسحب خط أفقي من المسطرة الأفقية .. ضعه في أعلى الشكل الذي قمت برسمه .. سيسهل عليك التطبيق ..

وبالنسبة لتصميمي .. سأضعة في أعلى الهلال ..

لاحظ مساحة العمل عندي بعد تطبيق هذه الخطوة ..

2- والآن سنحتاج لصديقنا القديم شريط الحركة Animation .. تأكد من وجود شريط الحركة ..

بالنسبة لمستخدمي الإصدار التاسع فما فوق .. يمكنكم إظهار شريط الحركة في الفوتوشوب من قائمة View ثم التأكد من وضع علامة صح عند كلمة Animation ..

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

ليصبح شكله مثل هذه الصورة:

والآن بعد أن جهزنا منطقة العمل .. ووضعنا كلاً من مساحة العمل (التصميم الذي نعمل عليه) .. وبوكس الليرات .. وشريط الحركة Animation أمامنا ..


سننتقل للخطوة الثامنة ..

الخطوة الثامنة

في هذه الخطوة سنعمل على مساحة العمل .. وبوكس الليرات وشريط الحركة .. بشكل متتالي ..

1- اتجه لبوكس الليرات .. وتأكد من تفعيل لير الشكل (شكل الهلال الذي رسمناه في البداية)

لاحظ وضع بوكس الليرات بعد أن قمت بتفعيل لير الشكل .. واسمه عندي Shape 1

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

2- اتجه لبوكس الليرات .. وارفع علامة العين عن الحرف المتبقي كي نرفعه من التصميم .. واسمه عندي copy 8 رمضان كريم .. سنرفعه الآن .. ولكن سنعيده بعد قليل .. تابع ..

لاحظ وضع بوكس الليرات ومساحة العمل بد الانتهاء من هذه العملية ..

3- والآن جاء دور شريط الحركة .. اتجه لشريط الحركة Animation وقم بإضافة برواز جديد .. وذلك عن طريق الضغط على المربع الصغير الموجود أسفل شريط الحركة ..

لاحظ وضع شريط الحركة بعد أن قمت بإضافة برواز جديد ..

4- اتجه لبوكس الليرات .. وأعد علامة العين على الحرف المتبقي كي نعيده هذه المرة للتصميم.. أذكركم باسمه عندي copy 8 رمضان كريم ..

5- مرة أخرى .. تأكد من تحديد لير الشكل .. لأننا سنحركه .. ثم اتجه لقائمة الأدوات واختر أداة المؤشر أرجع الشكل قليلاً للوراء .. بحيث يظهر الحرف ..

شاهد مساحة العمل + بوكس الليرات .. بعد أن قمت بتطبيق ما سبق:

لاحظ بأنني حركت الشكل مع الحفاظ على محاذاته لخط المسطرة الأفقي ..

6- اتجه مرة أخرى لشريط الحركة .. واضغط على المربع الصغير الموجود أسفل شريط الحركة كي تضيف برواز ثالث ..

7- اتجه لبوكس الليرات .. وارفع علامة العين عن اللير الذي عملنا عليه قبل قليل .. وضعه على اللير الذي يليه .. وبالنسبة لتصميمي سأرفع علامة العين عن لير copy 8 رمضان كريم .. وسأضعه على لير copy 7 رمضان كريم ..

8- في بوكس الليرات تأكد من تحديد لير الشكل Shape 1 .. ثم اختر أداة المؤشر .. وحرك الشكل كي تظهر الحرف الذي وضعته في التصميم ..

شاهد وضع بوكس الليرات + شريط الحركة بعد تطبيق ما سبق:

إذا فهمت العملية .. تابع بقية الخطوات لوحدك .. ثم اتجه للخطوة التاسعة ..

أما إذا كنت مبتدئاً .. ولم تستطع أن تستوعب الأمر بعد .. فتابع معي خطوة بخطوة ..

9- اتجه لشريط الحركة .. وقم بإضافة برواز رابع عن طريق الضغط على المربع الصغير أسفل شريط الحركة

10- ثم في بوكس الليرات .. ارفع علامة العين عن لير copy 7 رمضان كريم .. وضعه على لير copy 6 رمضان كريم ..

11- تأكد من تحديد لير الشكل في بوكس الليرات .. وباستخدام أداة المؤشر انقل الشكل لليسار .. كي تظهر النص ..

لاحظ وضع بوكس الليرات + مساحة العمل حتى الآن ..

12- من شريط الحركة .. قم بإضافة برواز خامس .. كما فعلنا سابقاً ..

13- في بوكس الليرات .. ارفع علامة العين عن اللير copy 6 رمضان كريم .. وضعه على اللي الذي تحته كي تظهره .. واسمه عنديcopy 5 رمضان كريم ..
14- تأكد من تحديد لير الشكل في بوكس الليرات .. وباستخدام أداة المؤشر .. قم بإزاحة الشكل لليسار .. كي تظهر الحرف الجديد ..

15- قم بإضافة برواز سادس في شريط الحركة ..

16- ارفع علامة العين عن اللير الذي عملت عليه سابقاً .. وضعه على اللير الذي تحته ..
17- كما فعلنا سابقاً .. قم تحريك الشكل لليسار .. كي تظهر الحرف الجديد ..

18- قم بإضافة البرواز السابع في شريط الحركة ..

19- ارفع علامة العين عن اللير الذي عملت عليه سابقاً وضعه على اللير الذي تحته ..
20- قم بتحريك الشكل لليسار ..

تابع على نفس المنوال .. إلى أن تصل لآخر لير نصي في بوكس الليرات عندك ..

لاحظ وضع بوكس الليرات .. ومساحة العمل .. وشريط الحركة عندي .. بعد أن تابعت بقية الخطوات ..

لقد بذلت مجهوداً طيباً .. تستحق التصفيق

الخطوة التاسعة

لا تقلق .. لقد انتهينا من الجانب الصعب .. في هذه الخطوة سنقوم فقط بتعديل بيانات الحركة في شريط الـحركة Animation ..

1- سنقوم بضبط التوقيت .. باستخدام أداة المؤشر .. اتجه لشريط الحركة Animation وقم بتحديد البرواز الأول (رقم 1) أي أن بنقره بالزر الأيسر من الماوس (الفأرة) كي يصبح لونه أزرق فاقع ..
2- من لوحة المفاتيج اضغط على زر Shift .. استمر بالضغط عليه .. واتجه بالماوس إلى البرواز الأخير .. وعندي هو البرواز رقم 10 .. انقر عليه بالزر الأيسر من الفأرة (الماوس) .. ستلاحظ أنك قمت بتحديد كل البراويز ما بينهما ..

لاحظ شكل شريط الحركة بعد تحديد كل البراويز:

3- باستخدام الزر الأيسر من الماوس (الفأرة) اضغط على التوقيت الموجود أسفل أي برواز في الشريط .. لتظهر لك قائمة منسدلة .. وظيفتها اختيار المدة التي ترغب ببقاء كل برواز أثناء الحركة ..
وقد اخترت جزءً من الثانية لكل برواز 0.1 sec. .. وبما أننا حددنا كل البراوزير فإن أي تغيير سنحدثه في توقيب أي برواز ضمن شريط الحركة .. سيتم تطبيقه على البراويز الباقية تلقائياً ..

لاحظ الصورة التوضيحية أثناء اختيار التوقيت من القائمة المنسدلة ..

4- وأخيراً .. في شريط الحركة .. وأسفل البرواز الأول مباشرة .. ستلاحظ وجود سهم صغير بجانبه إحدى هذه الكلمات (Once, Forever, Other… ).. والهدف من هذا الأمر .. هو اختيار عدد مرات تكرار الحركة .. فإذا اخترت Once .. فإن التطبيق سيتم تشغيله مرة واحدة فقط .. وإن اخترت Forever فإن التطبيق سيتم تشغيله بشكل مستمر .. وإن اختر Other فستظهر لك نافذة كي تحدد عدد المرات التي ترغبه لتكرار التطبيق ..

بالنسبة لعملنا في هذا الدرس .. فسأختار التشغيل المستمر .. Forever ..

لاحظ شريط الحركة أثناء اختيار أمر التشغيل المستمر للتطبيق ..

1- بالنسبة للتصاميم المتحركة التي تبدو كقصة .. مثل عملية كتابة النص بشكل متقطع .. يستحسن أن نضع نهاية لها .. فإن تكرار النص بشكل مستمر .. ترهق العين .. ولا تمنح المشاهد فرصة لاستيعاب ما شاهده .. لذا أنصح دائماً في مثل هذه التصاميم المتحركة .. أن نغير توقيت البرواز الأخير .. ونتركه يبقى لفترة أطول من بقية البراويز ..



لهذا السبب .. اتجه للبرواز الأخير في شريط الحركة عندك .. وبالنسبة لتطبيقي فهو البرواز رقم 10 .. قم بتحديده بالماوس (الفأرة) حتى يتحول لونه لأزرق فاقع .. بعدها اضغط على عبارة 0 sec.الموجودة أسفله .. وعند ظهور القائمة المنسدلة اختر 2.0 .. وبذلك أمرنا البرنامج أن يبقى البرواز الأخير من التطبيق مدة ثانيتين كي يستوعبها عين المشاهد .. يمكنك أن تزيد المدة أو تنقصها حسب رغبتك ..

شاهد الصورة التوضيحية أثناء اختيار التوقيت الملائم للبرواز الأخير ..

شكراً لأنك تابعت الدرس حتى هذه المرحلة

لمشاهدة تطبيقك قبل أن تخزنه .. اضغط على زر التشغيل الموجود أسفل شريط الحركة ..





تستحق هذه اللحظة ..

لقد شارفنا على النهاية .. انتقل للخطوة العاشرة والأخيرة ..

الخطوة العاشرة

الخطوة الأخيرة من كل تطبيق هي تخزينه ..



مرة أخرى .. إن كنت تستخدم الإصدارات القديمة .. وتمتلك برنامج الإمج ردي ..

اتجه لـ

File >> Save Optimized As







ثم اختر اسما مناسبا واضغط OK

--------

أما إن كنت تستخدم الإصدرارات الحديثة التي لا تحتوي على الإمج ردي ..

فمن برنامج الفوتوشوب .. اتجه لقائمة File .. ثم اختر أمر Save for Web & Devices…

شاهد الصورة التوضيحية ..

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

ستظهر لك نافذة أخرى .. اختر اسماً للتصميم .. واختر أمر Save ..

وهذا تصميمي بعد أن قمت بتخزينه

جميل!

أرجو أن أكون قد وفقت في تبسيط خطوات الدرس ..

درس رائع يامعاند الجرح سلمت وسلمت يدينك

تحياتي وتقديري لك ولأبداعك الرائع

يثبت اسبوع

يا هلا وغا بك يا رعد نورت

لاهنت التثبيت

يعطيك الف عافيه يا بو مسلط

درس راايع وسهل

شكراً

^
^

تسلم يامعاند على الدرس وماقصرت


..................