استخدام لوحة المفاتيح الافتراضية

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

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

تعطيل زر العوده الى الخلف

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

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

في كلا الحالتين، اقترح طريقتين لحل تلك المشكله:

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

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

دعم انترنت اكسبلورر فقط

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

مواقع البنوك حماية أم مشكلة معقدة

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

أقول لهذا النوع من المدراء (بالعامّي): “من جدّكم؟”. لن اتحدّث عن نسبة الناس الذين يستخدمون متصفّحي فايرفوكس وكروم، فنحن في عام 2011 ولسنا في عام 2000، أي ان دعم الثلاث متصفّحات تلك (اكسبلورر، فايرفوكس، كروم) بشكل كامل هو أمر بديهي لا يحتمل النقاش، ولا يوجد مبرّر لعدم دعم أي واحد منها (قد استثني اكسبلورر 6 من هذه الجمله، لان فعلياً لا يستحق الدعم).

كلمات مرور مؤقته طويلة

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

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

في نهاية الأمر هي كلمة مرور مؤقته يفترض ان صلاحيتها ستنتهي في فترة قصيرة جداً، فلماذا تكون طويلة أصلاً؟ ماهي نسبة معرفة أحد الاشخاص لكلمة مرور الحساب وتخمين كلمة المرور المؤقته في الوقت ذاته؟

تفعيل المستفيد عن طريق الهاتف

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

حسناً، جميل، ماذا لو كنت مسافراً خارج المملكة؟ والأسوأ: ماذا لو كنت أدرس خارج المملكة وأملك حسابي في البنك المحلي؟ لماذا لا يرسل البنك كلمة مرور مؤقته في رسالة نصّية الى الجوال المسجّل تسمح بتفعيل المستفيد بما ان الجوال هو وسيلة التحقّق هنا؟

منع “اللصق” في النماذج

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

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

خلاصة الموضوع

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

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

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

هل هناك “طرق حماية” أخرى لم أذكرها في هذا الموضوع؟ شاركنا بها في التعليقات.

الخطوة الأولى :

لنبدأ بخلفية 1600 × 2300 بكسيل باللون #080808  فأنا أحب أن أعمل على مستوى عالى من الوضوح ولتبقى صورك دائما عالية الجودة وواضحة التفاصيل والمعالم.ولتكون مثالية لأية أغراض للطباعة أخرى لو إحتجتها.

الخطوة الثانية :

ولتجعل الخلفية هذه مشوقة أكثر ونستطيع أن نطلق عليها اسم “body” قمت بإستخدام ”  free stained paper texture” . عدل  نمط blending   ليصبح hard light  . ثم خفض عدم الشفافية حتى نسبة 30 %.

تصميم بوستر لبطل خيالى

الخطوة الثالثة:

ضع صورة Nebula image فى طبقة جديدة أعلى هذا النسيج. قم بتدويرها وبإستخدام ( Hue Saturation (192, 26, 0 . من المفترض أن يعطيها هذا التأثير لونا أزرقاً كما هو واضح بالصورة أسفله. والآن بالإستعانة بأداة القناع mask tool  لدمج الصورة بالخلفية. عليك الانتباه أنه فقط اليمين ، اليسار والأسفل هم الاتجاهات المفترض لها أن تدمج
(لاحظ  الصورة أسفله ).

تصميم بوستر لبطل خيالى

الخطوة الرابعة:

الخطوة التالية هى وضع صورة للأفق  horizon image وكما فعلنا سابقا قم بتعديل نمط المزج هنا blending mode إلى soft light . لقد قمت بنسخ هذه الصورة لأجعل تفاصيلها تتضح أكثر. وبإستخدام أداة الميل gradient tool قم بمسح الصورة من الأعلى. نريد أن نرى فقط الجبل والصخور وبعض أجزاء صغيرة من السماء.

تصميم بوستر لبطل خيالى

الخطوة الخامسة:

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

تصميم بوستر لبطل خيالى

الخطوة السادسة:

بإستخدام أداة الرسم القلم   pen tool  قم برسم شكل كما هو موضح بالصورة أسفله على خد هذه المرأة. لمعرفة الألوان المستخدمة ونمط هذه الطبقة يرجى ملاحظة الصورة بالأسفل جيدا فكله موضح بها. الشىء المتبقى الآن هو إعطاء هذا الشكل المرسوم نمط ناعم وخفيف  soft light blending  ، وإسقاط ظل من الأعلى بعدم شفافية 25 %. ولجعل الشكل ممزوج أكثر يمكنك عمل قناع “mask” وبإستخدام فرشاة ناعمة على الجزء الأيسر من هذا الشكل.

تصميم بوستر لبطل خيالى

الخطوة السابعة:

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

بإستخدام  scratched metallic texture pack لإضافة بعض الخدوش على هذا الشكل . قم بوضع هذا النسيج على خلفيتنا. والصقها كما هو موضح هنا فى الصورة. اجعل عدم الشفافية ما بين 20 و 40 %.

تصميم بوستر لبطل خيالى

الخطوة الثامنة:

الآن قد وضعنا هذا القوام المعدنى . وعلينا أن نضع المزيد من التفاصيل لذها الشكل. قم بتحديد  computer chips stock وضعها فوق الشكل بعدم شفافية 85 % . نمط المزج يكون ناعم خفيف blending mode: soft light)) . وبإستخدام أداة القناع mask tool قم بلصقها فوق الشكل . عادة ما أستخدم فرشاة ناعمة حول هذه الحواف لأقوم بدمجها مع بعضها البعض . فى النهاية ، أقوم بوضع طبقتين جديدتين حيث أقوم برسم بعض النقاط باللون الأزرق وبعض الأشكال البراقة فعطاء الشكل المزيد من العمق. لعمل هذه النقاط فوق الشكل أكثر لمعاناً يمكنك إضافة ميل شعاع أبيض white radial gradient.

