إخفاء تكرارات الخلفية

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

بالرغم من جمالية هذه الطريقة، إلا أن الصور أحياناً لا تخدم هذا الغرض، ولكن لا تقلق؛ فإعدادها ليس بتلك الصعوبة.

إخفاء تكرارات الخلفية

بما أني من محبي أسلوب الجرونج (Grunge)، سنستخدم في مثالنا هذه الصورة من TextureKing.com (قمت بتصغير الصورة إلى 800X600 بيكسل لتلبية غرض هذا المثال).
صورة المثال من TextureKing.com

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

الصورة مكررة قبل المعالجة

لتصحيح ذلك نقوم بما يلي:

1. تطبيق فلتر الإزاحة:

نحتاج في البداية لرؤية الفواصل التي سنقوم بمعالجتها ويتم ذلك باستخدام الفلتر Offset الموجود ضمن القائمة الفرعية Other في نهاية قائمة الفلاتر.

نستخدم نصف قيم أبعاد الصورة، لذلك استخدمت 400 للإزاحة الأفقية حيث أن عرض الصورة 800 بيكسل، و 300 للإزاحة العمودية لأن ارتفاع الصورة 600 بيكسل، مع ملاحظة تفعيل خيار Wrap Around.

Offset Filter

لاحظ انتقال كل ربع من الصورة إلى الجهة المقابلة أفقياً وعمودياً.

الصورة بعد الإزاحة

2. إخفاء الحدود الظاهرة:

هناك عدة أدوات محتملة لتنفيذ هذه الخطوة كأدوات Clone Stamp Tool و Batch Tool أو غيرها تبعاً للصورة المستخدمة والنتيجة المطلوبة، استخدمت لهذه الحالة أداة Healing Brush Tool لأنها تحافظ على تجانس ألوان منطقة العمل.

Healing Brush Tool

بعد تحديد الأداة نقوم بانتقاء المنطقة المنسوخة بضغط Alt (أو Option على Mac) مع الضغط بالماوس على مكان متجانس من الصورة. ثم نقوم بالرسم على الحدود لدمجها وإخفائها.

طريقة إخفاء الحدود

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

إخفاء الحدود الأفقية

ثم ننتقل للحدود الشاقولية.

إخفاء الحدود الشاقولية

3. عكس الإزاحة:

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

عكس فلتر الإزاحة

وبذلك نحصل على هذه النتيجة.

الصورة بعد عكس الإزاحة

4. لمسات أخيرة:

إذا جربت تكرار الصورة الآن سترى أن التكرار لا يزال ملحوظاً بسبب بعض النقاط المميزة ضمن الصورة، كالنقطة القاتمة في الزاوية السفلية اليسرى.

تكرار الصورة بعد إخفاء الحدود

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

الصورة بعد إخفاء النقاط المميزة

وهنا النتيجة النهائية للتكرار.

التكرار بشكله النهائي

لا تقلق بشأن تموجات الإضاءة والألوان الظاهرة هنا لأنها لن تكون ملحوظة في الحجم الحقيقي للصورة.

نصيحة أخيرة

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

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

محمود الدعاس

من مواليد دمشق. ابتدأ بعد التخرج كمبرمج ويب عام 2005 مع شركة إيميا، انتقل بعدها إلى شركة تكنوليد للأتمتة المتكاملة ومنها إلى شقيقتها أتمتة للحلول المتقدمة كمصمم غرافيك ومصمم ومطور ويب. أسس مع مجموعة من زملاء الدراسة موقع HOMELESS-PRO.com لنشر قصص مصورة باللغة العربية للشباب، و Guestra كوكالة تصميم وتطوير.

مواضيع الكاتبموقع الكاتب

لمتابعة الكاتب:
TwitterFacebookPinterest

أضف تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *