تسويق مهنة التصميم

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

هذه هي الصفحة الخارجية للمطوية. ولا أدري كيف خطر لي إختيار المنظومة اللونية إلّا أني أعرف تماماً لم اخترت الخطوط. وكان هدفي التصميمي هو إعطاء النشرة صفة الخدمة الراقية. وكان من بين الخطوط التي جذبت نظري والتي كانت تعكس الأناقة هو الخط الذي استخدمته شركة Ipekyol التركية للأزياء الرجالية. وبعد رفع صورة لعلامتهم التجارية المكتوبة بهذا الخط على موقع Font Squirrel استطاعت أداة التعرف في هذا الموقع من تحديد نوع الخط المستخدم وقدمت لي عدداً من البدائل كان أقربها هو خط Wes FY. واستخدمت الخط بوزنين كما هو ظاهر في الصورة مع توسيع المسافة بين الحروف للحصول على التأثير المطلوب.
وحينما يفتح المستخدم الطية الأولى يجد الثلث الأول من الوجه الداخلي مع الثلث الأخير من الوجه الخارجي. وقد حاولت في هذا المستوى توضيح ما يتعلف باستخدام العنصرين الرئيسيين في التصميم الجرافيكي وهما المكونات الجرافيكية والخطوط الطباعية. وهنا تتغير المنظومة الطباعية فيما يتعلق بالخطوط المستخدمة. فقد اخترت أن أمثل عنوان الخطوط الطباعية بنمط مقترن بها واخترت خط Trajan القريب من الخطوط الرومانية لإضفاء صفة العراقة التاريخية الملازمة للخطوط الطباعية. أما ما يتعلق بعناوين العناصر الجرافيكية فأبقيت خط Wes-FY مع إستخدامه بمسافات متقاربة ووزن ثقيل لوقع أقوى على طريقة Helvetica. واخترت خط Rockwell للنصوص عبر المطوية كلها لأن هذا الخط يتناسق مع خط العناوين من حيث أن الأثنين من صفة الـ Geometric في حين أن خط النص يجسّر ما بين الطراز التاريخي والحداثة.
وقدمت للمستخدم مهرجاناً من الخطوط والألوان والصور حينما يفتح المطوية بكاملها. وحاولت أن أغطي جوانب العمل التصميمي من كافة نواحيه من حيث العناصر المكونة للتصاميم والتي تشمل: Images, Illustrations, Infographics, Icons وبالتأكيد Typography. ولربما التففت حول تحديات التصميم من حيث أختيار الخلفية الداكنة والتي هي بالنسبة لي أسهل من الخلفية البيضاء في التصميم.
ولتوديع المستخدم أقدم له روابط للوصول إلى المواقع التي يمكن من خلالها التعرف على أعمالي بالتفصيل بالإضافة الى تقديم معلومات للإتصال. واخترت الألوان الباردة والمريحة لسببين. الأول لأنه يعبر عن الأناقة والثقة المطلوبة في الأعمال بالإضافة الى توضيح قدراتي في التصميم ضمن منظومات لونية عديدة. وتتسق هذه الصفحة من حيث الخطوط الطباعية مع عموم التصميم مع زيادة خط مائل والذي يمثل ما يمكن إعتباره التوقيع الشخصي.
وحيث أن الموضوع يتعلق بمطوية مطبوعة على الورق حاولت أن أقيم التصميم في وضعه النهائي فقمت بطباعة المطوية عند أحدى مكاتب خدمات الطباعة في عمّان. كما قمت بتجربة وضع المطوية في مغلف يعطي للمطوية طابع القيمة العالية. والمغلف عبارة عن ورقة بوزن ثقيل ولون أزرق غامق يغلق بواسطة لصقة دائرية مختومة تحاكي وظيفة شمع الختم.
المطوية وقد تربعت بزهو على غلافها الحافظ

من أجل المقارنة

