Norra Healthرعاية تشبه الهدوء

01 · نظرة عامة

رعاية تشبه الهدوء

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

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

02 · الفكرة

ثلاث خطوات، بلا متاهات هاتفية

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

03 · الأهداف

ما كان على الصفحة أن تفعله

1. القراءة بلمحة وفي العمق

   ستة أقسام — الخدمات، وكيف تسير الأمور، والفريق، والقصص، والأسئلة الشائعة، والموعد — كل منها صالح للاستخدام وحده إن كان هو كل ما يقرؤه أحدهم.

2. الإجابة عن أسئلة مكتب الاستقبال

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

3. إثبات الأرقام

   يتخيّل التصوّر ممارسة تملك الأرقام التي تسند وعدها: 24,000 مريض، و98% منهم مُسندون إلى طبيب باسمه، ومتوسط انتظار ست دقائق — تُعدّ صعودًا مرة واحدة، عند الدخول، ولا تدور في حلقة أبدًا.

4. اجتياز التباين من دون إضافة

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

04 · ترتيب البناء

كيف بُنيت

1. اللوحة، والتباين أولًا

   اثنتان وعشرون خاصية مخصّصة. الأوكالبتوس للأسطح، والصنوبر لكل ما يجب أن يُقرأ، والرملي لكتل الهدوء — ورمز مخصّص لحدود الحقول مُثبَت مقابل متطلب 3:1 لغير النص.

2. ست وعشرون SVG مضمّنة

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

3. التتابع

   تأخير من 80 ملّي ثانية بين العناصر المتجاورة، مطبَّق في CSS من فهرس لا مجدوَل في JavaScript — فالظهور لا يكلّف شيئًا في كل إطار.

4. الأكورديون

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

5. نماذج لها صوت

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

05 · البنية

ثلاثة ملفات

06 · ما قاوَم

الأشياء التي يسأل عنها الناس

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

07 · ما يستحق البقاء

الأجزاء التي تستحق البقاء

08 · شغّله مباشرة

شغّله هنا

البناء الحقيقي، مضمّنًا وقيد التشغيل. يُحمَّل عند الطلب — لا يُجلب شيء قبل أن تطلبه.

norrahealth.com

شغّله مباشرة

البناء الحقيقي، يعمل داخل الصفحة. المعاينة الحية صفحة مضمّنة؛ اضغط Escape للخروج منها.

افتح في ملء الشاشة ↖