تخطَّ إلى المحتوى
WanaWeb
استوديو ويب مستقل — منذ 2021
متاحون لمشاريع جديدة — الربع الأول

ويب الغد،نبنيها اليومبسرعة اللحظة.

سريع. نظيف. احترافي بلا مجاملة. من مواقع التسويق المركّزة على التحويل إلى تجارب ثلاثية الأبعاد تفاعلية بالكامل تعمل بـ 60 إطارًا في الثانية داخل المتصفح.

ابدأ مشروعًاشاهد ما نبنيه
Next.jsReact Three FiberTypeScriptWebGL / GLSLGSAPTailwind CSSNode.jsCore Web Vitalsأنظمة التصميمتصميم الحركة
01 / الاستوديو

فريق صغير. معايير غير معقولة.

واناويب استوديو صغير من مهندسين ومصمّمين وفنّاني رسم ثلاثي الأبعاد تعبوا من رؤية أفكار جميلة تُسلَّم كمواقع بطيئة وهشّة. فبنينا ممارستنا على وعد معاكس: كل بكسل مقصود، وكل كيلوبايت مبرَّر.

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

مشروعًا مُسلَّمًا
0+مشروعًا مُسلَّمًامنذ 2021
وسيط نتيجة Lighthouse
0/100وسيط نتيجة Lighthouseالأداء، الجوال
وسيط زمن استجابة التفاعل
0msوسيط زمن استجابة التفاعلINP، المئين 75
متوسط الزمن حتى الإطلاق
0 يومًامتوسط الزمن حتى الإطلاقمن التصميم إلى النشر
01

سريع بالتصميم

ميزانيات أداء نتفق عليها من البداية ونفرضها في CI. البثّ، والتخزين المؤقت على الحافة، والانضباط في الصور، وانعدام إزاحة التخطيط: كلها افتراضات لا أهداف طموحة.

02

كود نظيف، بلا استثناء

TypeScript صارم، ومكوّنات صغيرة قابلة للتركيب، ونظام تصميم حقيقي، واختبارات حيث تستحق عناءها. النشر هو بداية حياة قاعدة الكود، لا نهايتها.

03

حِرفة تلمسها

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

أعمال مختارة

دليل، لا وعود.

أربعة مواقع حيّة تُظهر المدى: ملف أعمال بطول شاشة واحدة، ومقهى في طهران افتُتح في 1995، وبار مشروبات حلال بخالطه الخاص، ومخبز خمير طبيعي. مرِّر للتنقّل بينها.

01ملف أعمال شخصي

علي رضا نقوي

ملف أعمال بطول شاشة واحدة

لا صفحات ولا تمرير للمستند: لوحة WebGL واحدة هي الموقع بأكمله، والمستند بطول النافذة التي يُرسم فيها بالضبط. يبثّ Next.js الهيكل، ويرسم three.js r182 كل ما داخله، إطارًا بإطار.

3D فوريشاشة واحدةملف أعمال
ابدأ شيئًا مثل هذا
Next.jsthree.js · WebGL
02مقهى · شارع ولي عصر، طهران

مقهى غودو

مكان هادئ للانتظار

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

البيانالقائمةالمعرضحجز الطاولات
ابدأ شيئًا مثل هذا
Next.jsReact · Tailwind
03بار مشروبات حلال · طهران

مقهى نوشين

اصنع نكهتك بنفسك

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

خالط المشروباتالقائمةمن نحنالنشرة
ابدأ شيئًا مثل هذا
Next.jsReact · Tailwind
04مخبز خمير طبيعي · شارع كريم خان، طهران

مخبز مينوس ون

خمير طبيعي حقيقي؛ من الخبز إلى الحلوى

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

القائمةالسلةدليل المنتجاتالمتجر
ابدأ شيئًا مثل هذا
Next.jsReact
02 / الخدمات

ما نفعله، ونتقنه فعلًا.

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

01

تصميم وتطوير المواقع

