تبدیل Figma به HTML/CSS ریسپانسیو + JS/Twig

یک رابط کاربری از پیش در Figma آماده است و باید به صفحات HTML/CSS ریسپانسیو تبدیل شود. خروجی باید ماژولار و قابل ادغام در موتور قالب‌نویسی Twig باشد. رفتارهای لاگین و سبد خرید صرفاً با JavaScript نیتیو (بدون فریم‌ورک) پیاده‌سازی شوند. (( نمونه‌های واقعیِ پیاده‌سازی‌شده از پروژه‌های قبلی را هم آپلود کردیم تا برای ایده‌برداری و درک جریان‌ها استفاده کنید )) مهارت‌های الزامی: تسلط جدی بر HTML5 و CSS3 (فلکس/گرید، تایپوگرافی، فرم‌ها، Stateها) تسلط بر Vanilla JavaScript (مدیریت State سبک، رویدادها، اعتبارسنجی فرم، ذخیره‌سازی Local/session) ریسپانسیو Mobile-first و آشنایی با الگوهای UI رایج تجربه‌ی کار با Twig یا حداقل تولید خروجیِ قابل‌اسلایس به partial/component ترجیحات فنی (مزیت محسوب می‌شود): استفاده از UnoCSS بهینه‌سازی پایه عملکرد (Asset splitting، minify، lazy behaviors) دامنه کار و دلیوری: تبدیل تمام فریم‌های نهایی Figma به صفحات/partials HTML با CSS سازمان‌یافته (BEM یا Utility-First) JS نیتیو برای: جریان لاگین (UI، اعتبارسنجی سمت کلاینت، مدیریت خطا/State) سبد خرید (افزودن/حذف/به‌روزرسانی اقلام، شمارنده، جمع کل، حفظ موقت داده‌ها) ساختار پوشه‌ها: assets/ (css, js, fonts, images) + partials/ برای ادغام در Twig لینک Figma https://www.figma.com/design/bFFNPniauaQoTWRhT1y80R/karlancer?node-id=0-1&t=UZrsyF0mZrUyvVCa-1 توضیحات کامل تر: قالبی که طراحی شده برای استفاده در فروشگاه آنلاین (Webstore) است که کاربران از طریق آن می‌توانند محصولات/پکیج‌ها را انتخاب و خرید کنند. این قالب قرار است مستقیماً با سیستم قالب‌دهی Tebex ادغام شود، جایی که Twig برای منطق قالب (شرط‌ها، loopها، partialها) استفاده می‌شود. لینک داکیومنت رسمی Tebex قالب‌ها / Templates جهت مطالعه و مشاهده امکانات پایه: https://docs.tebex.io/developers/templates/overview لطفاً پیش از ارسال پیشنهاد، توضیحات را به‌طور کامل مطالعه و فایل‌های پیوست‌شده را بررسی نمایید سپاسگزارم.