وللمقارنة أحب أن أعرض على حضرات المشاهدين الكرام تجربتي قبل ما يقارب السنة في ذات مجال تصميم المطويات والمواد الإعلانية. فقد خطر لي بعد أن أتممت خدمتي مع المنظمة الدولية التي عملت فيها لما يزيد على الـ18 سنة أن أبدأ مشروعاً في التدريب على إستخدام تطبيقات Adobe الثلاث: Photoshop, Illustrator, InDesign بالإضافة الى برمجة الإنترت باستخدام برنامج الـ DreamWeaver. وكانت المواد الإعلامية موجهة الى السوق المحلية للأردن ولذلك قمت بتنفيذها بكل من اللغة العربية والإنجليزية، حيث كان من ضمن أهداف التدريب هو اكتساب مهارات إستخدام التطبيقات مع التعرف على لغة المهنة على المستوى العالمي. ولنطلع الآن على هذه المواد الإعلامية.

مع أن النص الغالب من حيث الكمية هو النص الإنجليزي إلا أن العناوين العربية أكثر وضوحاً بحكم الألوان المختارة لها. وأغلب العناصر المستخدمة في التصميم هي من عملي باستثناء الصورة في الخلفية والخط الطباعي. ولا زلت أستخدم خط TheSans من تصميم Lucas de Groot الذي ينسجم مع الخطوط اللاتينية الى حد كبير. (تذكروا ما قلنا عن الخطوط اللاتينية في تدوينات سابقة وأنها التي تكتب بها أغلب اللغات الغربية).
وينفرد برنامج الـDreamWeaver لوحده في دورة مخصصة وذلك لأنه يجمع تحت مظلته العديد من المعارف البرمجية والتي تشمل HTML5, CSS3, JavaScript, php, MySQL. وباستثناء الـMySQL فإن برنامج الـDreamWeaver يقدم أدوات رائعة لتطوير المواقع وتطبيقات الإنترنت.
وحيث أني حاولت أن أستثمر خبرتي في العمل مع الأمم المتحدة فقد حاولت أن أقيم دورات لإرشاد الشباب الى طريقة الحصول على عمل مع منظمات الأمم المتحدة. ونرى أن الألوان المستخدمة في هذا التصميم حيادية بالمقارنة مع التصميمين السابقين وذلك لأنني بدأت التصميم بتضمين صوراً فوتوغرافية عن الأمم المتحدة ولكن بعد الإستدراك رأيت ألّا أضمّن الصور لعدم امتلاكي حقوقها. فرفعت الصور التي كانت ستكون أكثر إشراقاً على الخلفية الحيادية المختارة ووضعت عناصر جرافيكية مثل الرموز والعلامات عوضاً عن الصوّر.

الإستنتاجات

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

وختاماً وحيث أننا على أبواب أيامٍ عظيمة هي العشر الأوائل من شهر ذي الحجة، أسأل الله العظيم أن يتقبل منّا صالح الأعمال وأن يوفقنا وإياكم لكل ما هو خير.

الضوء الخافت عند نهاية النفق

ما الفرق بين تصميم الخطوط والتصميم الطباعي والتصميم الجرافيكي؟

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

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

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

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

من بعض المشاريع الأخيرة

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

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

المشروع الأول: تقرير رسمي

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

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

المشروع الثاني: ملحق كتابي عن الخطوط العربية

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

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

نصف الجواب

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

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

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

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

وصلى الله على نبينا محمد وعلى آله وصحبه أجمعين.

رحلة الألف ميل

أمثلة الحصان

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

بمناسبة ذكر الحصان أحب أن أعرض إحدى رسوماتي من العام 2010. وبدل الحصان لدينا هنا حصانان.
بمناسبة ذكر الحصان أحب أن أعرض إحدى رسوماتي من العام 2010. وبدل الحصان  الواحد لدينا هنا حصانان.

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

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

وقد تم بناء التصميم من العديد من المكونات التي شملت الصور النقطية (raster images) والرسومات الخطية (vector drawings) منها ما كان ثلاثي الأبعاد. وقد تم إنتاج ذلك بواسطة مجموعة من البرمجيات شملت فوتوشوب وإليستريتور وإنديزاين من مجموعة برامج أدوبي. أما الرسمة الثلاثية الأبعاد فقد تم إنتاجها باستخدام برنامج Sketchup. ولنبدأ بهذا الأخير لنرى كيف كان دور هذا البرنامج في مسار الإنتاج.