مواقع تسويقية ومنصّات مؤسسية وإطلاقات منتجات مبنية على Next.js. تخطيطات تحريرية، وأنظمة تصميم مخصّصة، ونماذج محتوى يستطيع فريقكم إدارتها بنفسه.

  • Next.js و React
  • CMS بلا واجهة
  • أنظمة التصميم
  • SEO وإتاحة الوصول
02

الرسم ثلاثي الأبعاد وWebGL

مشاهد ثلاثية الأبعاد مرتبطة بالتمرير، ومهيّئات منتجات، وخلفيات توليدية، وعمل على الـ shaders — بـ GLSL مكتوب يدويًا ومضبوط ليبقى سلسًا على هاتف متوسط الفئة.

  • Three.js و R3F
  • GLSL مخصّص
  • مهيّئات المنتجات
  • ميزانية 60fps
03

هندسة الأداء

نقيس ونشخّص ونعيد البناء. البثّ والتخزين المؤقت وجراحة الحِزم والعمل على مسار العرض، حتى تنتقل Core Web Vitals إلى المنطقة الخضراء وتبقى فيها.

  • Core Web Vitals
  • تحليل الحِزم
  • تخزين على الحافة
  • ميزانيات في CI
04

تصميم المنتج والواجهة

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

  • معمارية UX
  • أنظمة UI
  • نماذج أولية
  • مواصفات الحركة
05

التجارة الإلكترونية والتحويل

متاجر ومسارات دفع مبنيّة حول سؤال واحد: ما الذي يجعل النقرة التالية بديهية؟ ثم نثبت ذلك بالتجارب لا بالآراء.

  • تجارة بلا واجهة
  • UX الدفع
  • اختبار A/B
  • التحليلات
06

الحركة والتفاعلات الدقيقة

إخراج حركة التمرير، وانتقالات الصفحات، والتفاعلات الصغيرة التي تجعل الواجهة تبدو حيّة — وكلها تحترم تفضيل تقليل الحركة.

  • GSAP و ScrollTrigger
  • انتقالات الصفحات
  • تفاعلات دقيقة
  • واعية بإتاحة الوصول
03 / مختبر 3D

نعم — نعمل فعلًا بالرسم ثلاثي الأبعاد.

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

دوران تلقائي
اسحب للدوران
تنزيل نماذج
0 KB
معدّل الإطارات المستهدف
60 fps
محرّك العرض
WebGL2
shaders مخصّصة
GLSL
04 / العملية

أربع مراحل. بلا مفاجآت.

  1. 01الأسبوع 1

    الاستكشاف

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

    • الموجز والنطاق
    • خريطة الموقع
    • ميزانية الأداء
    • الجدول الزمني
  2. 02الأسبوعان 1 و2

    التصميم

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

    • الإدارة الفنية
    • نظام التصميم
    • نموذج أولي
    • مواصفات الحركة
  3. 03الأسابيع 2 إلى 4

    البناء

    مكوّنات مُنوَّعة، ونموذج محتوى بلا واجهة، ورسم ثلاثي الأبعاد حيث يستحق مكانه. نشر أسبوعي على بيئة تجريبية لتراقب التقدّم بدل انتظار كشف واحد في النهاية.

    • مكتبة المكوّنات
    • إعداد CMS
    • ثلاثي الأبعاد / WebGL
    • نشر تجريبي أسبوعي
  4. 04مستمر

    الإطلاق والتحسين

    نُطلق خلف المراقبة والتحليلات، ثم نُحسّن بناءً على السلوك الحقيقي. يشمل التسليم توثيقًا، وجولة مسجّلة، و30 يومًا من الدعم.

    • الإطلاق
    • التحليلات
    • التوثيق
    • دعم 30 يومًا
05 / الأدوات

مملّ في ما يهم.

نختار أدوات ناضجة بأفق دعم طويل، ولا نلجأ إلى الأدوات الرائدة إلا عندما يفرضها التصميم فرضًا.

