تصميم الويب 2.0 واجهة في فوتوشوب
إن فهم البرنامج التعليمي أدناه هو فهم أنه أسلوب ، حيث يمكنك من خلاله رسم واجهة مستخدم رسومية لموقع ويب. الملاحة الجانبية, وصفت, رؤوس, على سبيل المثال. كل نمط الويب 2.0.
إطلاق قماش جديد. اي حجم. سيكون شيئًا أكبر من 450 × 300 بكسل جيدًا. اختر أداة مستطيلة مدورة ورسم مستطيل كبير كما هو موضح في الصورة أعلاه.
انقر نقرًا مزدوجًا على طبقة Rounded Rectangular لإطلاق خيارات المزج. تغيير الإعدادات للأنماط التالية.
شبح الهبوط
التعتيم: 31 ٪ المسافة: 1px انتشار: 0 ٪ الحجم: 5px
شطبة وزخرف
العمق: 100 ٪ الحجم: 0px تليين: 0px
التدرج التراكب
انقر نقرًا مزدوجًا فوق Gradiant وقم بتعيين نقاط التوقف التالية. الموقع: 0٪ ، # 1378cd الموقع: 100٪ # 4da5f0
السكتة الدماغية
الحجم: 5px الوظيفة: اللون الداخلي: # 54abf6
لنقم بإدراج بعض النصوص أو سطور أو عنوان URL أو شيء ما. اجعله متوسطًا ومحاذاة لليمين بحيث يمكن للشعار الإقامة على الجانب الأيسر لاحقًا. دعونا نمط النص. أنا أستخدم Lucida Sans Unicode؛ 55pt؛ ناعم؛ -120 لتتبع الشخصية (تباعد الحروف). انقر نقرًا مزدوجًا فوق طبقة النص واضبط التالي خيارات المزج.
تغطية بالتدرج اللوني
انقر نقرًا مزدوجًا فوق Gradiant وقم بتعيين نقاط التوقف التالية. الموقع: 0٪ ، # 9ec7eb الموقع: 100٪ ecf6ff
ستحتاج بعد ذلك إلى إدراج الشعار على الجانب الأيسر من النص. سأستخدم مستطيل دائري مع دائرة نصف قطرها 5px لتمثيل الشعار. هنا ال خيار المزج إعدادات مستطيل دائري.
الظل الداخلي
التعتيم: 45 ٪ المسافة: 0px الحجم: 43px ؛
شطبة وزخرف
عمق: 100 ٪ الحجم: 0px تليين: 0px تسليط الضوء على وضع التعتيم: 50 ٪ تعتيم ShadowMode: 100 ٪
التدرج التراكب
انقر نقرًا مزدوجًا فوق Gradiant وقم بتعيين نقاط التوقف التالية. الموقع: 0٪ # 0e2f4a الموقع: 47٪ # 001a31 الموقع: 48٪ # 002545 الموقع: 100٪ # 0f4b7f
السكتة الدماغية
الحجم: 5px انقر نقرًا مزدوجًا فوق Gradiant وقم بتعيين نقاط التوقف التالية. الموقع: 0٪ # 1468af الموقع: 100٪ # 50abf8
دعونا نعطيه تأثير لامع قليلا. معلق CTRL والنقر الأيسر على مستطيل دائري طبقة مصغرة. عندما يتم تحديد مستطيل دائري بأكمله ، تغيير إلى أداة مستطيلة سرادق, معلق ALT ويستخلص النصف الثاني من المنطقة المحددة ؛ تماما مثل الصورة أعلاه.
إنشاء طبقة جديدة ؛ اسحبه لأعلى بحيث يجلس فوق كل الطبقات ؛ ملء الجزء المحدد باللون الأبيض [#ffffff] ؛ تغيير العتامة إلى 15 ٪.
البرنامج التعليمي سوف ينتهي هنا. كيف ستستفيد من هذا التصميم متروك لك تمامًا. عن طريق تغيير حجمها وألوانها قليلاً ، يمكن استخدامها كرأس ويب أو أزرار. إليك بعض الأمثلة.
رأس الموقع
أزرار الموقع