الـ S  تنقلك من ketchup  الى Sketchup

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

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

تم رسم الجهاز في برنامج Sketchup السهل الإستخدام. ويعجبني تحديداً تظهير الحافات بخطوط متباينة الوزن لتبريز التجسيم كما في الحافتين العلويتين في ظهر شكل الحاسوب.
تم رسم الجهاز في برنامج Sketchup السهل الإستخدام. ويعجبني تحديداً تظهير الحافات بخطوط متباينة الوزن لتبريز التجسيم كما في الحافتين العلويتين في ظهر شكل الحاسوب.

والمناسب في هذا البرنامج أنه يتيح لك تصدير الرسم بالشكل الظاهر على الشاشة بصيغة رسم ثنائي الأبعاد وبهيئة eps. وقد قمت بتصدير الرسم بهذه الصيغة الى برنامج إليستريتور حيث قمت بوضع الرتوش الأخيرة على الرسم هناك.

المعالجة ببرنامج إليستريتور

الفَرشة الطباعية في أساسها تصميم هندسي. ويناسب ذلك البرامج الخطيّة (التي تستخدم الخطوط بمقابل البرامج التي تستخدم النقاط) من مثل برنامج إليستريتور. ونفعني هذا البرنامج كثيراً في جمع العديد من مكونات التصميم وتوزيعها على الخلفية الهندسية. وتتضمن المكوّنات الرسمة التي أنتجتها في Sketchup وعالجتها في إليستريتور، كما تضمنت المكونات صور نقطية. وهذه قوة البرنامج حيث يستطيع التعامل مع المكونات النقطية كالصور ودمجها مع المكونات الخطيّة .

تم تصميم الفرشة الرئيسية وجمع المكونات ومن ضمنها الصور النقطية على الفَرشة في برنامج إليستريتور.
تم تصميم الفرشة الرئيسية وجمع المكونات ومن ضمنها الصور النقطية على الفَرشة في برنامج إليستريتور.

ومن المفيد ذكر أن إستعرت المنظومة اللونية من أداة أخرى من أدوات أدوبي من على موقع kuler. حيث تمكنك هذه الأداة من تصميم منظومات لوينة ونشرها على الموقع لاستخدام الآخرين. ويعرض الموقع عدداً هائلاً من المنظومات اللونية التي قام المشاركون بالموقع من نشرها. وهذه طريقة مهمة في استثمار التراكم المعرفي والذي يشارك فيه المهتمون من كل أنحاء العالم. فالحمد لله على نعمة الإنترنيت.

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

مرحلة إنديزاين

عقبتان تجعلانني أتردد في استخدام إنديزاين: أولاهما محدودية معرفتي بالبرنامج والثانية هي ثقل البرنامج حيث يطول مجرد تحميله على حاسبتي ذات الثمانية GB من الذاكرة ونظام التشغيل (64 bit). ولكن حينما يتعلق بتنضيد النصوص فإن البرنامج لا يعلو عليه شيء. كما أن توليده لملفات PDF متقن الى درجة ويوفر إمكانية وضع خطوط قطع الورق وعلامة تطابق الألوان ذاتياً دون أي جهد يذكر.

واخترت من جعبة الخطوط التي لدي خطين: للعناوين  خط مريم من تصميم عصمت شنبور وللنصوص خط ياقوت من تصميم نجيب جارودي (لست متأكداً من أسم الثاني فقد ورد مرة أن إسمه نحيب. هل منكم من مصحح؟). واختياري للخطين كان بحكم الضرورة لعدم وجود خطوط مناسبة أخرى. وأنا غير راضٍ تماماً عن خطوط GE من تصميم مراد (ولعله الآن قد تبرأ من هذه الخطوط كما تبرّأ من خط نسيم في مجموعة لتراسيت) وعدم ارتياحي منها لامتدادها الأفقي الغير مبرر.

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

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

الى المطبعة

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

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

