المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : أركان تصميم الإستايل وطريقة تقطيعه وحفظ الصور ( الجزء الثاني ـ احتراف)



الحجازي
22 Apr 2009, 10:53 AM
http://www.ta4a.com/vb/imgcache/39578.imgcache.gif
درس تصميم ستايل احترافي
نقوم بفتح برنامج الفوتوشوب ثم نختار من قائمة
File >> new
الآن نقوم بوضع القيم التالية في مربع الحوار
http://www.ta4a.com/vb/imgcache/39579.imgcache.jpg
نقوم بتعبئة الطبقة بلون معين عن طريق أداة الدلو
( http://www.ta4a.com/vb/imgcache/39580.imgcache.jpg )
ويفضل أن يكون فاتح قليلاً
نقوم بضغط زر الـ
Ctrl + حرف الطاء
لإظهار ألشبكه
نقوم برسم مربع في أعلى الطبقة بحيث يكون طوله 10 مربعات
وبالنسبة للون فإن يكون أغمق من لون الخلفية
http://www.ta4a.com/vb/imgcache/39581.imgcache.jpg
نقوم باقتناء أداة إضافة نقطة إرساء من صندوق الادوات
http://www.ta4a.com/vb/imgcache/39582.imgcache.jpg
نقوم بوضع نقاط اسفل المربع العلوي الذي يمثل الهدر
بحيث نضع بكل طرف ثلاث نقاط متباعدة المسافه قليلا
http://www.ta4a.com/vb/imgcache/39583.imgcache.jpg
نقوم بإختيار اداة التحديد المباشر من صندوق الادوات
http://www.ta4a.com/vb/imgcache/39584.imgcache.jpg
عن طريق هذه الاداه نستطيع التحكم بالنقاط التي قمنا بإضافتها في أسفل المربع من خلال تحريكها للأسفل والأعلى
نقوم بوضع موشر الفاره فوق النقطه الاولى مع الضغط بزر الفأره الايسر والتحريك للإسفل مربعين
بحيث ينتج لنا مثل هذا الشكل
http://www.ta4a.com/vb/imgcache/39585.imgcache.jpg
نقوم أيضا بوضع مؤشر الفارة فوق النقطة الثانية والضغط بزر الفارة الأيسر والتحريك للأعلى مربع واحد فقط
بحيث ينتج لنا مثل هذا الشكل
http://www.ta4a.com/vb/imgcache/39586.imgcache.jpg
نترك النقطة الثالثة والرابع وننتقل للنقطة الخامسه ونعمل كما في النقطة الثانية تماماً
http://www.ta4a.com/vb/imgcache/39587.imgcache.jpg
ننتقل للنقطة الاخيره ونقوم بعمل كما في النقطه الاولى
http://www.ta4a.com/vb/imgcache/39588.imgcache.jpg
الان نقوم بوضع حد للشكل عن طريق تحديد اللير من صندوق الليرات وضغط زر الفاره الايمن واختيار
خيارات الدمج
http://www.ta4a.com/vb/imgcache/39589.imgcache.jpg
http://www.ta4a.com/vb/imgcache/39590.imgcache.jpg
بعد ذالك نقوم بإدراج صوره ووضعها في ساحة العمل عن طريق قصها
بعد ذالك نحدد على لير الصوره ونضغط
من لوحة المفاتيح Ctrl + U
ونعمل كما في الصوره
http://www.ta4a.com/vb/imgcache/39591.imgcache.jpg
ثم نقوم بوضع لير الصورة فوق لير الشكل تماماً ونضع الصورة في الزاوية العليا اليسرى
ونقوم بضغط
للدمج Ctrl + G
ثم نقوم بإضافة قناع دمجي
بعد ذالك ناخذ اداة التدرج اللوني ونقوم بدمج الصوره مع الشكل
http://www.ta4a.com/vb/imgcache/39592.imgcache.jpg
ثم نقوم بحذف القناع الدمجي
الان نقوم باخذ اداة تحديد العمود الواحد
http://www.ta4a.com/vb/imgcache/39593.imgcache.jpg
والتاشير بها في المكان المحدد
الان نضغط زر
Ctrl + T
ثم نقوم بتحريك لاخر الطرف الايمن
واخيرا نقوم بكتابة اسم الموقع او المنتدى وكتابة الازرار
بحيث تظهر لنا الواجهه بهذا الشكل




http://www.ta4a.com/vb/imgcache/39594.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 780x800 وحجمها 73KB.


http://www.ta4a.com/vb/imgcache/39595.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 780x800 وحجمها 73KB.
http://www.ta4a.com/vb/imgcache/39596.imgcache.gif
في النهاية اتمنى ان الشرح كان واضح .. واتمنا ان الصور ضاهره للجميع http://www.ta4a.com/vb/imgcache/39597.imgcache.gif
واتمنا من الجميع حفظ الحقوق وذكر المصدر
دمتم بخير
منقول لعيون منتديات الطيب

الحجازي
22 Apr 2009, 10:59 AM
وهذا درس ثاني اللي يبي يحترف اكثر

سم الله وابدأ بفتح الفوتوشوب
نقوم بعمل جديد
بالمقاسات التالية
http://www.ta4a.com/vb/imgcache/39598.imgcache.gulfson
طبعاً الدروس تختلف عن كل دروس الإستايلات السابقة من المصممين
وسأوضح لك كيفية تحكمك في وضع تممد أو بدون تمدد
والدروس بنيت على طريقتي في تصميم الإستايلات
:::::::::::::::::
الآن نقوم باختيار الألوان المناسبة للإستايل
وسنقوم الآن بتصميم استايل معهد فوكس الجديد معاً
فأرجوا مراعاة الألوان
نقوم الآن برسم البنر
طبعاً الطريقة بدون نقط تمدد
ويمكننا الحصو على أشكال مميزة بأداة الباث
رسمت وطلع معي هالشكل مثلاً
http://www.ta4a.com/vb/imgcache/39599.imgcache.gulfson
نقوم بتدبيل الشكل
كالآتي
باضغط على الير بالزر الأيمن
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 674x470 وحجمها 27KB.http://www.ta4a.com/vb/imgcache/39601.imgcache.gulfson
وبعد حصولنا على ليرين
نذهب لللير الأسفل
وافعل ما ترى في الصورة
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 672x484 وحجمها 30KB.http://www.ta4a.com/vb/imgcache/39602.imgcache.gulfson
ستخرج لنا نافذة
إذهب إلى هذه الخيارات
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 676x490 وحجمها 32KB.http://www.ta4a.com/vb/imgcache/39603.imgcache.gulfson
كرر الخطوات السابقة
حتى ينتج لك شكل مقبول
http://www.ta4a.com/vb/imgcache/39604.imgcache.gulfson
الآن نذهب إلى باقي أجزاء البنر
ونقوم بعمل بعض الأفكار الجديدة .. والجميلة
لمسات بسطية تعطي التصميم جمال خيالي
http://www.ta4a.com/vb/imgcache/39605.imgcache.gulfson
تابع وأضف الأزرار
وما يحتاج شرح في دروس كثيرة بخصوص الأزرار
شوف كيف طلع معي
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 768x280 وحجمها 87KB.http://www.ta4a.com/vb/imgcache/39606.imgcache.gulfson
طيب كذا تقرياً نعتبر خلصنا من البنر
طبعاً قصدي التصميم فقط
باقي كثيير تونا في بداية الطريق
نقوم الآن برسم
مستطيل .. كشيء جمالي للمنتدى
ونضيف عليه التأثيرات
http://www.ta4a.com/vb/imgcache/39607.imgcache.gulfson
الآن نقوم بتصميم أهم وزبدة الموضوع
وهي تصميم اطارات جداول المواضعيع
والناف بار وغيره ..
نقوم برسم مستطيل كالتالي
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 706x288 وحجمها 2KB.http://www.ta4a.com/vb/imgcache/39608.imgcache.gulfson
طبعاً بنفس المقاسات السابقة
نقوم بهذه الإعدادات
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 684x438 وحجمها 27KB.http://www.ta4a.com/vb/imgcache/39609.imgcache.gulfson
لاحظ اللمعة .. والتجسيم
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 692x464 وحجمها 32KB.http://www.ta4a.com/vb/imgcache/39610.imgcache.gulfson
بعد ذلك نقوم بإذافة الصور والداخلات
ويمكنك التحكم في ذلك عن طريق
CTRL+G
لاحظ
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 706x334 وحجمها 41KB.http://www.ta4a.com/vb/imgcache/39611.imgcache.gulfson
نقوم بعمل الأعمدة
ارسم مستطيلاً داخل الأول
ونقوم بوضعه عند الحافة
http://www.ta4a.com/vb/imgcache/39612.imgcache.gulfson
قم بالدخول على
استايل الطبقة
واختر التدرج اللوني
http://www.ta4a.com/vb/imgcache/39613.imgcache.gulfson
ثم كرر نفس الخطوات من الجهة الأخرى
وكذلك كرر خطوات
الإطار العلوي
شاهد ما نتج لدي
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 692x346 وحجمها 71KB.http://www.ta4a.com/vb/imgcache/39614.imgcache.gulfson
أما الآن نجي لتقطيع
سهل وما يحتاج اي شي
شوف الصورة
http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 784x328 وحجمها 76KB.http://www.ta4a.com/vb/imgcache/39615.imgcache.gulfson


قم باختيار الأداة كما في الصورة التالية

http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 800x518 وحجمها 44KB.http://www.ta4a.com/vb/imgcache/39616.imgcache.gulfson

وقم بتقطيعه بالشكل التالي

http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 780x130 وحجمها 16KB.http://www.ta4a.com/vb/imgcache/39617.imgcache.gulfson

وقم بحفظه من القائمة

file/save for web

ستفتح هذه النافذة

وقمت بالتطرق إليها .. للتقليل من حجم الصورة ..مع مراعاة الجودة

http://www.ta4a.com/vb/imgcache/39600.imgcache.gifأضغط هنا لتكبير الصورة , مقاس الصورة الأصلي 756x532 وحجمها 48KB.http://www.ta4a.com/vb/imgcache/39618.imgcache.gulfson

1 : هذه عدد الألوان المستخدمة يمكنك تقليل الحجم إلى 200 أو 128 بس أنتبه
للجودة

2: يمكنك زيادتها بنسبة قلية جداً كـ 3%

ويمكنك ملاحظة الحجم كما هو محدد في الصورة

بعدها سوي حفظ وتكون انحفظت

حلال المشاكل
22 Apr 2009, 11:55 AM
في واحد محترف تصميم وجالس في وسطنا طالب مبتدء

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

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

نبغى نشوف تصاميم اعضاءنا الإحترافية

LoDCooL
23 Apr 2009, 04:23 AM
قريباً تصميم اسستايل من أمير الظلام

لكن خليني اتعلم شوي شوي

وخصوصاً في اوقات الاجازة اللي مثل هاذي

(قسوة زمن)
23 Apr 2009, 08:22 AM
والله وطلعت داهيه يا الحجازي

عيني عليك بارده

ابدعت اخوي

وان شاء الله نشوف التطور ملحوظ

عسوله
23 Apr 2009, 09:42 PM
درس رائع ما شاء الله

وشرح واضح :sm1:

مشكور الحجازي على الدرس الاحترافي :sm5:

ان شاء الله اليوم سهرانه الين اسويه :sm220:

حلال المشاكل
25 Apr 2009, 08:56 AM
ما شاء الله عليك يالحجازي فعلا الدرس هذا مكمل ومهمل

الحجازي
25 Apr 2009, 09:48 AM
ما شاء الله عليكم

بصراحة تشجيع يفتح النفس

ومرحبنبكم

عسوله
27 Apr 2009, 01:44 AM
معليش انشغلت اليومينن الي فاتوا ...
لكن رجعت اسوي وعندي استفسار
انا وصلت الين هنا ....



نقوم بإختيار اداة التحديد المباشر من صندوق الادوات
http://www.ta4a.com/vb/imgcache/39584.imgcache.jpg




اضغط عليها ... بس ما يطلع شي

ايش اسوي ؟؟؟؟

http://up.arab-x.com/pic/tMO85614.jpg

الحجازي
27 Apr 2009, 05:03 PM
مرحبنبك عسولة وانا اللي اعتذر عن التأخير في الرد أكثر من 15 ساعة

بعد اختيار الأداة

دبل كلك أو ضغطتين على الخط اللي عليه النقاط

وتظهر النقاط تمسكي كل نقطة وتحركيها كما تشائين

وتستخدمي الكونترول والألت في لوحة المفاتيح للتبديل والمنحنيات والزوايا

جربي وانتي بتفهمي :sm207:

واذا ما فهمتي اجهز لك شرح خاص فيديوا او تصويري ولا يهمك بس طبقي وردي لي خبر :sm113:

عسوله
28 Apr 2009, 02:34 AM
مشكور الحجازي ...
بس ما عرفت
اخترت الاداء بس ما تسوي شي حتى لمن سويت دبل كلك مو راضيه :sm215:

الحجازي
28 Apr 2009, 09:30 AM
ما هو اصدار الفوتوشوب عندك عشان الحكاية تحتلف من اصدار لإصدار

ومرحبنبك

عسوله
30 Apr 2009, 02:56 AM
معليش على التأخير حجازي ...:sm139:


اصداري العاشر عربي

الحجازي
02 May 2009, 12:25 PM
اتفضلي يا عسولة

طبعا الشرح هذا بعد تحديد كامل المساحة المطلوبة بإستخدام اداة Pen Tool

وتحديد الشكل المطلوب من نقطة الى نقطة حتى العودة الى وصع المؤشر على اول نقطة وإغلاقها

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

ونستطيع اضافة نقطة او حذف نقطة

وتحريك النقطة يتم بالضغط على كنترول control مع الضغط على النقطة المراد تحديدها

ولتحويل النقطة من زاوية الى منحنى والعكس نقوم بالضغط على Alt والضغط على النقطة

ولتحريك النقطة نقوم بالضغط على Control والإمساك بالنقطة وتحريكها كما نريد

http://www.ta4a.com/vb/imgcache/41578.imgcache.jpg[/URL (http://[URL]http://www.ta4a.com/vb)]

ولا يهمك بالي طويل على الآخر

واي سؤال او استفسار راح اكون سعيد بشرحه بالتفصيل

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

ههههههههههههههههههههههههههههههههههههههه

الحجازي
02 May 2009, 12:37 PM
على فكرة يا عسولة الشرح السابق يستخدم في تحديد اي جزء من اي صورة وقصة ولصقه في اي تصميم او صورة اخرى

وذلك بعد اكمال التحديد بالدقة المطلوبة

نقوم بالضط على الزر الأيمن واختيار mak selecion (عمل تحديد) ومن ثم قص ولصق

عسوله
03 May 2009, 03:04 AM
مشكوور حجازي ..
الف الف شكر على الشرح ...

بطبقه وارد عليك ...
الله يعطيك العافيه يارب

الحجازي
03 May 2009, 11:47 AM
بانتظار ردك ومستعد لأي توضيح

لا تترددي اهم شيء اننا نوصل للهدف

عسوله
05 May 2009, 04:25 AM
حجازي
تعبتك معايه على الفاضي :sm139:

حاولت بدل المره الف :sm215:
ما زبط معايه :sm242:

هدي الاداه مررررره صعبه ما عرفتلها مره :las1:


سويته بدونها ...
شوف كيف طلع ...
عادي مره

http://www.ta4a.com/vb/imgcache/41837.imgcache.jpg

الحجازي
05 May 2009, 11:02 AM
عسولة انا متابع جميع الدروس

وانتي سويتي نفس الخطأ في الدرس الماضي

http://www.ta4a.com/vb/showthread.php?t=49766&page=5

منطقة التمدد في الجوانب مهمة جدا

عسوله
05 May 2009, 09:58 PM
فهمني هيا حلال بس ... :sm215:
برضوا ما فهمتها :sm139:

الحجازي
05 May 2009, 10:26 PM
يا عسولة في شرح خاص بنقاط التمدد

اول شيء افهمي معنى نقطة تمدد علشان تبقيها

مثل ما قال حلال المشاكل

صغري نافذة المتصفح في منتدى الطيب وكبريه تدريجيا بتشوفي صور ثابته ومنطقة قابلة للتمدد اكيد بتفهمي قصدنا

LoDCooL
17 Jul 2009, 02:36 PM
اهلا وسهلا

عدنا الى تطبيقات الدروس من جديد << ما عنده مقدمات

الحجازي هذا التصميم شوف وين الاخظاء :sm135::



http://www.ta4a.com/vb/imgcache/59518.imgcache.gif