تصميم بوستر لبطل خيالى

الخطوة التاسعة:

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

تصميم بوستر لبطل خيالى

الخطوة العاشرة:

لو اتبعت كل هذه الخطوات السابقة وكافة التفاصيل الموضحة أعلاه فيمكننا القول أنك حصلت على صورة مشابهة لهذه الموضحة أسفله. ولجعل الشخصية أكثر قربا إلى الاسم  super hero !! قمت بإضافة بعض اللمعان لعينيها . فقد قم بإستخدام   radial gradient أعلى عينيها بلون  #10bdee واضبط عدم شفافيتك على 50 % واستايل الطبقة على screen.

تصميم بوستر لبطل خيالى

الخطوة الحادية عشر:

قم بعمل ملف بإسم  color adjustments وضعه أعلى طبقاتك. بهذا الشكل سوف يؤثر على كافة الطبقات أسفله.

اللون المستخدم هو  #020317، وعدل استايل الطبقة على screen

ضبط إعدادات اللون كالتالى:

Reds: +37, -10, -33. +30
Yellow: +25, 0, -15, 0
Neutrals: +5, 0, +2, +2
Blacks: +20, 0, 0, 0

الإضاءة والوضوح: Selective color:

Brightness: 11
Contrast: 7

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

تصميم بوستر لبطل خيالى

الخطوة الثانية عشر:

قم بإختيار طبقة صورة المرأة. وبإستخدام أداة marque  أو lasso قم بعمل تحديد للمنطقة التى تريد القص منها. انسخ المنطقة المحددة والصقها على نفس المكان. وبإستخدام inner shadow ستحصل على نتيجة مشابهة للموجودة بالأسفل. وفيما يخص جزء الذراع قمت بعمل شىء مختلف. قمت بعمل تحديد وملأته باللون  #705e53. وقمت بإعطائه  inner shadow.

تصميم بوستر لبطل خيالى

الخطوة الثالثة عشر :

بالنسبة للذراع ، يمكنك استخدام الخطوات التى ذكرتها للأشكال التى رسمت على الوجه. فقط الشىء الذى سيضاف هو هذا الرمز الذى تراه ملصق على الذراع. قم برسم هذا الشكل بواسطة القلم pen tool وقم بملأه باللون #FFFFC1. يمكنك أن تضيف  inner shadow..

تصميم بوستر لبطل خيالى

الخطوة الرابعة عشر:

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

تصميم بوستر لبطل خيالى

الخطوة الخامسة عشر:

لإنهاء العمل هنا باقى فقط إضافة النص. لقد قمت بإضافة نص هنا ووضعت فوقه بعض الصواعق البرقية. ولفعل هذا، قم بنسخ صاعقة برقية على النسيج الصلى “canavas” ، وضعها أعلى طبقة النص واجعل نمط المزج الخاص بها على   overlay

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

نوع الخط الذى استخدمته هو “The Sans”

آخر لمسة على صورتنا هذه ستكون كالتالى :

من قائمة   filter  اختر sharpen . واجعله على نسبة 30 %.

وهذه هى النتيجة النهائية التى ستحصل عليها :

تصميم بوستر لبطل خيالى