مسح ضوئي للمطوية المطبوعة. لاحظ تغير الألوان عن التصميم الأصلي.
مسح ضوئي للمطوية المطبوعة. لاحظ تغير الألوان عن التصميم الأصلي.
الوجه الآخر للمطوية المطبوعة.
الوجه الآخر للمطوية المطبوعة.

أما المفاجأة الثانية فكانت في الطريقة التي تم طي الورق فيها. ونصيحتي الأخيرة هو أنه بالرغم من كل التقنيات التي تسهل عملنا اليوم فلا بد من التواجد والمتابعة المباشرة للعمل إذا كنت تريد النتيجة أقرب ما تكون من الصورة التي في مخليلتك. وقد قرأت في مكان ما أن التواجد يمثل 80% من النجاح. ولعلي أختم بحكمة جديدة قبل إنتهاء العام وهي: مصافحة يد المطبعي خير من إرساله عشرة إيميلات على الشجرة. (على الشجرة لضرورة القافية. كما أنه في النهاية مثل. كما أن المدونة مدونتي وأقول فيها ما يحلو لي – دون خدش الحياء العام أو إغضاب غضنفر)

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

التخصص

إدّي العيش لخبازه (إدّيلو)

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

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

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

تكبير لرمز القبة الخضراء والذي استخدمته في البرنامج الذي أقوم بتطويره
تكبير لرمز القبة الخضراء والذي استخدمته في البرنامج الذي أقوم بتطويره

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

ما كل ما يتمنى المرء يدركه

ولكن بعد هذا الحظ العاثر (والعاثر هنا من العثور وليس التعثر) تعثر حظي (من التعثر هذه المرة وليس العثور) حينما حاولت أن أجد خطاً مميزاً لإسم البرنامج  من خلال Google وغير Google. ويبدو أن القاعدة في زماننا هذا هو أنه حينما يحتاج المصمم الى خط عربي يناسب حاجة تصميمية محددة فعليه واحدة من هذه:

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

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

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

سود مواقعنا

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

مواقع تدعمها إقتصاديات مجدية

 

ومع تزايد أهمية المواقع الألكترونية كمصدر للمعلومات والمعرفة فإن المواقع العربية بحاجة الى إعادة النظر في مستوى أدائها البصري. وهي اليوم ليست أحسن حالاً من نظيرها المطبوع كالكتب والصحف والمجلات العربية من حيث المستوى التصميمي والإنتاجي (أنظر تدوينتي السابقة عن الكتاب العربي). وفي تقديري فإن ذلك يعود الى الأسباب التالية (إن لم يكن عندك استعداد لجرعة من الفلسفة الإقتصادية تستطيع العبور مباشرة الى الفقرة اللاحقة ولن يفوتك شئ):

  • لا يرتبط الإقتصاد والمجتمع العربي بالإنترنت إلا في مجالات محددة يغلب عليها مجال الشبكات الإجتماعية  أو الإعلام (بضمنه الجانب الترفيهي كالتمثيل والغناء الخ الخ)
  • البيئة الغير ممكنة للإبتكار والإبداع من حيث تشريعات حماية الحقوق الفكرية من جهة ومن جهة أخرى ثقافة القرصنة المتفشية في مجتماعتنا
  • الهيمنة من قبل الشركات المصنعة الغربية بدوافع “سوقية++” (على وزن ++C)
  • مستوى الحس الجمالي المقترن بالمطبوع والمشاهد في المناطق العربية. فكما أن العرض الناتج من عمل المصممين بالعربية ضعيف فكذلك الطلب ضعيف والمواصفات الجمالية المطلوبة عندنا ضعيفة في الغالب (يا جمهور، إنت ليه عايز كدة؟)
  • تكنولجيا الأنتاج مصممة أصلاً لخدمة اللغات الغربية. فالحاسبات والبرمجيات وحتى الحروف العربية أحياناً مصممة من قبل “أجانب”
محاولتي المتواضعة لبناء موقع تجاري للسوق الدولية

 

