جستجو برای:
سبد خرید 0
  • صفحه اصلی
  • دوره ها
    • حساب کاربری
    • سبد خرید
  • مقالات
 

ورود

رمز عبور را فراموش کرده اید؟

هنوز عضو نشده اید؟ عضویت در سایت
  • 09357387480
  • uiuxfarsi@gmail.com
perm_identity
سبد خرید 0
  • صفحه اصلی
  • محصولات
  • مقالات
0
مرجع آموزش UI و UX فارسی
  • صفحه اصلی
  • دوره های آموزشی جامع
  • ویدیو ها
  • سورس و پروژه آماده
  • ابزار طراحی
  • کتاب
  • مقالات
ورود یا ثبت نام

دانلود مجموعه آیکون های متحرک SVG

خانهسورس و پروژه آمادهدانلود مجموعه آیکون های متحرک SVG
قیمت :

رایگان!

امتیاز
0 از 0 رأی
بدون امتیاز 0 رای
رایگان!
ویژگی های محصول
تعداد خرید / دانلود : 1,214
پیش نیاز: HTML CSS
حجم فایل: zip
58 کیلوبایت

 

 

حالت مطالعه

توضیحات

دانلود مجموعه آیکون متحرک

همان طور که می دانید یکی از مهم ترین مواردی که میبایست در طراحی رعایت کنید، تعامل با کاربر است. یک طرح خوب می بایست نسبت به رفتارهای کاربر واکنش نشان دهد. مثلا یک دکمه می بایست به گونه ای طراحی شود که زمانی که کاربر روی آن Hover کند، رنگ آن تغییر کند.

از دیگر اتفاقاتی که می تواند در یک رابط کاربری در تعامل با کاربر بیفتد، استفاده از آیکون هایی است که نسبت به کلیک کردن یا Hover واکنش نشان دهند. امروز با دانلود آیکون های متحرک با فرمت SVG در خدمتتان هستیم.مجموعه آیکون های متحرک titanic کلکسیونی از رایج ترین و زیباترین آیکون های متحرک مورد استفاده از عموم پروژه ها هستند.

سبک طراحی این آیکون ها Lineal می باشد و فرمت اصلی آنها SVG می باشد که باعث می شود در تمامی سایزها بدون افت کیفیت قابل استفاده باشند.این آیکون ها در تمامی پروژه های طراحی رابط کاربری وب و اپلیکیشن قابل اجرا هستند و برای تولید آنها از پلاگین bodymovin استفاده شده است.

پیش نمایش آیکون های متحرک

استفاده از این آیکون ها در پروژه های برنامه نویسی رابط کاربری بسیار آسان می باشد که به صورت مختصر و مفید آموزش داده شده است.

نحوه استفاده از سورس کد

برای استفاده از آیکون های متحرک می بایست محتویات پوشه js را به اینصورت در تگ Head به صفحه وب خود معرفی کنید:

<script src="./js/titanic.min.js"></script>
<script src="./js/bodymovin.min.js"></script>

سپس قبل از بسته شدن تگ body صفحه، با استفاده از کد زیر پلاگین را فراخوانی و فعال کنید.(کد زیر را قبل از بسته شدن تگ body قرار دهید.):

<script>
    var titanic = new Titanic('https://rawgit.com/icons8/titanic/master/src/icons/');
</script>

تقریبا کار تمام شده است. کافی است با استفاده از کلاس هایی که داخل فایل index.html موجود است آیکون مدنظر خود را در صفحه وب استفاده کنید.مثلا برای استفاده از ایکون سبد خرید در فایل Html از کد زیر استفاده کنید:

<div class='titanic titanic-shopping'></div>

در واقع هر آیکون درون یک div با دو کلاس قرار خواهد گرفت. کلاس اول titanic و کلاس دوم نام آیکون خواهد بود.

پسورد تمامی فایل های دانلودی در مرجع رابط و تجربه کاربری ایران ، ui-ux.org می باشد.

اصولی یاد بگیرید، حرفه ای شوید و وارد بازار کار شوید:

دوره ui ux

دوره منتورشیپ طراحی UI و UX

وحید دقیقی
241
رایگان!
دوره adobe xd، آموزش adobe xd، آموزش کامل xd، دوره پروژه محور Adobe xd، دوره پروژه محور طراحی UI

