mini-cart-logo

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

mini-cart-logo

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

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

پرامپت انگلیسی مرجع
Build a CTA micro-interaction as one self-contained HTML file (inline CSS and
vanilla JS, no libraries) on white.
A big black pill button: "Get started, it's free →".
Motion:
1. A fake cursor glides in and hovers: the button lifts 4px and a light shine
sweeps across.
2. On click it squashes to 94%, the label fades, and the pill morphs into a
circle with an orange spinning arc.
3. After a beat the circle turns orange (#EF6237), a white check draws in with a
spring pop, and 44 confetti pieces burst out with gravity, spin and fade. Use a
seeded random so it looks the same every loop.
4. "You're in!" and "Check your inbox for your login." fade up below.
Loop every 7s and respect prefers-reduced-motion.

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

لندینگ‌پیج — دکمه با انیمیشن موفقیت

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

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