ولو جئنا الى الواقع فإن ما ذكر أعلاه لا يعفينا من مسؤولية تحسين المستوى التصميمي للمواقع العربية. فلا تزال هناك إمكانية في عمل مواقع ذات مستوى بصري مؤثر وذلك باتباع وصفة أسميتها أسس خالد لتصميم صفحات الإنترنيت والتي تتلخص فيما يلي:

  1. تحديد الغرض: ومع أن هذا ليس خاص بالتصميم البصري لصفحة الأنترنيب إلا أن تحديد الغرض وتطويع كافة التفاصيل لهذا الغرض يضفي نوعاً من الوحدة والتناسق في التصميم.
  2. التقسيم العام لمساحات الصفحة: وهذا التقسيم يأخذ شكل الجدول حيث يحتل في الغالب أسم الموقع أو موضوع الصفحة الخانة العلوية الأولى. وتوزع المواضيع في المساحات المختلفة وحسب أهمية الموضوع حيث تحتل المواضيع الرئيسية والأولى المساحة البصرية السائدة والتي تكون غالباً المساحة الأكبر وتتوسط مساحة الصفحة. ويتطلب هذا التقسيم تخطيطاً مسبقاً وهو في الغالب يتزامن مع مرحلة تخطيط الموقع بشكل عام وهو عند المصممين الجيدين يبدأ على الورق قبل الشاشة.
  3. المنظومة اللونية: وهي تحدد شخصية الصفحة. فاللون يقترن بمعاني نفسية. ومع التفسير المتباين عند الأشخاص للألوان هناك قواعد ثابتة في استخدام الألوان يشترك بها أغلب الناس الأصحاء. ويلعب العرف دوراً مهماً في نوع المنظومة اللونية المستخدمة. وهناك مواقع كثيرة تساعد في تكوين المنظومات اللونية لتصميم المواقع، والمفضلة لديّ هي: kuler وColorSchemer.
  4. أنواع الحروف الطباعية المستخدمة (الفونتات): ودور الحروف وظيفي في الأساس حيث يتم من خلالها توصيل المعنى الى مستخدم الموقع بوضوح وسهولة. كما يلعب الحرف دوراً مهماً في التصميم البصري وهو يكمل العنصران البصريان في أعلاه في تكوين البعد الجمالي لصفحة الموقع. إلا أن الفونتات التي يمكن عرضها على الصفحات تنحصر فقط في ما هو مثبت على أجهزة المستخدمين وهذا يحدد المصمم في استخدام ما يوزع من فونتات مع نظم التشغيل أي ما يأتي مع الويندوز أوالماك. وهناك حل سهل يكمن في تحويل بعض النصوص الى صور لتضمينها على الصفحات. كما يمكن استخدام طرق أكثر تعقيداً ولمن أراد التوسع يمكنه البحث على الوصلة التالية.
  5. المكملات: من الرسوم والأزرار والأدوات الأخرى. ومن الضروري أن تكون هذه المكملات ساندة للتصميم من حيث الوظيفة والتنسيق البصري.

وأرى أن الكثير من مصممي المواقع العربية مفتونون بهذه الأدوات الصغيرة (وخاصة رسومات جيف gif التي “ترتجف”) ويقيمون الموقع كله لأبراز هذه التفاصيل الصغيرة التي تنافس محتوى الموقع على جذب انتباه المستخدم. وأنا شخصياً حينما أحاول أن أركز على موضوع الصفحة تشوش عليّ هذه الرسومات المتحركة وكأنها حشرات تحتضر بعد دعسها على جوانب الصفحة.والحقيقة أنه لا ضير من الحركة البسيطة أو الهادئة. المهم أن لا تشتت الحركة انتباه المتصفح بل تساعد على خلق التأثير المناسب المنسجم مع موضوع الصفحة. وهناك الكثير من الموارد المجانية المفيدة على الإنترنيت مما يمكن الإستفادة منه كأمثلة المواقع على هذه الوصلة.

ختاماً وتغييراً للموضوع، أهدي لكم قصيدة صفي الدين الحلي “سلي الرماح العوالي عن معالينا والتي يقول فيها:

بِيضٌ صَنائِعُنا، سودٌ وقائِعُنا،        خِضرٌ مَرابعُنا، حُمرٌ مَواضِينا