دوره آموزشی جامع پروژه محور Adobe XD

محمد امین قاسمی
699
349,000 تومان
آموزش طراحی ui، آموزش طراحی رابط کاربری، دوره طراحی ui، دوره طراحی رابط کاربری، اصول طراحی ui

دوره آموزش طراحی اصولی رابط کاربری(UI)

وحید دقیقی
1,101
349,000 تومان
دوره ux, آموزش ux, آموزش تجربه کاربری , دوره تجربه کاربری

دوره متخصص تجربه کاربری (UX)

وحید دقیقی
954
349,000 تومان
5/5 (2 Reviews)
برچسب: svg آیکون طراحی تعاملی

moreدوره های مرتبط

دانلود UI Kit اپلیکیشن ورزشی

دانلود UI اپلیکیشن ورزشی

در این پست با دانلود کیت طراحی UI اپلیکیشن ورزشی در خدمت شما هستیم که صفحات طراحی شده جذابی دارد و سه فرمت XD ,SKETCH و PS را پشتیبانی میکند.

387
رایگان!
UI صفحه فرود

دانلود UI صفحه فرود مدرن

در این پست با UI صفحه فرود بسیار مدرن و زیبا به نام Medbloc در خدمت شما هستیم که می توانید از آن در انواع پروژه های طراحی UI استفاده کنید.

404
رایگان!
دانلود منوی چسبان

دانلود منوی چسبان و رسپانسیو Bootstrap

دانلود منوی چسبان و شفاف ساخته شده توسط Bootstrap. این منو کاملا رسپانسیو بوده و در موبایل و تبلت هم به زیباترین شکل ممکن نمایش داده می شود.

252
رایگان!

chat_bubble_outlineنظرات

  • Avatar
    aslanimahtab6( دانشجوی دوره )
    2021/01/06
    پاسخ

    سلام من فایل زیپ رو دانلود کردم ولی برای باز کردن از حالت فشرده رمز میخواد و من رمزو پیدا نمیکنم. چی بزنم؟

    • مرجع UIوUX فارسی
      مرجع UIوUX فارسی(مدیریت)
      2021/01/15
      پاسخ

      سلام وقتت بخیر باشه.
      همون طور که پایین صفحه ذکر شده پسورد تمام فایل ها ui-ux.org هستش.
      موفق باشی.

قوانین ثبت دیدگاه

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

لغو پاسخ

نشانی ایمیل شما منتشر نخواهد شد.

قیمت :

رایگان!

افزودن به علاقه مندی
امتیاز
0 از 0 رأی
بدون امتیاز 0 رای
رایگان!
تعداد خرید / دانلود : 1,214
پیش نیاز: HTML CSS
فرمت: zip
58 کیلوبایت
مرجع UIوUX فارسی
مرجع UIوUX فارسی
تیم تولید محتوا

ناشر جدیدترین و معتبرترین منابع حوزه طراحی و توسعه UI و UX به زبان فارسی

دسته: سورس و پروژه آماده
کتاب رابط کاربری خوب

goodui فارسی

آموزش ui ux

  • location_on
    خراسان جنوبی، بیرجند ،خیابان امام موسی صدر، پارک علم و فناوری
  • phone_android
    09357387480
  • perm_phone_msg
    uiuxfarsii
  • email
    uiuxfarsi@gmail.com
دسترسی سریع
  • صفحه اصلی
  • دانلود فایل
  • دوره های آموزشی
  • مقالات
  • پروژه آماده
  • سورس کد
  • ابزار طراحی
  • کتاب
  • سبد خرید
  • حساب کاربری
درباره مرجع UI و UX

پس از پررنگ شدن مباحث رابط و تجربه کاربری در دنیای IT ، نیاز به یک مرجع تخصصی آموزش و تسهیلگر بیشتر احساس شد. پس برآن شدیم به عنوان اولین مرجع UI و UX فارسی فعالیتمان را شروع کنیم و سعی داریم با کمک شما بهترین و باکیفیت ترین دوره های آموزشی و ابزارها را در اختیار شما همراهان عزیز قرار دهیم.

تولید محتوا و پشتیبانی توسط تیم مرجع UI و UX فارسی
keyboard_arrow_up