لماذا أبنيموجزاتي بنفسي

01 · الإفصاح

إنها مشاريع مفاهيمية

مواقع الويب الرئيسية لم تكلّفني بها العلامات الخيالية التي تمثّلها. أنا من اختار العشرة. وضعت فرضية كل واحد منها، واخترت التوجيه الفني، وصمّمته، وكتبت الـ HTML والـ CSS والـ JavaScript، ونشرته مع سرد لكيفية سير البناء — بما في ذلك الأجزاء التي قاومت.

الأسماء وتفاصيل الأعمال والإحصاءات والسيناريوهات داخلها جزء من التمرين التصميمي ما لم يُذكر خلاف ذلك صراحة. أُبقي هذا التمييز ظاهرًا لأن ملف الأعمال ينبغي أن يسهّل معرفة ما فعله صاحبه فعلًا.

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

02 · لماذا مشاريع كاملة؟

النموذج المصقول قد يخفي الكثير

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

03 · ما الذي تُظهره

ما الذي تستطيع عشرة مواقع مكتملة أن تُثبته — وما لا تستطيع

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

1. ما الذي تُظهره

   الاتجاه البصري. عشرة قطاعات، عشرة توجيهات فنية، ولا أسلوب بيت واحد يتكرر مرتين — يمكنك أن ترى كيف يُعالَج المفهوم قبل أن يصير صفحة.

   ما الذي لا تُثبته

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

2. ما الذي تُظهره

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

   ما الذي لا تُثبته

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

3. ما الذي تُظهره

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

   ما الذي لا تُثبته

   نتائج تجارية. لا واحد منها يحمل رقم إيرادات أو رسم حركة زوّار أو معدل تحويل، ولن يحمل أبدًا — لم يكن هناك شيء يُباع ولا أحد يُباع له.

4. ما الذي تُظهره

   قرارات الإتاحة والاتساق عبر تجربة كاملة. عشرة نماذج، وعشر مجموعات من الحالات التفاعلية، كلها مبنية على الممارسة نفسها.

   ما الذي لا تُثبته

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

لا تتظاهر بغير ذلك — ملف أعمال من مشاريع بمبادرة ذاتية لا يُثبت تلقائيًا عمود «ما الذي تُظهره» لمجرد أنه سهل العرض. ما يستطيع تقديمه بدلًا من ذلك هو الشيء الآخر في هذه الصفحة: قياس، له تاريخ ومنهج مرفقان.

مقيس على هذا الموقع. في 9 آب/أغسطس 2026، أعاد npm run a11y — وهو axe-core مع ضغطات مفاتيح حقيقية، على 13 مسارًا عند 1440×900 و390×844، مع فرض تقليل الحركة، وكل صفحة استقرت ومُرّرت حتى نهايتها قبل التشغيل — 0 مخالفات axe و0 من أصل 829 موضع تنقّل بلا مؤشر تركيز مرئي.

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

04 · مشكلات مختلفة، قواعد مختلفة

كل واحد يبدأ من فرضية مختلفة، عن قصد

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

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

الفرضية تضع القيد

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

على القيد أن يصمد عند ملامسة البناء

اللغة التصميمية التي لا تعمل إلا في نموذج وتنهار لحظة أن يكون عليها حمل محتوى حقيقي ونقاط توقف حقيقية وتفاعل حقيقي لم تتبع الفكرة فعلًا — بل زيّنتها.

عشرة أصوات، لا أسلوب بيت واحد

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

05 · السجلّ

اقرأه أو شغّله — الخيار لك