©°¨¨¨™¤¦¤™«رًٍُْوعـْ~ًٍَُِـة الكْـ~ًًًٍُِــوًًًًًًٍِن»™¤¦¤™¨¨¨°©

©°¨¨¨™¤¦¤™«رًٍُْوعـْ~ًٍَُِـة الكْـ~ًًًٍُِــوًًًًًًٍِن»™¤¦¤™¨¨¨°©
 
الرئيسيةالرئيسية  مكتبة الصورمكتبة الصور  س .و .جس .و .ج  بحـثبحـث  التسجيلالتسجيل  الأعضاءالأعضاء  المجموعاتالمجموعات  دخولدخول  

شاطر | 
 

 :::1:::درس تصميم الهيدر(دورة تصميم واجهة موقع)

اذهب الى الأسفل 
كاتب الموضوعرسالة
Admin
Admin
avatar

عدد الرسائل : 15
تاريخ التسجيل : 21/11/2007

مُساهمةموضوع: :::1:::درس تصميم الهيدر(دورة تصميم واجهة موقع)   03.12.07 14:55

السلام عليكم اخواني


طبعا مواضيع الدورة منقولة


وحقوق الدروس كلها للأخ المبدع الاستاذ المعاقب

جزاه الله خير الجزاء


وقد نقلتها لكم للإستفادة لا غير




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

ولنقل بسم الله ونبدأ بالدرس

1- طبعا هذه الخطوه هي اهم خطوه في تصميم واجهتك وهي انتقاء الالوان الخاصه بالتصميم
وعليك قبل البدء بالتصميم ان تختار الوانك بعنايه حتى يظهر تصميمك في اروع مظهر
وقد وضعت لكم في هذا الدرس بعض من امثلة الالوان وتدرجاتها لتساعدك على الاختيار
ويمكنك حملها والقائها في الفوتوشوب وعن طريقة اداة الشفاطه معرفة كود اللون

- اللون البرتقالي (وهو المستخدم بهذه الدورة)


-اللون الازرق


-اللون الاحمر


2-بعد اختيار الالوان افتح عمل جديد File>>>>New او بالضغط على Ctrl+N



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



الان قم بأختيار الوانك حسب الجموعات في الخطوه الاولى او اي الوان اخرى تحبها


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

هكذا نكون قد انتهينا من تجهيز مسرح العمل بالالوان الازمه لبدء العمل

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

أنقر هنا لتحميل الملف

4-بعد رسم الاشكال وتفنن بها حسب ما تشاء سيظهر لنا هذا الناتج على سبيل المثال





اولا: قم بتكرير كل طبقه على حدا




كما لاحظنا اصبح لدينا من كل طبقه اثنين

الان نحدد اللير الجديد من كل مجموعه ونحرك لأسفل قليلا ولليسار قليلا على ان يكون على نفس امتداد اللير الاول

بعد ذلك نختر من قائمة اللير Blending option



ونضع لها الخيارات كما في الصور بالاسفل





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






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


(الان انتهينا من تشكل الهيدر واضافة الاشكال)

نأتي الان لأضافة الصور الخاصة بالهيدر

نحضر الصور المراد اضافتها ولنفترض بأنها هذه الصورة



نحملها ونضعها على الفوتوشوب ونقوم بقصها حسب ما تراه مناسب وتصغيرها بالضغط على Ctrl+ T
ونضعها فوق الليرات الثلاث الاولى



الان نحدد لير الصورة ونضغط على Ctrl+ G لدمجها مع اللير الاول من المجموعه ونغير المود للير الى Multiply



ونكرر العملية مع الشكلين الباقيين وهذه هي النتيجه النهائية



الان لنقوم بوضع بعض الجماليات على الاشكال

حدد اللير المدموج مع الصورة اي اللير الاول من كل مجموعه واذهب الى
Layer>>layer style>>Blending Option

وضع الاعدادات كما في الصور




طبعا البترن المستخدم هو بترن النقط المحفورة وسأرفقه مع الدرس

وهذه هي النتيجه



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

الان قم بعمل Link على كل ثلاث ليرات متشابهة وايضا الصورة المدموجه بأحدهم كالتالي



ومن ثم نضغط من الكيبورد على Ctrl+ E ونكرر العملية على باقي الليرات ولا تنسى ان تكون اليرات متشابهة يعني كل مجموعه على حدى

وهذه النتيجه النهائية



لاحظ بأنك لن تستطيع التغيير على الاشكال بهذه الطريقة لأنها ستصبح بمثابة صورة

الان لنقم بتحريك الاشكال وتصغيرها وذلك بتحديد اللير والضغط على Ctrl +T وهذه النتيجه



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

حركة اضافة بواسطة فرش السلك او القضيب المعدني


وهذا تطبيقي على الدرس




الان قم بالسحب والالقاء على مساحة العمل وتذكر ان تدمج اللير الاول والثاني اي لير السلك ولير الفرش مع بعض بأستخدام طريقة الـ link التي شرحتها منذ قليل

لاحظ بأن السلك حجمة كبير وميلانة لن يساعدنا لوضعه بالهيدر فماذا الحل

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



ستلاحظ احيانا ان السلك غير واضح او قليل نسبيا لا تهتم قم بدبل اللير اي تكريره وبيصير تمام

الان كرر ما قمت بفعله لتحصل على هذه النتيجه



وبالتأكيد هناك الكثير من الفنيات الجميله للهيدر وانا اعطيت الاساسيات وعليك العمل والابداع لتصل الى الجمال التي تريد لتصميمك

وهكذا اكون قد انتهيت من الدرس الاول والحمد لله

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

واي سؤال او استفسار انا جاهز وتحت امركم

واتمنى من الله العلي القدير ان اكون قد وفقت في هذا الشرح

وان اكون قد قدمت ما هو مفيد وجيد

وانتظروني بالدرس الثاني من هذه الدورة

دمتم بكل ود

انتظر تطبيقاتكم يا مبدعين

^__^
الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو http://h1m1.yoo7.com
 
:::1:::درس تصميم الهيدر(دورة تصميم واجهة موقع)
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
©°¨¨¨™¤¦¤™«رًٍُْوعـْ~ًٍَُِـة الكْـ~ًًًٍُِــوًًًًًًٍِن»™¤¦¤™¨¨¨°© :: ::• المنتديات التقنية •:: :: منتدى التصميم والجرافيك-
انتقل الى: