آریا جوان - انیمیشن‌ها بخشی دوست‌داشتنی از رابط‌های کاربری هستند. در این مقاله با هشت انیمیشن مهم و کلیدی در رابط‌های کاربری از زمان ظهور آن‌ها تا به امروز، آشنا می‌شویم.

انیمیشن‌ها در رابط کاربری حکم ادویه برای طراح را دارند؛ در صورت استفاده زیاد، طعم محصول شما را خراب می‌کنند، اما میزان مناسب به اعتلای کیفیت آن کمک شایانی می‌کند. مقاله‌های مرتبط:
آموزش طراحی تجربه‌ی کاربری (UX) بهبود عملکرد طراحان UX و UI به کمک تکنیک‌های اوریگامی
با وجود اینکه انیمیشن‌ها برخلاف سایر عناصر طراحی خیلی در ذهن کاربران نمی‌مانند، یک عضو اصلی از هر تجربه کاربری دیجیتالی محسوب می‌شوند. از همین رو در این مقاله با معرفی هشت انیمیشن مهم، ادای احترامی نسبت به این عناصر دوست‌داشتنی کرده‌ایم. این هشت انیمیشن‌ شاید دارای زمان و محیط متفاوتی نسبت به هم باشند، اما همگی یک نقطه اشتراک پررنگ دارند؛ همگی یک گام روبه‌جلو در نحوه تعامل ما با فناوری به شمار می‌روند. بدون این انیمیشن‌ها، رابط‌های کاربری رنگ و لعاب فعلی خود را نداشتند. 1. نشانگر چشمک‌زن (1967)
این انیمیشن به‌حدی قدیمی و جاافتاده است که احتمالا تا به حال حتی به آن فکر هم نکرده‌اید. انیمیشنی که به یک استاندارد در تمام رابط‌های کاربری تبدیل شده‌است. این انیمیشن ابتدا از سوی چارلز ای. کیسلینگ (Charles A. Kiesling) در سال 1967 ثبت شد و در گوشی‌های همراه، دستگاه‌های خودپرداز، رایانه‌ها، مرورگرها و احتمالا فناوری‌های آینده مورد استفاده قرار گرفته‌است. انیمیشنی ساده، نمادی و نقطه شروع برای نسلی از انیمیشن‌های دیجیتال در رابط‌های کاربری. این انیمیشن برای نشان‌دادن «تمرکز» در صفحه‌نمایش و آماده‌بودن آن برای دریافت ورودی از سوی کاربر، پدید آمده‌است. 2. اسپلش اسکرین سگا جنسیس (1989)

