لوگو
تصویر پروژه ۲
تصویر پروژه ۲

انیمیشن تنفس و آرامش‌بخش - ریلکسینگ (Relaxing)

خدمات: طراحی UI/UX، پیاده‌سازی انیمیشن‌های پیشرفته با JavaScript، طراحی تعاملی، ایجاد حس آرامش
کارفرما: پروژه شخصی

این پروژه یک ابزار آرامش‌بخش و تعاملی است که با استفاده از انیمیشن‌های ساده و روان، به کاربر کمک می‌کند تا استرس خود را کاهش دهد و تمرکز بیشتری داشته باشد. در این پروژه، یک دایره بزرگ با الهام از فرایند تنفس، به‌صورت منظم بزرگ و کوچک می‌شود و یک دایره کوچک‌تر نیز دور آن می‌چرخد. این حرکت‌ها با هماهنگی کامل، حس عمیقی از آرامش و نظم را به کاربر منتقل می‌کنند. طراحی مینیمال و رنگ‌های ملایم نیز این حس را تقویت می‌کنند. این پروژه با هدف تمرین انیمیشن‌سازی با JavaScript و خلق تجربه‌ای کاربرپسند و آرامش‌بخش طراحی شده است

ویژگی‌های پروژه

  • انیمیشن بزرگ و کوچک‌شدن دایره مرکزی شبیه به فرایند تنفس
  • چرخش دایره کوچک‌تر دور دایره اصلی با سرعت ثابت و هماهنگ
  • استفاده از رنگ‌های ملایم و آرامش‌بخش برای ایجاد حس تمرکز
  • طراحی مینیمال و بدون عناصر اضافی برای کاهش حواس‌پرتی
  • اجرای روان انیمیشن‌ها با استفاده از setInterval
  • واکنش‌گرا و سازگار با موبایل و دسکتاپ
  • رابط کاربری ساده و لذت‌بخش که حس آرامش را به کاربر منتقل می‌کند

تکنولوژی‌های استفاده‌شده

Html logo HTML5
Css logo CSS3
js logo JavaScript