الجوهر

  • Next.js
  • React 19
  • TypeScript
  • Node.js
  • Tailwind CSS

ثلاثي الأبعاد والحركة

  • Three.js
  • React Three Fiber
  • GLSL / WebGPU
  • GSAP
  • Blender

المنصّة

  • Vercel
  • Cloudflare
  • Sanity
  • PostgreSQL
  • GitHub Actions

الجودة

  • Playwright
  • Vitest
  • Lighthouse CI
  • axe-core
  • Sentry
06 / الأشخاص

فريق صغير، عن قصد.

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

AN

علي رضا نقوي

المؤسّس الشريك والمهندس الرئيسي

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

Next.js · الأداء · المعماريةGitHub
AV

عباس وزيري

المؤسّس الشريك

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

التوجيه · الشراكات · الاستراتيجية
SM

سارة محرابي

المديرة الإبداعية

تحوّل فقرة تحديد الموقع إلى لغة بصرية. مهووسة بالشبكات ومقاييس الخطوط وبالرمادي الدقيق للخلفية.

الإدارة الفنية · الطباعة · الهوية
DO

دانيال أوكافور

مطوّر ثلاثي الأبعاد وWebGL

يعيش داخل كود الـ shaders. يبني مشاهد تبدو مكلفة ومع ذلك تُحمّل في أقل من ثانية على هاتف من 2019.

Three.js · GLSL · المحاكاة
MT

مينا طباطبائي

مهندسة الواجهات والحركة

ترى أن الحركة يجب أن تشرح شيئًا. كل حركة تُطلقها لها مسار لتقليل الحركة وسبب للوجود.

React · GSAP · إتاحة الوصول
LF

لوكا فيراري

المنصّة وDevOps

يجعل النشر مملًّا والتراجع فوريًا. إن انكسر شيء في الثالثة فجرًا، فهو يعلم أولًا لأن التنبيه وصل إليه قبل غيره.

الحافة · CI/CD · الرصد
RF

روزا فرهادي

مصمّمة المنتج

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

UX · البحث · النماذج الأولية
07 / الإشارة

ما يقوله شركاؤنا.

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

ما يسأله الناس أولًا.

إن لم يكن سؤالك هنا، فاسأله مباشرة — وستحصل على جواب صريح، حتى إن كان الجواب لا.

اسألنا مباشرة

  • بموجز مكتوب قصير: ما الذي تبنيه، ولمن، وكيف يبدو النجاح، وما قيودك الزمنية والميزانية. نردّ خلال يوم عمل واحد إما بعرض أو بتوصية صادقة بأننا لسنا الخيار المناسب. المكالمة الأولى 30 دقيقة ومجانية.

  • موقع تسويقي مركّز يقع عادة بين 8 و25 ألف دولار. أما منصّة بنظام CMS ونظام تصميم مخصّص وعمل ثلاثي الأبعاد فتقع عادة بين 25 و60 ألف دولار. نحدّد النطاق بسعر ثابت مقابل قائمة تسليمات مكتوبة، فلا يتحرّك الرقم إلا إذا تحرّك النطاق.

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

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

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

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

  • أنتم، بالكامل، عند الدفعة الأخيرة. لا نحتفظ بأي إطار عمل خاص ولا رسوم ترخيص ولا احتكار استضافة. العناصر الخارجية الوحيدة هي المكتبات مفتوحة المصدر التي نعلنها من البداية.

08 / تواصل

لنبنِ شيئًا يستحق أن يُحمَّل.

أخبرنا بما تبنيه وما يعترض طريقك. ستسمع منا خلال يوم عمل واحد — من مهندس، لا من مسار مبيعات.

تفضّل البريد؟hello@wanaweb.studioالرد النمطي: أقل من 24 ساعةعمل عن بُعد — مع العالم كله
لا نشرات بريدية. لا CRM. فقط مهندس يردّ عليك.