المتطلبات — جهّز هالأربعة قبل ما تبدأ
- حساب Claude مدفوع — Claude Code بيشتغل مع خطط Pro أو Max أو Team (الخطة المجانية ما بتكفي)
- Claude Code مثبّت — الأوامر تحت
- حساب Higgsfield فيه رصيد — التوليد بيستهلك credits (شوف الخطوة 7 للتكلفة)
- صورة شخصية واضحة — رح نحكي عنها بالخطوة 3
Windows انسخ في PowerShell (ما بيحتاج Node.js):
irm https://claude.ai/install.ps1 | iex
Mac / Linux انسخ في Terminal:
curl -fsSL https://claude.ai/install.sh | bash
npm أو عبر npm — بس إذا عندك Node.js 22 أو أحدث (تحقق بـ node -v):
npm install -g @anthropic-ai/claude-code
بعد التثبيت، افتح Terminal بأي مجلد واكتب:
claude
أول مرة رح يفتح المتصفح لتسجيل الدخول بحساب Claude. لما يكتب Login successful اضغط Enter — وخلصنا.
ربط Higgsfield MCP بـ Claude Code
الـ MCP هو الجسر اللي بيخلي Claude يولّد فيديوهات مباشرة من حسابك في Higgsfield. الربط 3 خطوات:
لازمك حساب Higgsfield — أنشئه من هون1) أضف السيرفر — أمر واحد (العنوان الرسمي من higgsfield.ai/mcp):
claude mcp add --transport http --scope user higgsfield https://mcp.higgsfield.ai/mcp
2) سجّل الدخول: شغّل جلسة بـ claude، اكتب /mcp، اختر higgsfield ثم Authenticate — رح يفتح المتصفح على صفحة Higgsfield، سجّل دخولك ووافق.
3) تأكد إنه شغال:
claude mcp list
لازم تشوف higgsfield ✔ Connected. وللتأكيد النهائي اسأل Claude داخل الجلسة:
شو رصيدي في Higgsfield؟
صورة الهوية — أهم خطوة لثبات وجهك
Seedance 2.0 بيثبّت وجهك بكل الـ Clips إذا أعطيته صورة مرجعية (identity reference) نظيفة. جودة هالصورة = جودة النتيجة:
- واضحة وحادة — مش مبلورة ولا مضغوطة
- أمامية — وجهك كامل باتجاه الكاميرا
- من الصدر وطالع — مش سيلفي قريبة ولا جسم كامل
- إضاءة بسيطة — بدون ظلال قاسية عالوجه
- بدون نظارة شمسية وبدون شي يغطي ملامحك
- ولبس قريب من اللبس اللي بدك ياه بالفيديو
حط الصورة بمجلد مشروعك (سمّها مثلاً my-photo.png)، افتح claude بنفس المجلد واطلب:
ارفع صورة my-photo.png إلى Higgsfield واستخدمها كـ identity reference في كل توليد جاي.
توليد الـ Clips الثلاثة بـ Seedance 2.0
الإعدادات الموحّدة — لا تغيّرها بين Clip وـ Clip:
| الإعداد | القيمة |
|---|---|
| Model | Seedance 2.0 |
| Mode | std (الـ 1080p ما بيشتغل مع fast) |
| Resolution · Aspect | 1080p · 16:9 |
| Audio | بدون (no audio) |
| Duration | ~8 ثواني لكل Clip |
| Identity + Wardrobe | صورتك + نفس وصف اللبس في كل توليد |
Clip 1 — HERO ORBIT (الكاميرا بتلف حولك 360°):
Generate with Seedance 2.0 (std, 1080p, 16:9, no audio, 8s), identity reference = my photo:
A confident man in a [black t-shirt and dark overshirt] stands with arms crossed in an empty black-void studio. A soft rim light outlines him from one side. The camera performs one slow, smooth 360-degree orbit around him, completing exactly one full revolution. Cinematic, high contrast, shallow depth of field. No text anywhere in frame.
Clip 2 — THE BUILDER (قاعد بين شاشات هولوغرامية):
Same man, same wardrobe, same identity reference. Seedance 2.0 (std, 1080p, 16:9, no audio, 8s):
He sits at a dark desk surrounded by floating translucent holographic screens showing abstract work — code, charts, UI mockups. All screen content is small, out of focus, non-readable. The screen glow reflects on his face. Slow cinematic push-in toward him. No readable text anywhere.
Clip 3 — THE CLOSER (ماشي باتجاه الكاميرا ووقفة البطل):
Same man, same wardrobe, same identity reference. Seedance 2.0 (std, 1080p, 16:9, no audio, 8s):
He walks slowly toward the camera down a dark gallery corridor lined with glowing wall panels showing abstract wordless shapes. He stops in a confident hero pose facing the camera. Rim lighting, cinematic contrast, slow dolly. Zero text of any kind in frame.
بعد ما تخلص، اطلب من Claude ينزّل الـ Clips الثلاثة بمجلد clips/ داخل مشروعك.
بناء الموقع — البرومت الماستر
هلأ عندك الـ Clips — باقي الموقع. انسخ البرومت الماستر تحت، عبّي الفراغات اللي بين الأقواس [ ] بمعلوماتك (اسمك، أرقامك، خدماتك، مشاريعك، روابطك)، والصقه في جلسة Claude Code بنفس مجلد المشروع.
شو رح يصير؟ Claude رح يبني لك:
- سكرول سينمائي — Clip الـ orbit بيتحول لسلسلة frames على canvas بتتحرك مع سكرولك
- اسمك بتايبوغرافي ضخم بيدخل حرف حرف
- شريط أرقام بيعدّ للأعلى (متابعين، مشاريع، عملاء…)
- ثلاث ركائز (خدماتك) فوق Clip 2 + قسم أعمال فوق Clip 3
- خاتمة بعنوان كبير وزرّين CTA
- Style: خلفية حبر أسود + أخضر زمردي + كريمي + حبيبات خفيفة + سكرول ناعم بـ Lenis
Build me an award-winning cinematic "3D scroll" PERSONAL PORTFOLIO website for me — [YOUR NAME]. Study the style of the Awwwards Site of the Year 2025 (Lando Norris): huge bold typography, cinematic scroll-driven sequences, and a central 3D element that rotates as you scroll. My version's central element is ME.
VISUALS — Seedance 2.0 on the Higgsfield MCP (std mode, 1080p, 16:9, no audio, ~8s per clip). First upload my attached photo to Higgsfield and pass it as an identity reference on EVERY generation so my face is consistent. Keep my wardrobe identical throughout: [black t-shirt, dark overshirt]. Three clips:
1. HERO ORBIT — I stand confident, arms crossed, in a black-void studio with [emerald] rim lighting; the camera does one slow 360° orbit around me.
2. THE BUILDER — I sit at a dark desk surrounded by floating holographic screens showing my work; slow cinematic push-in.
3. THE CLOSER — I walk toward camera down a dark gallery lined with glowing screens, stopping in a hero pose.
WEBSITE — scroll-scrub the hero orbit as a canvas frame sequence: "[YOUR NAME]" in massive display type tracks in letter-by-letter, subtitle "[what you do in one line]". Animated stats strip counting up on scroll: [your 3–5 best numbers — subscribers, clients, projects, revenue]. THREE PILLARS section over clip 2 revealing [your three main offers] one at a time. WORK section over clip 3 with cards for [your 3 best projects], each with a one-line pitch and hover motion. FINALE: "[your main CTA]" with two buttons, plus footer links to [your socials]. Ink-black background, [emerald] accent, cream typography, bold condensed display font, kinetic type, subtle grain, Lenis smooth scroll.
Launch on localhost and verify the orbit scrub is buttery before telling me it's done.
اترك Claude يشتغل — ممكن ياخد عدة دقايق ويسألك أسئلة توضيحية، جاوبه وخلّيه يكمّل.
التشغيل والتحقق
Claude رح يشغّل الموقع محلياً ويعطيك رابط مثل http://localhost:4173. افتحه واسحب بالسكرول ببطء وبسرعة — المطلوب: دوران الكاميرا يمشي مع إيدك بنعومة (buttery)، بدون قفزات.
إذا كان السكرول متقطع، الصق هذا الطلب (بيحل 90% من الحالات — مجرّب):
The orbit scrub is not smooth. Please: (1) preload all frames before enabling the scrub, (2) reduce frame width to ~1600px and JPEG quality to ~80%, (3) add lerp smoothing between the current and target frame, and (4) cap the canvas devicePixelRatio at 1.5.
وتحقق كمان: افتح الموقع من موبايلك وشوف الأداء، وتأكد إن كل نص عربي ظاهر متصل الحروف — إذا مكسّر، اطلب من Claude: «النص العربي لازم يكون HTML حقيقي بدون تقطيع الحروف».
حل المشاكل والتكلفة الحقيقية
مشاكل الربط الشائعة:
| المشكلة | الحل |
|---|---|
| ✘ Failed to connect | تأكد من الرابط حرفياً، احذف وأعد الإضافة: claude mcp remove higgsfield |
| ! Needs authentication | داخل الجلسة: /mcp ← higgsfield ← Authenticate |
| الأدوات مش ظاهرة | سكّر جلسة Claude وافتحها من جديد |
| رابط claude.ai منفصل | ربط claude.ai (Settings ← Connectors) غير ربط Claude Code — كل واحد إله ربطه |
التكلفة — أرقام مقاسة من توليد حقيقي بتاريخ 2026-08-15 (الأسعار بتتغير — اسأل Claude «كم بيكلف هذا التوليد؟» قبل ما تولّد):
| الإعداد | الـ Clip الواحد | الثلاث Clips |
|---|---|---|
| 1080p · std · 8s (الموصى فيه) | 72 credits | 216 credits |
| 1080p · std · 6s | 54 credits | 162 credits |
| 720p · std · 8s | 36 credits | 108 credits |
قائمة التحقق النهائية + أسئلة شائعة
- Claude Code مثبّت و claude بيفتح جلسة
- claude mcp list بيعرض higgsfield ✔ Connected
- سؤال الرصيد بيرجع رقم
- صورة مرجعية نظيفة مرفوعة
- 3 Clips بنفس الوجه واللبس بمجلد clips/
- البرومت الماستر معبّى بمعلوماتك وملصوق
- الموقع شغال على localhost والسكرول ناعم
- النصوص العربية متصلة الحروف — ومجرّب عالموبايل