ما هو المخطط الأولي (wireframe) ولماذا يسبق التصميم؟
إن أرسل إليك المصمم صفحة من مربعات رمادية فهو لم يرسل تصميمًا ناقصًا، بل أرسل مخططًا أوليًا. وهذه الخطوة جزء من أي تصميم موقع إلكتروني احترافي، ومراجعتها قبل ظهور الألوان توفّر وقتًا كثيرًا.
ما هو بالضبط؟
هو مخطط للصفحة مرسوم بمربعات وخطوط بدل الصور والألوان. يُظهر ما يوضع في الصفحة وبأي ترتيب: عنوان هنا، وفقرة بجانب صورة هناك، وزر تحتها. تخيّل مخطط شقة. لا أحد يختار لون الطلاء من المخطط، لكن الجميع يرى هل المطبخ في مكانه الصحيح.
لماذا لا نبدأ بالتصميم الحقيقي؟
لأن الناس يتفاعلون مع أول ما يرونه. اعرض صفحة تبدو مكتملة فيذهب الحديث إلى درجة الأزرق والصورة، ويبقى السؤال الأكبر بلا طرح: هل تقول الصفحة الأشياء الصحيحة بالترتيب الصحيح؟ المخطط يزيل المشتتات عمدًا. فيُتفق على الهيكل وتحريكه ما زال سهلًا، ثم يُبنى التصميم البصري على شيء محسوم.
ما الذي أبحث عنه حين أراجعه؟
اقرأه كما يقرؤه الزائر، من الأعلى إلى الأسفل. هل أول ما تراه هو الأهم؟ هل ينقصه شيء يسأل عنه العميل دائمًا؟ هل فيه قسم لا تستطيع ملأه بمحتوى حقيقي؟ هل تنتهي كل صفحة بعرض خطوة تالية؟ وتجاهل اللون الرمادي والنصوص المؤقتة. مهمتك في هذه المرحلة الترتيب والمحتويات لا غير.
ما الذي لا يُظهره المخطط؟
الألوان، والخطوط، والصور الحقيقية، والصياغة النهائية، وروح العلامة. ولا يُظهر كذلك كيف تتحرك العناصر أو تستجيب. فهو لا يخبرك هل سيكون الموقع جميلًا، بل هل هو منظَّم جيدًا. وإن وجدته باهتًا فهكذا يجب أن يكون. الحكم على الجمال يأتي في المرحلة التالية، حين يُكسى الهيكل نفسه بهويتك.
هل يحتاج كل مشروع إلى مخطط؟
ليس خطوة رسمية مستقلة دائمًا. صفحة واحدة لشخص يمكن أن تنتقل إلى التصميم مباشرة، لأن هيكلها بسيط يُحكم عليه مع العناصر البصرية. أما المتجر، وموقع الشركة كثير الصفحات، والمنصة التعليمية، فتستفيد من المخططات، لأن اكتشاف قسم ناقص في وقت متأخر مكلف. وما يحتاجه كل مشروع هو الاتفاق على الهيكل قبل البناء، بأي طريقة تم.
ما مقدار التفصيل المطلوب؟
تفصيل يكفي للإجابة عن الأسئلة، وبساطة تسمح بالتغيير دون أسف. العناوين الحقيقية وأسماء الأقسام الحقيقية أنفع كثيرًا من النص المؤقت، لأنها تُظهر هل لديك فعلًا ما تضعه هناك. وإن استطعت تقديم المحتوى الحقيقي ولو مسودة أسرعت المراحل اللاحقة. والمخطط المصقول الذي لا يجرؤ أحد على تغييره فاته الغرض منه.
كيف أتعامل أنا مع ذلك
أنجز التفكير في الهيكل داخل Figma، في الملف نفسه الذي يصير التصميم الكامل، فلا يُطلب منك اعتماد مربعات ثم تفاجأ بما آلت إليه. ترى الصفحات وتعلّق عليها وتعتمد التصميم النهائي قبل بدء البناء. ولا يُبنى شيء قبل هذا الاعتماد. أخبرني بالصفحات التي يحتاجها موقعك وما المطلوب من كل واحدة، وأريك كيف أرتّبها.
تُنشر مقالات جديدة كل يوم على صفحتنا في فيسبوك: Learn with MK
عندك مشروع في بالك؟
أخبرني بما تريد بناءه، ويصلك الرد خلال 24 ساعة.
