mini-cart-logo

سبد خرید شما خالی است.

mini-cart-logo

سبد خرید شما خالی است.

نسخهٔ فارسی و بازطراحی‌شدهٔ پلی‌مدیا با الهام از Landing Page Motion Pack اثر @zeeuiux. خروجی ۹۶۰×۶۰۰، ۷ ثانیه و بی‌صدا؛ رابط‌ها و داده‌ها نمونهٔ مفهومی‌اند.

پرامپت انگلیسی مرجع
Build a before/after redesign slider as one self-contained HTML file (inline CSS
and vanilla JS, no libraries).
"Before": a deliberately dated website for a skincare brand: serif fonts, a blue
header bar, underlined links, a grey placeholder image, a bevelled "CLICK HERE"
button and a visitor counter.
"After": a clean modern hero for the same brand: bold sans headline, two buttons,
a product visual and a rating chip.
Stack both layers and clip the "after" layer with clip-path: inset() from a
vertical divider with a round handle.
Motion:
1. The handle sweeps slowly left to reveal the full redesign, pauses, sweeps back
to the middle with a small wiggle, then returns to the start.
2. The handle grows slightly while it moves.
3. BEFORE / AFTER labels only show when their side is visible.
Make the handle draggable as well. Loop every 7s.

فایل مرجع از zeeuiux · همهٔ نمونه‌های موشن لندینگ‌پیج

لندینگ‌پیج — اسلایدر قبل و بعد

تاریخ انتشار: 26 مهر 1405
ساخت عکس ↗
متن پرامپت
یک موشن گرافیکی فارسی با موضوع «اسلایدر قبل و بعد» بساز. این نسخهٔ مستقل با الهام از ایدهٔ Landing Page Motion Pack اثر @zeeuiux است؛ بازطراحی فارسی پلی‌مدیا و کپی تصویری خروجی منبع نیست.خروجی ۹۶۰×۶۰۰ پیکسل، ۳۰ فریم در ثانیه و ۷ ثانیه باشد. فونت واقعی یکان بخ، متن متصل فارسی، راست‌به‌چپ و ارقام فارسی استفاده کن. پالت سفید گرم #F7F4FC، مشکی #17141E و بنفش #7543E8 است؛ بعضی صحنه‌ها زمینه تیره دارند. حاشیه امن ۴۰ پیکسل رعایت شود.حرکت اختصاصی: دو طراحی مفهومی قدیم و جدید فروشگاه را در یک قاب بساز. یک جداکننده سفید با دسته دوطرفه بین دو نسخه حرکت کند و لایه جدید را از سمت چپ آشکار کند. خروجی ویدیویی نمایشی است و تعامل کشیدنی ندارد.برای رسیدن به نمونهٔ این صفحه از ترسیم دوبعدی Python/Pillow با RAQM و FFmpeg استفاده شده است. خروجی یک ویدیوی نمایشی بی‌صداست؛ کنترل رابط و دکمه‌ها در ویدیوی MP4 تعاملی نیستند. حرکت را با تابع زمان مطلق، easing نرم و keyframe بازتولیدپذیر بساز. بازگشت چرخه‌ها می‌تواند ریست نمایشی داشته باشد؛ لوپ بدون درز را بدون آزمون ادعا نکن. بلور سه‌بعدی، مورف برداری یا اسکرین‌شات واقعی محصول ادعا نکن.MP4 با H.264، yuv420p و faststart، پوستر JPEG و کد قابل‌ویرایش تحویل بده. آغاز، میانه، پایان و دو سوی تغییر حالت‌ها را بررسی کن. همهٔ فایل را با ffmpeg دیکد و ابعاد و زمان را با ffprobe کنترل کن. برای تغییر برند، متن، رنگ و فونت همین صحنه را بازطراحی کن.
کمک میخوای؟
Chat Icon
mini-cart-logo-toolbar

سبد خرید شما خالی است.