درس فى عمل واجه موقع ( Home Page ) للمحترفين

[kaito kodo]

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

كيف حال الجميع أتمنى أن يكون الجميع بخير وان يكون الجميع قد أنهى الأمتحانات على خير أن شاء الله .
اليوم أقدم لكم درس فى تصميم واجهه موقع أو Home Page لقد قلت لنفسى أن أقدم للجميع درس قوى بمناسبه أنتهاء
موسم الأمتحانات أتمنى أن يعجبكم الدرس أن شاء الله وأى سؤال فى الدرس أنا حاضر لإجابه أى سؤال أن شاء الله والأن إلى الدرس .

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

يجب عند تصميم واجهه موقع ان يكون هناك دقه كبيره جدا فى ترتيب العمل لذلك سنقوم بأضافه Grid للعمل
وهذا الأختيار يمكننا من تحديد المساحه التى نريدها من خلال المربعات التى ستظهر فى ساحه العمل .



ثم بعد ذلك سنقوم بأضافه Layer جديد وسيكون بالأسفل وسنحدده بثلاث مربعات من أسفل التصميم ويتم تلوينه بأى لون تختارته
أو ليتم تلوينه كما بالشكل أكتب الكود التالى 356AC8 فى المكان الموجود بالشكل وهو كود اللون طبعا




ثم بعد ذلك سنقوم بأضافه Layer جديد للعمل ولكن هذه المره سيتم أضافته من أعلى الصفحه ونقوم بأستخدام
أداه التدرج (Gradient) وذلك لأضافه تردج لونى من لونين الى هذه المنطقه .



مره أخرى نضيف Layer جديد للعمل ونحدد مربع ونصف فقط من الأعلى ثم نضيف أليه اللون بالكود السابق 356AC8
ثم بعد ذلك نفتح صندوق Blending Options ونختار منه Drop Shadow
ولمن لا يعرف كيفيه الوصول الى الى صندوق Blending Options عن طريق :
الضغط مرتين متتاليتين على اللير الذى به العمل فسيظهر لك صندوق Blending Options ونختار منه Drop Shadow
وهناك طريقه اخرى
من القائمه الرئيسيه نختار Layer > Layer Style > Drop Shadow



وعلى نفس التحديد الموجود نختار أداه Single Row Marquee ونقوم بتعبئتها
ثم نضع لها Stroke باللون الأبيض بمقدار 1 بيكسل من صندوق Layer Style كما تم شرحه بالفقره الماضيه .



بعد ذلك نقوم بأضافه Layer جديد وسنحدده بمربعين ونصف من بدايه أنتهاء اللون الأزرق كما بالشكل ثم نضيف أليه
تدرج لونى بلونين الأبيض والبرتقالى كما بالشكل .
ثم نضيف له Drop Shadow



حتى الأن من المفترض ان نكون قد وصلنا الى هذه المرحله من الشكل ومن لم يصل الى ذلك الشكل فهناك خطأ ما لديه
فعليه مراجعه الخطوات



بعد ذلك نقوم بأضافه بعض اللمسات النهائيه للواجهه والمواضيع التى سوف تكتب بها مثل ما تم أضافته للشكل
وبعض الخطوط أيضا والرموز للخروج بالشكل النهائى كما هو بالشكل



أتمنى أن يكون الدرس قد حاز على رضاكم وأعجابكم
وكل ما أرجوه منكم الدعاء الصالح
وشكرا جزيلا لكم مع تحياتى
Kaito Kodo

[الكونتيسة]

يسعدني ان اكون اول من يجيب في موضوعك الرائع مشرفنا المبدع
الموضوع متكامل ومتقن وخاصة صورة كونان وران اعجبتني في الاخر
جازاك الله خيرا للدرس

[kaito kodo]

بل الشكر لكى اختى على المرور الطيب جدا
والحمد لله ان الدرس اعجبك
وشكرا لكى على الدعاء

[Ayato]

الف شكر لك اخى على الدرس الرااائع حقآ ... والله يعطك العااافيه ^____^

[Ai-Kun]

مشكووووور على الدرس الرائع

مع تحياتي

[dead heart]

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

ثم بعد ذلك سنقوم بأضافه Layer جديد وسيكون بالأسفل وسنحدده بثلاث مربعات من أسفل التصميم ويتم تلوينه بأى لون تختارته
أو ليتم تلوينه كما بالشكل أكتب الكود التالى 356AC8 فى المكان الموجود بالشكل وهو كود اللون طبعا




ثم بعد ذلك سنقوم بأضافه Layer جديد للعمل ولكن هذه المره سيتم أضافته من أعلى الصفحه ونقوم بأستخدام
أداه التدرج (Gradient) وذلك لأضافه تردج لونى من لونين الى هذه المنطقه .
Kaito Kodo

اخوي في خطأ في الصوره انت حاط صوره غلط بس مشكور ع الدرس

[kaito kodo]

شكرا لأياتو وهايبرا اى على المرور
وشكرا dead Heart على المرور والتنبيه
وقد تم التعديل .

[محبة الربيع]

السلام عليكم،

مشكوراخوي على الدرس القيم وانا تعبت من كثر ما اقرأ

في كتب التصاميم وعلى الفاضي ما فادتني في شي بس الحمدلله

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

وسلام،
محبة الربيع

[kyubi rasengan]

السلام عليكم ...
مشكوووووووور على الدرس
عجيييييييييييب عجبني جداً
وهذا تطبيق مع انك ما طلبت

[dead heart]

مشكور اخوي كايتو كودو ع الدرس وهذا تطبيقي انا بحطه في موقيعي

[جنى الورد]

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



إن شاء الله اعجبك
أختك جنووو
:cool21:

[A-M-Makkawei]

مشكوووووووووور يا مشرفنا ^^

وقد تم حفظه ضمن سلسلة الدروس القيمة لتطبيقه فيما بعد ^.^

دمت بود

اسيروووووهـــ،ـ،ـ،ـ

[kaito kodo]

السلام عليكم،

مشكوراخوي على الدرس القيم وانا تعبت من كثر ما اقرأ

في كتب التصاميم وعلى الفاضي ما فادتني في شي بس الحمدلله

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

وسلام،
محبة الربيع

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

[kaito kodo]

السلام عليكم ...
مشكوووووووور على الدرس
عجيييييييييييب عجبني جداً
وهذا تطبيق مع انك ما طلبت


http://www.9q9q.org/index.php?image=RbhIjHsrO8a7ut

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

[kaito kodo]

مشكور اخوي كايتو كودو ع الدرس وهذا تطبيقي انا بحطه في موقيعي

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

[kaito kodo]

مشكووووور أستاذنا ع الدرس الراااااائع

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

إن شاء الله اعجبك
أختك جنووو

:cool21:

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

[kaito kodo]

مشكوووووووووور يا مشرفنا ^^

وقد تم حفظه ضمن سلسلة الدروس القيمة لتطبيقه فيما بعد ^.^

دمت بود

اسيروووووهـــ،ـ،ـ،ـ

العفو أخى وشكرا لتصيف الدرس فى قائمه الدروس القيمه
وشكرا ك على المرور وبانتظار التطبيق أن شاء الله تعالى .

[Hunter Boy]

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

[نقاء الروح]

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

مشكووووووور أخي الكريم ع الدرس الرائع بارك الله فيك

وأنا سويت بندر :yes2: بدل واجهه لموقع

وأن شاء الله يعجبكم يارب






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

[MAISONA]

أريغاتوووووووووووه أخوي كايتو كودو على الدرس الرااائع ....

مبدع أخوي ومشكوووووووووور على مجهوودك.