01 / 04
مادة
كل شيء يبدأ مادةً.
سبج وغبار وضغط: قبل أن يكون للعلامة صوت، يكون لها ثقل.
استوديو العمارة الرقمية — منذ 2026
عمارة رقمية بمقياس المؤسسات الكبرى لمن اسمُهم هو العمل ذاته: أتمتة آمنة لسير العمل، مصنوعة بأدق التفاوتات، ومُنجزة في صمت، ومقيسة لا موعودة.
قيس في 17 أكتوبر 2026 · Lighthouse · desktop preset, live production (syncflow.agency), median of 5 runs
01 / 04
كل شيء يبدأ مادةً.
سبج وغبار وضغط: قبل أن يكون للعلامة صوت، يكون لها ثقل.
02 / 04
الشكل قرار.
كل منحنى يبقى أو يُقطع بسؤال واحد: هل يحمل معنى؟
03 / 04
الضوء هو الزينة الوحيدة.
نضيء ما يهم، ونترك الباقي يسقط في العتمة.
04 / 04
الحركة هي الزمن وقد صار مرئيًا.
ينبغي للموقع أن يتحرك كفيلم أُحسن مونتاجه: بقصد، لا للاستعراض.
01 — العمارة
كل بكسل تفاوت، وكل إطار التزام. تُبنى هنا المنظومات الرقمية عالية العائد على الاستثمار في طبقتين: واجهة أمامية تبدو مضبوطة لا سريعة فحسب، وأتمتة مؤسسية مصمَّمة لتتحمّل الأعطال بأمان.
I
تركنا خلفنا محركات العرض الثقيلة وطبقات الحركة المتقطعة. تُقدَّم تدفقات الواجهة الرئيسية والمعرض كفيديو MP4/WebM أصلي يفكّ ترميزه عتاد الفيديو في الجهاز نفسه، فلا يُرهَق المعالج.
H.264 · VP9 · يُحمَّل عند الطلب · مساحة محجوزة، بلا انزياح في التخطيط
فيديو أصليII
يتبع التمرير والانتقالات إيقاع إطارات الشاشة نفسها. على أجهزة سطح المكتب بالفأرة أو لوحة اللمس، يلطّف Lenis التمرير؛ وتحتفظ الأجهزة اللمسية بتمريرها الأصلي الفوري. تتحرك الصفحة كامتداد ليدك، لا من تحتها.
تمرير سلس Lenis · requestAnimationFrame · تحويلات مركّبة بوحدة المعالجة الرسومية
زمن الإطار
قيس أثناء التمرير على شاشة 60 هرتز. 1280x800, headless Chrome, 60 Hz, no CPU throttling. 8 أكتوبر 2026.
III
الأداء وإمكانية الوصول وأفضل الممارسات وتحسين محركات البحث: أربع حلقات مقيسة على هذه الصفحة نفسها. زائر يغادر بعد ثلاث ثوانٍ لا يعيده بيان، لذلك نقيس أولًا ثم نتكلم.
CLS · LCP · TBT · مقيسة ومؤرَّخة وموثَّقة المصدر
الأداء
إمكانية الوصول
أفضل الممارسات
SEO
سطح المكتب: CLS 0.00، LCP 0.4 s، TBT 0 ms. الجوال (4G بطيء محاكى، إبطاء المعالج 4 مرات): الأداء 100.
Lighthouse، desktop preset, live production (syncflow.agency), median of 5 runs; mobile preset (412×823), simulated slow 4G, 4x CPU slowdown, live production (syncflow.agency), median of 14 runs in two sessions on a quiet machine (99-100)، 17 أكتوبر 2026.
IV — أتمتة مؤسسية آمنة عند الأعطال
على مقياس المؤسسات الكبرى يتعطّل شيء ما دائمًا، لذلك تُبنى الأتمتة حول هذه الحقيقة: معماريات طوابير احتياطية تُبقي الأحداث في حركة حين يصمت أحد المسارات، وتُوقَّع الـ webhooks ويُتحقَّق منها قبل أن يُوثَق بأي منها.
طوابير احتياطية · webhooks موقَّعة · تسليم غير مكرَّر · إعادات محاولة محدودة
محاكاة تفاعلية
احجب القناة الرئيسية وشاهد الأحداث تنتظر بأمان في الطابور الاحتياطي بدل أن تضيع. ثم أعد تشغيلها.
جميع القنوات سليمة. أرسل أحداثًا لتبدأ.
نموذج للنمط، وليس قياسًا لنظام حقيقي. لا يضيع هنا شيء لأن الطابور الاحتياطي دائم؛ أما أي تطبيق فعلي فلا بد من اختباره بمفرده.
V — تكاملات مؤسسية عميقة
Salesforce و SAP و HubSpot و Oracle جزء من العمارة منذ الرسم الأول، ليتنقّل العملاء المحتملون والطلبات والسجلات بين الموقع والأنظمة التي تعمل عليها شركتكم أصلًا.
Salesforce · SAP · HubSpot · Oracle
محاكاة تفاعلية
اختر نظامًا. يُحوَّل الحدث نفسه إلى الصيغة التي يتوقعها ذلك النظام، ويبيّن كل خط أيَّ حقل يغذّي أيَّ حقل.
الحمولة كما أُرسلت
{
"fields": {
"SyncflowEventId__c": "3f2a9c1e-7b4d-4e0a-9d51-6c8b2a7e1f40",
"FirstName": "Alex",
"LastName": "Morgan",
"Company": "Example Holdings",
"Email": "alex.morgan@example.com",
"Title": "principal",
"Description": "Group-wide order portal, integrated with our ERP.",
"SyncflowMarket__c": "us",
"LeadSource": "Web",
"Status": "Open - Not Contacted"
}
}عدد الحقول المُعيَّنة: 10. السجل: عميل محتمل. يسافر معرّف الحدث في fields.SyncflowEventId__c، فلا تستطيع إعادة المحاولة أن تُنشئ سجلًّا ثانيًا.
صيغ توضيحية مستوحاة من التسمية العلنية لدى كل مورّد. لم تُولَّد من نظام المورّد ولم يُتحقَّق منها عليه؛ يُبنى كل موصِّل حقيقي ويُفحص على نظام العميل نفسه. أسماء المنتجات ملك لأصحابها، ولا يُقصد منها الإيحاء بأي شراكة أو اعتماد أو توافق.
VI — تدفق أمني بلا ثقة مسبقة
كل رسالة تعبر حدًّا تُوقَّع ثم يتحقق منها المستلِم وتُختَم قبل أن تواصل طريقها. الخطوات أدناه تعمل مباشرةً في متصفحك، فيمكنك كسر إحداها ومعرفة المكان الذي تتوقف عنده الرسالة بالضبط.
HMAC-SHA256 · تحقق بلا ثقة مسبقة · AES-256-GCM · مفاتيح عدم التكرار
محاكاة تفاعلية
رسالة موقَّعة يُتحقَّق منها وتُختَم في طريقها إلى نظام أعمال. تُحسَب كل خطوة مباشرةً في متصفحك باستخدام Web Crypto ومفاتيح مؤقتة.
جاهز. أرسل رسالة وتابعها عبر الخطوات الخمس.
جاهز. أرسل رسالة وتابعها عبر الخطوات الخمس.
يعمل في متصفحك بمفاتيح مؤقتة؛ ولا يغادر شيء هذه الصفحة. يوضّح النمط؛ ولا يصف أي نظام إنتاجي ولا يقيسه ولا يعتمده، ولا يُقصد منه الإيحاء بأي شراكة مع المنتجات المذكورة. وخطوة التوقيع هي النمط نفسه الذي يستخدمه هذا الموقع لتسليم إحاطاته.
02 — المعرض
الاحتشام هو اللمسة الأخيرة. لكل قطاع نبرته الخاصة؛ أما المعيار فلا يتغير أبدًا.
عيّنة معماريةلا تُشترى إقامة تطل على البوسفور من شاشة، بل تُحَسّ. وصول سينمائي بطيء، وضوء نهار مدروس على امتداد المخطط، واستفسار يصل مباشرةً إلى أصحاب القرار لديكم.
عيّنة معماريةلعيادات التجميل والأسنان وطول العمر: استقبال رقمي متزن، لا قاعة مبيعات. ملفات الأطباء وموعد يبادر به المريض، يوجّه دون أن يقلق.
عيّنة معماريةلمكاتب المحاماة وبيوت الاستشارات وشركات الاستثمار الخاص: حضور مضبوط ودقيق. صفحات مجالات الممارسة والشركاء، واستفسار سري، وبنية تعتمدون فيها كل كلمة بأنفسكم، لأن تطبيق قواعد الإعلان والتواصل الخاصة بمهنتكم مسؤوليتكم.
عيّنة معماريةلمشغّلي الخدمات اللوجستية وسلاسل التوريد بين الشركات: معماريات طوابير احتياطية تُبقي البيانات في حركة حين يصمت أحد المسارات، وتدفّق بيانات متواصل من الطلب إلى الرصيف إلى الفاتورة، وأتمتة تتولى القرارات الروتينية ليتفرغ فريقكم للقرارات الاستثنائية.
نماذج إنتاجية أولية: عيّنات من الاستوديو، وليست أعمال عملاء.
03 — الاستوديو
نحن استوديو عمارة رقمية لأصحاب الأعمال والشركاء والمديرين الذين اسمهم هو العمل. نعمل كما يعمل المعماري الجيد: وفق مخطط، وضمن تفاوت محسوب، وبكل تحفّظ.
I
الخطأ يُصمَّم خارج العمل، ولا يُعتذر عنه. يُدقَّق كل تغيير ويُختبر اختبار دخان ويُفحص على الموقع الحي قبل أن نعدّه منجزًا، وكل ما ننشره عن الأداء مقيس ومؤرَّخ وموثَّق المصدر. صفر أخطاء هو المعيار الذي نعمل وفقه، لا وعدًا يمكننا التوقيع عليه نيابةً عنك.
اطّلع على القياساتII
يمكن توقيع اتفاقية عدم إفصاح متبادلة قبل جلسة العمل الأولى. لا نعرض عمل أي عميل دون موافقة خطية، ولهذا لا يضم المعرض سوى عيّنات من الاستوديو. لا يضع هذا الموقع ملفات تعريف ارتباط ولا يشغّل أي تحليلات، وكل إحاطة يقرؤها إنسان.
اقرأ إشعار الخصوصيةIII
يفكّ ترميزَ الفيديو عتادُ الفيديو في الجهاز نفسه، وتُركَّب الحركة على وحدة معالجة الرسوميات، ويتبع التمرير إيقاع إطارات الشاشة، وتُقاس ميزانية الإطارات. لا يُسمح لأي عنصر زخرفي بأن يكلّف الزائر إطارًا واحدًا.
كيف بنيناهالبيان
ليست شعارات: كل سطر هو أمر تفعله هذه الصفحة ويمكنك التحقق منه بنفسك.
ارسم قبل أن تبني.
تُكتب البيانات وحالات الإخفاق والتفاوتات المسموحة ويُتفق عليها قبل أي شيفرة. ما لا يمكن رسمه لا يبدأ العمل عليه.
اذكر التفاوتات لا الصفات.
ننشر أرقامًا مع تاريخ وملف قياس ومصدر، ولا نقول شيئًا لا نستطيع قياسه.
عند العطل، أغلِق. ولا تتظاهر أبدًا.
عندما ينقص جزء، يرفض النظام ويقول ذلك. ولا يرد أبدًا بعبارة «تم الاستلام» على رسالة لم يستلمها أحد.
الصمت افتراضيًا.
لا ملفات تعريف ارتباط، ولا تحليلات، ولا طرف ثالث إلا حيث يلزم فحص ضد الروبوتات. ما يخبرنا به العميل يقرؤه إنسان لا متتبّع.
اختبر الادعاء لا الصفحة.
تستند ادعاءات الأمان والتكامل إلى اختبارات نشغّلها قبل كل إصدار: رسائل موقّعة، ومظاريف مختومة، وطابور مرجعي لا يفقد شيئًا ولا يطبّق شيئًا مرتين في كل حالة إخفاق تم اختبارها.
يمكن التحقق منه في هذه الصفحة
HMAC-SHA256 · AES-256-GCM
يوقّع تدفق الأمان المؤسسي في هذه الصفحة رسالة ويختمها باستخدام Web Crypto الخاصة بمتصفحك: الأساسيات نفسها والاختبارات نفسها التي تقوم عليها بنيتنا المرجعية.
لا ملفات تعريف ارتباط · لا تحليلات
افتح تبويب الشبكة: لا يُخزَّن شيء على جهازك ولا يُحمَّل شيء من طرف ثالث، باستثناء فحص Cloudflare ضد الروبوتات في نموذج الإحاطة.
سياسة أمان المحتوى مُفعَّلة
يحمل كل سكربت قيمة nonce لمرة واحدة ويحجب المتصفح ما عداه. وفحص الانتهاكات جزء من ضوابط الإصدار لدينا.
كيف بنيناه
ثلاثة قرارات تمنح هذا الموقع إحساسه، ولكلٍّ منها حدود تفاوت. ما يلي يصف ما تفعله الشيفرة في هذه الصفحة فعلًا.
تُصيَّر مرة واحدة، مسبقًا.
كل مشهد حلقة متصلة مدتها ثماني ثوانٍ، تُصيَّر مرة واحدة بدقة 1920 × 1080 وبمعدل 30 إطارًا في الثانية، ثم تُرمَّز بصيغة H.264 (MP4) مع VP9 (WebM) كبديل. ولا يُرسَل أي محرك رسوم متحركة إلى المتصفح.
يفكّه الجهاز نفسه.
يسلّم المتصفح التدفق إلى مفكّك الفيديو في الجهاز نفسه، وهو في معظم الهواتف والحواسيب المحمولة عتاد مخصّص، فيبقى المعالج حرًّا للصفحة.
لا يُحمَّل ولا يُشغَّل إلا عند رؤيته.
لا يُنزَّل المقطع إلا حين يوشك أن يعمل. يعمل ما دام على الشاشة أو تحت المؤشر، ويتوقف إذا غادرها أو أُخفيت علامة التبويب، ويبقى ساكنًا للزوار الذين يفضلون الحركة المحدودة أو يوفّرون البيانات، وله دائمًا زر إيقاف مؤقت.
طبقة WebGL واحدة، بميزانية.
الضوء خلف الصفحة هو WebGL2 خام على مرحلتين، المشهد ثم اللمسة الأخيرة، ويطلب وحدة الرسوميات عالية الأداء. وهو محدود بنسبة بكسل 1.25، ويعمل في الحالة المحيطة بمعدل 30 إطارًا في الثانية، وإذا تجاوز متوسط 90 إطارًا مدة 24 ms خفّض دقته خطوةً خطوة قبل أن ينسحب تاركًا البديل المكتوب بـ CSS.
حدود التفاوتنسبة البكسل ≤ 1.25 · مرحلة المشهد من 50 % إلى 30 % · الانسحاب فوق 24 ms (متوسط 90 إطارًا) · حلقات 8 ث بمعدل 30 إطارًا في الثانية
قراءة واحدة وكتابة واحدة في كل إطار.
تكتفي معالجات التمرير بتسجيل أن شيئًا تغيّر. ويجري استدعاء واحد لـ requestAnimationFrame يأخذ قياسًا واحدًا للتخطيط على الأكثر ويكتب النتيجة في خصائص CSS مخصّصة، وذلك فقط ما دام القسم على الشاشة.
المُركِّب وحده يحرّك الأشياء.
تقتصر الحركة على transform وopacity وclip-path. أما العرض والارتفاع وtop وleft فلا تتحرك أبدًا، فيكون الإطار تركيبًا لطبقات لا تخطيطًا جديدًا.
لا شيء يعمل دون أن يُرى.
كل ما يتكرر في حلقة، كشعاع ضوء أو إشارة تمرير أو فيديو، يتوقف فور مغادرته الشاشة، ويتوقف كل شيء ما دامت علامة التبويب مخفية.
مقيس، لا مفترض.
حافظ التمرير عبر الصفحة كلها على زمن إطار وسيط قدره 16.7 ms وعلى المئين 99 عند 16.9 ms (1280x800, headless Chrome, 60 Hz, no CPU throttling، 8 أكتوبر 2026).
حدود التفاوتقراءة تخطيط واحدة لكل إطار · الخصائص المتحركة: transform وopacity وclip-path · ميزانية إطار 16.7 ms عند 60 Hz
حيث لا يكلّف شيئًا فقط.
لا يبدأ إلا لمؤشر شبيه بالفأرة، ولا يعمل أبدًا إذا فضّل الزائر الحركة المحدودة. ويُراقَب الشرطان مباشرةً، فيُفعَّل أو يُعطَّل على حاسوب هجين أو عند تغيير إعداد دون إعادة تحميل. وتحتفظ الأجهزة اللمسية بتمريرها الأصلي ولا تنزّل المكتبة أبدًا.
منحنى مضبوط.
مدة 1.2 ثانية على منحنى cubic-bezier(0.16, 1, 0.3, 1)، تقودها حلقة الإطارات الخاصة بالمكتبة. وتنزلق الروابط داخل الصفحة على المنحنى نفسه وتترك مساحة للترويسة الثابتة.
لا يقف في الطريق أبدًا.
يتوقف ما دامت بوابة الدخول مفتوحة، وتتمرر الإحاطة وكل نافذة حوار تمريرًا أصليًّا. وبعد أي قفزة يستقر التركيز والعنوان حيث يتركهما مرساة أصلية.
يُحمَّل متأخرًا ويبقى صغيرًا.
المكتبة جزء مستقل يُطلَب باستيراد ديناميكي بعد أن تُرسَم الصفحة وعند تحقق الشرطين فقط. وليست جزءًا من التحميل الأول.
حدود التفاوتالمدة 1.2 ث · المنحنى cubic-bezier(0.16, 1, 0.3, 1) · إزاحة الترويسة 88 px · مؤشر دقيق فقط · معطَّل مع الحركة المحدودة
04 — الإحاطة الاستراتيجية
أربع خطوات تبدأ بالاستثمار. وفي المقابل، ردّ شخصي من فريقنا المؤسس خلال 24 ساعة.
اسمٌ هو العمل ذاته يستحق بيتًا مبنيًّا كالعمارة: صامتًا ودقيقًا وعصيًّا على النسيان.وكل ما سوى ذلك ضجيج.