هر کنسول بازی‌های ویدیویی انیمیشن ورودی خودش را داشت، اما هیچ‌کدام به‌یادماندنی‌تر از سگا جنسیس (Sega Genesis) نبوده‌اند. سگا جنسیس رقیب 16-بیتی کنسول سوپر ان‌ای‌اس (Super NES) شرکت نینتندو بود. زمانی‌که لوله‌کش محبوب بازی‌های ویدیویی، ماریو، مشغول نجات پرنسس بود، سونیک شرکت سگا هم در حال دویدن بود و این دو عنوان رقیب یکدیگر به شمار می‌رفتند. سخت‌افزار سگا جذاب و مشکی بود، درحالی‌که نینتندو ظاهری خاکستری و بزرگ داشت. برندینگ سگا از اولین لحظه‌های رابط کاربری آغاز می‌شد. در زمانی‌که صفحه ورودی هرکدام از بازی‌های سگا جنسیس با یکدیگر اندکی تفاوت داشت، نینتندو اینترتینمنت سیستم (انتشار 1985) و سوپر ان‌ای‌اس (انتشار در 1991) به کلی صفحات ورودی را حذف کرده‌بودند. سگا در صفحه ورودی خود یک فلش نوری و یک قطعه صدای متفاوت از نام برند پخش می‌کرد. سگا قبل از نابودی در دهه اول قرن 21، به نینتندو و بازی‌های ویدیویی کمک کرد تا به سطح جدیدی برسند. دهه شصتی‌ها و هفتادی‌ها احتمالا سگا و خاطرات خوبش را فراموش نخواهند کرد. 3. صفحه ورود AOL (سال 1995)
هم‌اکنون در سال 2019 همه‌چیز آنلاین است. ما حتی شاهد ظهور اسپیکر‌های دائم روشنی هستیم که آماده اتصال به اینترنت با دستور صوتی ما هستند. اما زمانی هم بوده که اتصال به اینترنت مکافات داشت. شما باید می‌نشستید، به تمام آشناهایتان می‌سپردید تا تماس نگیرند، سیم تلفن را به سیستم خود وصل کرده و آن وقت تازه آماده اتصال به اینترنت با هزینه‌ای گزاف می‌شدید. برای بسیاری از افراد، AOL اولین پنجره برای ورود به دنیای وب بود. و صفحه ورود AOL هم انیمیشن بسیار جذابی داشت. انیمیشنی ساده که در آن یک نفر با اتصال به AOL، به گروهی از افراد دیگر می‌پیوندد. این انیمیشن هدف وب و ارتباط ساده با تمام افراد جهان را به زیبایی منتقل می‌کند. 4. صفحه دانلود ویندوز ایکس‌پی (2001)
مدت‌ها پیش از وجود مرورگرهای امروزی اینترنت و گشت‌وگذار آسان بین صفحات وب، دریافت یک فایل ساده نیز کلی مکافات داشت. حتی ساده‌ترین و کم‌حجم‌ترین فایل‌ها چند دقیقه زمان می‌بردند تا دریافت شوند. برای اطمینان از اینکه فایل شما در حال دانلود بوده و ارتباط شما قطع نشده، نیاز به تصویری گیرا بود. نوار پیشرفت، زمان باقی‌مانده و سرعت دریافت هیچ‌کدام مانند مشاهده پرواز کاغذها از چپ به راست، در ذهن کاربران احساس اطمینان ایجاد نمی‌کردند. کاربران می‌توانستند مدت‌ها به این انیمیشن خیره شده و مطمئن باشند که فایل موردنظرشان در حال دریافت است. 5. توپ ساحل مک (2001)
مک‌های ابتدایی از ساعت مچی و ویندوز از ساعت شنی برای نشان‌دادن زمان هدررفته کاربران بر سر سخت‌افزار استفاده می‌کردند. احتمالا هنوز خیلی از شما این انیمیشن‌های معروف و حس بدشان را به خاطر دارید. اپل انیمیشن توپ ساحلی را جایگزین انیمیشن ساعت مچی مک کرد. منتظر ماندن آن هم روی یک دستگاه مدرن اصلا جالب نیست و موجب اذیت کاربران می‌شود. اما صبر کردن برای کاربران OS X با نگاه به آیکون زیبای توپ رنگی کمی راحت‌تر بود. 6. حباب در حال تایپ آی‌مسیج (2007)
عناصر گرافیکی کمی وجود دارند که به اندازه‌ی سه نقطه در حال تایپ استرس‌زا باشند. انیمیشن حباب حاوی سه نقطه اولین‌بار در آی‌مسیج و به منظور اطلاع از در حال تایپ بودن طرف مقابل استفاده شد. امروزه این سه نقطه در حال تایپ تقریبا در هر پیام‌رسانی استفاده شده و عملا به یک استاندارد تبدیل شده‌است. همه ما احتمالا انتظار برای دیدن پاسخ با ظاهر شدن این سه نقطه، آمدن و رفتن این انیمیشن و سعی در ذهن‌خواهی مخاطب‌مان را تجربه کرده‌ایم. 7. انیمیشن «جست‌وجو برای راننده» اوبر (2010)
ده سال پیش، استارتاپی با هدف تحول حمل‌ونقل شهری شروع به کار کرد و موفق شد. اوبر انقلابی است که نحوه‌ی گشت‌و‌گذار مردم در شهرها را بسیار آسان کرده‌است. اوبر همچنین برخی از اولین انیمیشن‌های بسیار مهم در رابط‌های کاربری را پدید آورده‌است. با باز کردن اپلیکیشن اوبر و مشاهده رانندگان در اطرافتان احساس امنیت می‌کنید. مهم نیست که در چه مکان و زمانی هستید؛ تنها کافی است از اوبر استفاده کنید تا به خانه برسید. 8. کشیدن برای بارگذاری مجدد توییتر (2010)
هنگامی که استیو جابز در سال 2007 از آیفون رونمایی کرد، سرنوشت بسیاری از تعاملاتی که با موس و کلیدها انجام می‌شدند کاملا گنگ بود. بسیاری با خود فکر می‌کردند که چگونه می‌توانند روی این دستگاه تایپ کنند. در دوره‌ای که محتوا به‌طور بی‌نهایتی در فضای مجازی تولید و پخش می‌شود، بارگذاری مجدد از مهم‌ترین بخش‌هایی است که نیاز به اختراع مجدد دارد. در همین زمان بود که لورن بریشتر اپلیکیشن موبایل توییتر را با یکی از انقلابی‌ترین انیمیشن‌های رابط کاربری عرضه کرد؛ کشیدن به پایین برای بارگذاری مجدد (pull to refresh). این عنصر امروزه تقریبا در تمامی اپلیکیشن‌ها استفاده شده و به بخشی از زندگی روزمره ما مبدل شده‌است. نظر شما درباره این انیمیشن‌ها و نقش آن‌ها در تحول رابط‌های کاربری چیست؟ آیا انیمیشنی را می‌شناسید که لیاقت حضور در این فهرست را داشته باشد؟ دیدگاه‌های خود را با ما و سایر کاربران به اشتراک بگذارید.