قد يكون المشهد التالي متكرر مع كل مشروع تبدأ العمل عليه، تحدد الألوان التي ستصمم بها، ترسم تخطيط لهيكلة وترتيب واجهة الموقع … هنا سأضع الشعار، يجب أن يكون هناك سلايدر متحرك بالواجهة، هل وضعت أيقونات الشبكات الاجتماعية؟ ما هي الروابط التي سأضعها بالفوتر؟… ولكن السؤال الأكثر أهمية، هل كل الواجهات التفاعلية يجب أن يكون بها أزرار وسلايدر …  أين الإبتكار/ Innovation؟

Apple صنعت إبتكاراً في واجهات الاستخدام عندما أطلقت IPhone بتبسيط الواجهة واستخدام عناصر تفاعلية مبتكرة كـ Slide To Unlock ، ميكروسوفت صنعت إبتكاراً عندما أصدرت واجهة Metro وأطلقت التصميم المسطح Flat، ما هو الإبتكار في الواجهة التي تصممها؟ هل كل تفكيرنا يجب أن يكون منصباً على الازرار والسلايدر والwidgets؟

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

احدى المقالات التي نشرت على موقع Inside Intercom جعلتني أتوقف عند هذه الفكرة، فكرة صناعة واجهات جديدة لا تعتمد على الأدوات التقليدية من الأزرار، السلايدر، حقول الادخال وعناصر واجهات الاستخدام التقليدية:-

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

الـ Wireframe لا يجعلك تفكر خارج الصندوق

مرحلة التخطيط بإستخدام الwireframe تجبرك على إستخدام أدوات وعناصر محددة، تجعلك دائماً “تفكر داخل الصندوق”، معظم البرامج والأدوات التي تستخدمها لعمل الWireframe يوجد بها عناصر مصممة مسبقاً للازرار والسلايدر وحقول الادخال، هذه العناصر ستستخدمها في كل مرة تقوم بالتخطيط لمشروع جديد، البعض قد يقول أن في هذه المرحلة أنت لست مطالباً بإبتكار أشكال جديدة للأزرار، أنها ستكون في مرحلة لاحقة، لكن أليست هذه مرحلة التخطيط والتفكير؟! هذه البرامج ستحدد رؤيتك للمكونات المختلفة لعناصر الواجهة … فهي ببساطة لن تجعلك “تبتكر عناصر تفاعلية جديدة!“

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

التخطيط بإستخدام ال Wireframing قد لا يناسب كل الواجهات

كيف خطط مصمم واجهة موقع Squarespace الWireframe الخاص بواجهة الموقع، فرئيسية الموقع على سبيل المثال تحتل صورة الخلفية فيها 95% من مساحة الصفحة، هل وضع صندوق رصاصي كبير بالخلفية وكتب عليه “صورة” ثم وضع بضعة صناديق تمثل الأزرار بالهيدر؟! هل هكذا يجب أن نخطط للواجهات “الابتكارية”، الـ Wireframing قد لا نستطيع إستخدامه في تطبيق وتصميم واجهات بأفكار ثورية.

الواجهات الابتكارية التي تخلق جيلاً جديداً من العناصر الجرافيكية التفاعلية

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

فكرة هذا التطبيق ثورية وبسيطة جداً، كيف يمكن لنا أن نرسم الخبرة “الابتكارية” الخاصة بهذا التطبيق باستخدام ادوات التأطير والتخطيط Wireframe العادية؟ لو استخدمنا الازرار والعناصر التي تتيحها لنا برامج التخطيط في العادة ربما ستخرج بنتيجة مشابهة للصورة التالي …

لكن في الحقيقة واجهة تطبيق Keezy عبارة عن ٨ مستطيلات بألوان مختلفة رائعة وبسيطة، انها واجهة ابتكارية بإمتياز، فواجهة البرنامج تشجعك علي اكتشاف هذا التطبيق البسيط !

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

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

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

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