تاثیر انیمیشن در طراحی تجربه کاربری اپلیکیشن

امروزه انیمیشن ها در دنیای طراحی جایگاه ویژه ای پیدا کرده اند. خوشبختانه طراحان انیمیشن نسبت به گذشته بهتر عمل میکنند، اگر خاطرتان باشد در گذشته از انیمیشن های پر زرق و برق و گیج کننده استفاده میشد که این موضوع در نهایت باعث احساس رنجش در کاربر میشد. اما در حال حاضر انیمیشن ها دارای شکل بهتر و چشم نوازتری شده اند که نه تنها کاربر را اذیت نمی کنند، بلکه باعث راهنمایی او هم میشوند. با پیشرفت تکنولوژی روش های زیادی برای طراحی انیمیشن بوجود آمده و دیگر وقت آن رسیده که با تصاویر Gif و انیمیشن های فلش پلیر خداحافظی کنید. استفاده از کدهای HTML5 و CSS3 این امکان را به طراحان میدهد تا صفحات سایت خود را به زیبایی هرچه تمام تر طراحی کنند. ما در این مقاله قصد داریم نکاتی را در مورد ساخت انیمیشن و ارتباط آن با طراحی اپلیکیشن و UX آن بیان کنیم. بنابراین توصیه میکنیم تا انتهای این مطلب همراه ما باشید.

انیمیشن چیست

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

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

تجربه کاربری (UX) چیست؟

تجربه کاربری به تعامل کاربر با محصولات یا خدمات شما گفته میشود. به عبارتی، احساسی که کاربر یا مشتری در هنگام استفاده از خدمات یا محصولات شما دارد را تجربه کاربری میگویند. طراح تجربه کاربری موظف است تا با تحقیق در مورد کاربران، معماری افراد و اطلاعات، wireframes ،user flows، نمونه سازی و تست کاربری و ... بهترین تجربه را برای مشتریان در هنگام استفاده از محصولات یا خدمات کمپانی مورد نظر به ایجاد کند.

اصول انیمیشن در تجربه کاربری

در ابتدا باید بتوانید مخاطب هدف خود را به بهترین شکل ممکن شناسایی کنید. سپس زبان حرکتی را به درستی در انیمیشن خود استفاده کرده و سعی نمایید سطح جدیدی از عمق محصول را به صورت طبیعی در طراحی انیمیشن استفاده کنید. در ادامه برخی از ترفندهایی که باعث میشود انیمیشن بهتری تولید کنید را شرح میدهیم:

1. انیمیشن معنا دار تولید کنید

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

اگر انیمیشنی که تولید میکنید هدف متناسب یا خاصی نداشته باشد، احتمال دارد باعث رنجش کاربر شود و در مشتری شما احساس ناخوشایندی ایجاد کند.

2. انتقال آهسته

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

3. نشانه های بصری

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

4. حرکت حداقلی اشیا به صورت همزمان

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

5. سرعت و مدت به صورت بهینه شده

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

جمع بندی

انیمیشن در طراحی تجربه کاربری، یکی از عناصر اصلی برای طراحی اپلیکیشن می باشد. این موضوع نه تنها باعث بیشتر شدن استفاده از محصولات شما میشود، بلکه از نظر بصری هم زیبایی خاصی به اپلیکیشن و سایت شما میبخشد. ما در این مطلب در مورد تعریف انیمیشن، تعریف تجربه کاربری، وظایف طراح تجربه کاربری و چند ترفند برای تولید انیمیشن صحبت کردیم. امیدواریم مطالب ارائه شده در این نوشته برای شما مفید واقع شده باشد.