ظاهر سایت بخشی از تصمیم مشتری است. این گزارش نشان می دهد پارالاکس و نئومورفیسم چه زمانی به برند کمک می کنند، چه هزینه ای دارند و چه پرسش هایی را باید پیش از سفارش طراحی از تیم اجرایی بپرسید.
وقتی مشتری برای اولین بار سایت یک برند را باز می کند، چند ثانیه بیشتر وقت ندارد که تصمیم بگیرد بماند یا برگردد. در همین چند ثانیه نه قیمت ها را مقایسه می کند و نه متن ها را می خواند؛ بیشتر چیزی که او را نگه می دارد یا می راند، حس کلی صفحه است: مرتب است یا شلوغ، قابل اعتماد است یا موقت، راه رسیدن به هدفش را نشان می دهد یا او را سردرگم می کند.
در سال های اخیر دو سبک ظاهری بیش از بقیه نظر مدیران را جلب کرده است: پارالاکس، که حس عمق و حرکت می دهد، و نئومورفیسم، که با سایه های نرم سطح هایی شبیه برجستگی می سازد. هر دو جذاب اند، اما هیچ کدام قرار نیست خودبه خود فروش را بالا ببرند. این گزارش برای مدیرانی نوشته شده که می خواهند بدانند این سبک ها چه زمانی به کسب و کارشان کمک می کنند، چه هزینه ای دارند و چه زمانی ساده ترین انتخاب، بهترین است.
ظاهر یک سایت سه کار را همزمان انجام می دهد. اول، اعتماد می سازد: سایتی که تمیز و هماهنگ است، این پیام را می دهد که مجموعه پشت آن منظم کار می کند. دوم، توجه را هدایت می کند: چشم مشتری باید بداند اول کجا نگاه کند و بعد کجا برود. سوم، اقدام را ساده می کند: دکمه تماس، فرم درخواست و قیمت باید در کمترین زمان پیدا شوند.
هر سبک ظاهری باید از این سه کار حمایت کند. اگر یک افکت جذاب باشد اما مشتری را از دکمه تماس دور کند، به برند آسیب زده است. به همین دلیل پیش از انتخاب سبک، بهتر است سه پرسش ساده را جواب بدهیم: مشتری ما کیست و از چه دستگاهی وارد می شود؟ مهم ترین اقدامی که از او می خواهیم چیست؟ و چه چیزی می تواند او را در مسیر آن اقدام معطل کند؟
پارالاکس روشی برای ایجاد حس عمق است. هنگام پیمایش صفحه، پس زمینه و عناصر جلویی با سرعت های متفاوت حرکت می کنند. مثل نگاه کردن به یک منظره از پنجره قطار است که درخت های نزدیک سریع تر از کوه های دور از جلوی چشم می گذرند. نتیجه، صفحه ای است که زنده تر و سه بعدی تر به نظر می رسد.
این جلوه معمولاً وقتی مفید است که توضیح خدمت یا محصول به نمایش مرحله ها، اجزا یا فضا نیاز داشته باشد. تولیدکننده تجهیزات می تواند اجزای محصول را به ترتیب نشان بدهد. استودیوی معماری می تواند عمق فضا را به مشتری نمایش دهد. برند هنری یا فرهنگی هم می تواند با حرکت آرام، مجموعه آثارش را روایت کند. این ها کاربردهای محتمل اند، نه تضمین فروش بیشتر.
نکته مهم این است که پارالاکس به تنهایی نشانه کیفیت نیست. یک سایت پارالاکسی می تواند عالی طراحی شده باشد یا کند و آزاردهنده. تفاوت را معمولاً اجرا می سازد، نه نام سبک. گروه توسعه کسب و کار آتی نگر در صفحه طراحی سایت پارالاکس همین نکته را توضیح می دهد: این افکت باید به فهم محتوا و ثبت درخواست کمک کند، نه فقط به نمایش.
در طراحی وب سایت یک مجموعه تولیدی فعال در صنعت مواد غذایی، استفاده از پارالاکس بخشی از رویکرد بصری پروژه بود. هدف این سبک، ایجاد تجربه ای متفاوت برای معرفی برند و محصولات، بدون پیچیده کردن مسیر دسترسی کاربران به اطلاعات اصلی بود.
چنین پروژه هایی نشان می دهند که پارالاکس زمانی ارزشمند است که حرکت و عمق بصری در خدمت روایت برند قرار بگیرند. با این حال، ارزیابی موفقیت طراحی به ظاهر آن محدود نمی شود؛ سرعت بارگذاری، تجربه موبایل و سهولت دسترسی به محصولات نیز باید بررسی شوند.
پارالاکس مزیت دارد، اما بی هزینه نیست. چند لایه بزرگ، تصاویر سنگین و محاسبه زیاد هنگام هر پیمایش می تواند صفحه را کند یا ناپیوسته کند. این مشکل روی گوشی های متوسط و اینترنت ضعیف بیشتر دیده می شود، و بیشتر بازدیدکنندگان بسیاری از سایت ها همین گروه اند.
هزینه فقط فنی نیست. طراحی لایه ها، آماده سازی تصویر، برنامه نویسی رفتار حرکت، آزمایش در مرورگرهای مختلف و نگهداری بعدی، همه زمان و بودجه می خواهند. این به معنی بد بودن روش نیست؛ یعنی هر حرکت باید فایده مشخصی داشته باشد. یک راه ساده برای قضاوت این است که همان بخش را یک بار با افکت و یک بار بدون آن ببینیم و بپرسیم کدام یک مشتری را سریع تر به هدفش می رساند.
دو قاعده کاربردی هم وجود دارد. اول، پارالاکس را به یک یا دو بخش محدود کنید، مثلاً معرفی برند یا محصول، و صفحه های خدمات و فرم ها را ساده نگه دارید. دوم، سایت را روی گوشی واقعی آزمایش کنید، نه فقط روی نمایشگر قدرتمند دفتر کار. سایتی که روی لپ تاپ شما روان است، لزوماً روی گوشی مشتری روان نیست.
نئومورفیسم، که با نام Soft UI هم شناخته می شود، رویکردی در طراحی رابط است که در آن رنگ عنصر و زمینه به هم نزدیک است و با سایه روشن و سایه تیره، توهم برجستگی یا فرورفتگی ایجاد می شود. کارت ها انگار از جنس همان زمینه اند و کمی بالا آمده اند؛ کادرهای ورودی مثل گودی کم عمقی در همان سطح دیده می شوند. حاصل کار، ظاهری نرم، آرام و مدرن است.
این حس برای معرفی محصول دیجیتال، نمایش دقت در طراحی یا ساختن فضایی آرام مناسب است. اما حس لوکس یا مدرن به تنهایی ارزش تجاری قابل اندازه گیری نیست. اگر مشتری نفهمد کدام سطح دکمه است و کدام فقط تزئین، همان زیبایی به مانع تبدیل می شود. آتی نگر در صفحه طراحی سایت نئومورفیسم پیشنهاد می کند برای بسیاری از سایت های خدماتی، این زبان بصری انتخابی به کار رود؛ یعنی عمق و لطافت در بخش های مناسب باشد و برای اقدام های حساس، نشانه های روشن و آشنا استفاده شود.
مهم است بدانیم نئومورفیسم یک فناوری یا قالب نیست. می توان آن را با ابزارهای مختلف ساخت و اجرایش خوب یا ضعیف بود. هم چنین نباید آن را با اسکیومورفیسم، که به اشیای واقعی شباهت می سازد، یا گلاس مورفیسم، که از شفافیت و محو شدگی شیشه ای بهره می گیرد، اشتباه گرفت.
در طراحی رابط یک سامانه مدیریت ارتباط با مشتری، از عناصر نئومورفیسم برای ایجاد فضای بصری نرم تر و منسجم تر استفاده شده است. در چنین نرم افزارهایی، کاربران با فرم ها، اطلاعات مشتریان، کارت های مدیریتی و ابزارهای متعدد سروکار دارند.
استفاده هدفمند از سایه های نرم و برجستگی های کنترل شده می تواند به ایجاد هویت بصری یکپارچه کمک کند؛ اما در نرم افزارهای سازمانی، تشخیص دکمه ها، وضعیت فرم ها و خوانایی داده ها اولویت بالاتری از جلوه های تزئینی دارند. این تجربه یک اصل مهم را یادآوری می کند: نئومورفیسم زمانی انتخاب مناسبی است که زیبایی رابط، مانعی برای انجام سریع و دقیق فعالیت های کاربران نباشد.
بزرگ ترین چالش این سبک، کم بودن تضاد است. وقتی رنگ دکمه و زمینه تقریباً یکی است، تشخیص دکمه از تزئین دشوار می شود. برای کسی که بینایی کامل ندارد، با نور شدید صفحه را می بیند یا از گوشی ارزان استفاده می کند، این دشواری چند برابر است. متن ها، آیکون ها و مرز کنترل ها باید به اندازه کافی تیره و واضح باشند.
هم چنین عمق باید معنا داشته باشد. اگر کارت معرفی برجسته است و کادر شماره تماس فرورفته، این منطق باید در همه صفحه ها تکرار شود. اگر همه چیز برجسته شود، دیگر هیچ چیز مهم تر از چیز دیگر دیده نمی شود. بهتر است تعداد محدودی سطح عمق تعریف کنیم و فاصله، گوشه و سایه هر سطح را در یک راهنمای طراحی ثبت کنیم تا صفحه های بعدی هماهنگ بمانند.
برای فرم ها و بخش های حساس، مثل ثبت سفارش، پرداخت و درخواست مشاوره، توصیه ساده است: از نشانه های آشنا و پررنگ استفاده کنید. دکمه ای که واضح باشد، بهتر از دکمه ای است که فقط زیبا باشد.
| معیار | پارالاکس | نئومورفیسم |
| حس اصلی | عمق و حرکت هنگام پیمایش | برجستگی و فرورفتگی نرم |
| کاربرد مناسب | معرفی محصول، روایت برند | کارت های منتخب، معرفی محصول دیجیتال |
| ریسک اصلی | کندی و ناپیوستگی روی موبایل | ابهام در تشخیص دکمه ها و متن |
| روش امن تر | محدود کردن به یک یا دو بخش | استفاده انتخابی و کنترل های پررنگ |
گاهی ساده ترین طراحی، بهترین است. اگر بیشتر مشتریان شما با گوشی و اتصال ضعیف وارد می شوند، یا می خواهند سریع یک کار مشخص انجام دهند، طراحی کم حرکت اغلب نقطه شروع معقول تری است. در مسیرهایی مثل پرداخت، رزرو، ورود کاربر و تکمیل فرم، هیچ افکتی نباید زمان انجام کار را بیشتر کند.
هم چنین اگر مدیر خرید یک شرکت می خواهد چند تأمین کننده را مقایسه کند، سایت باید به او اجازه بدهد از روایت عبور کند و مستقیم به مشخصات، شرایط همکاری، نشانی و فرم استعلام برسد. حرکت طولانی که باید منتظر پایانش ماند تا قیمت یا مشخصات دیده شود، جذابیت اولیه را به اصطکاک تبدیل می کند.
راه میانه هم وجود دارد: ساختار اصلی ساده و واضح باشد و یک یا دو بخش مهم، مانند معرفی برند یا کارت های منتخب، از افکت بهره بگیرند. بدین ترتیب هم برند حس متفاوتی می دهد و هم مشتری در مسیر هدفش معطل نمی ماند.
اگر قصد دارید سایت جدید سفارش بدهید، پیش از تأیید طرح این پنج سؤال را از طراح یا تیم اجرایی بپرسید:

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