استفاده از انیمیشن و گرافیک های با کیفیت در طراحی سایت

روز به روز استفاده از انيميشن ها در فضاي وب در حال افزايش است ، چرا که اينگونه کاربر تجربه کاربري بهتر و لذت بخش تري را از گردش در صفحات وب سايت خواهد برد . به هر حال جذابيت انيميشن ها براي کاربر دليل نمي شود که هر جاي سايت از آن ها استفاده کنيم . بايد در به کاربر بردن آن ها دقت کافي را داشت . به طور کلي مي توان انيميشن ها را در دوسته تقسيم بندي کرد :
1. انيميشن هاي مقياس بزرگ (Large-Scale) : از اين ها به عنوان ابزار تعامل اوليه استفاده مي شود که تاثير زيادي بر کاربران داشته و شامل جلوه هايي چون پيمايش پارالاکس (Parallax Scrolling) و اطلاعيه هاي پاپ-آپ (Pop-up Notifications) مي شود .
2. انيميشن هاي مقياس کوچک (Small-Scale) : اين دسته از انيميشن ها نيز شامل اسپينرها (spinner) ، ابزارهاي شناور (hover) و نمادهاي بارگذاري (loading bars) مي شود که نياز به دريافت ورودي از کاربر ندارند . افزايش رتبه سايت
در اينجا به هفت مورد از تکنيک هاي معروف انيميشن اشاره خواهيم کرد :
انيميشن هاي زمان بارگذاري صفحه
اين انيميشن ها براي جلوگيري از خسته شدن وسرگرم کردن کاربر در زمان بارگذاري صفحه است .انيميشن هاي هنگام بارگذاري صفحه معمولا در طراحي فلت (Flat Design) و مينيماليسم ، پورتفوليوها و سايت هاي تک صفحه اي بيشتر مورد استفاده قرار مي گيرد .
سعي کنيد آن ها را ساده و بي صدا طراحي کنيد . همچنين دقت کنيد که رنگ بندي آن ها با رنگ بندي صفحات سايتتان هماهنگ باشد .
نويگيشن و منوها (بي پيمايش)
نويگيشن منوهاي مخفي بسيار محبوب شده اند ، به ويژه چون آن ها فضاي بيشتري از صفحه براي استفاده را در اختيار شما قرار مي دهند . همانطور که در مثال زير مي بينيد که با ابزار نمونه سازي مشترک UXPin ساخته شده است ، از اين انيميشن ها براي آشکار سازي منوها براي کاربر زماني که بر روي دکمه اي در صفحه کليک مي کند استفاده مي شود .
انيميشن هاي شناور
جلوه هاي شناور حس خيلي خوبي به کاربر مي دهد زماني که نشانگر موس را بر روي محتوايي در صفحه وب سايت شما مي برد و آن بخش يا عبارت در صفحه به رنگ ديگري در مي آيد که اين مسئله تاثير بصري ويژه اي نيز دارد .
گالري ها و اسلايد شو ها
استفاده از انيميشن هاي گالري و اسلايد شو راه موثري براي نمايش جذاب تصاوير سايت به کاربر است . اين تکنيک براي سايت هاي عکاسي و يا نمايش محصولات يک سايت فروشگاهي و پورتفوليوها (نمونه کارها) مي باشد .
انيميشن هاي متحرک (Motion Animation)
چشمان انسان به طور طبيعي به جنبش ها و تحرکات واکنش نشان مي دهد ، بنابراين مي توان با قرار دادن يک انيميشن متحرک در قسمتي از صفحه وب سايت توجه بازديد کننده را جلب کرد . همچنين اين تکنيک مي تواند به ما کمک کند که يک سلسله مراتب بصري براي نمايش محتواي يک بخش از سايت به کاربر ايجاد کنيم .
پيمايش (Scrolling)
پيمايش روان محتواي صفحات وب سايت به ميزان انيميشني که به آن ها و سطح کنترلي که به کاربر داده شده است بستگي دارد .
انيميشن هاي پس زمينه / ويدئوها
يک بک گراند انيميشن دار ساده مي تواند جلوه بصري جذابي به سايت ببخشد ، به اين شرط که به طور متعادل و در جاي مناسب به کار گرفته شود . در غير اين صورت ، انيميشن پس زمينه مي تواند براي کاربر گيج کننده و نامطلوب نيز باشد .
وب نوش