این سند الگوها و ایده های مختلف طراحی را برای شروع سفر با نمای هوایی خود شرح می دهد. نحوه ارائه نمای هوایی به مشتریان خود باید به دقت مورد توجه قرار گیرد تا اطمینان حاصل شود که سطح خوبی از تعامل با محصول را مشاهده می کنید و مشتریان شما ارزش آن را می بینند.
نمای هوایی یک جزء بصری جذاب را به وب سایت شما اضافه می کند و نمای پرنده ای از یک ملک و محیط اطراف را نشان می دهد.
وقتی کاربران یک ویژگی را به صورت سه بعدی می بینند، می توانند درک بهتری از مکان و اندازه آن داشته باشند. همچنین به برجسته کردن ویژگی‌های ملک، مانند استخر، ساختمان‌های بیرونی، یا حیاط بزرگ، علاوه بر ویژگی‌های مجاور مانند جاده‌ها، بدنه‌های آبی، کوه‌ها یا پارک‌ها کمک می‌کند.
افزایش مشارکت
نمای هوایی یک عامل شگفت انگیز برای مشتریان شما خواهد بود، و برای مشاهده سود کامل، محتوا باید تا حد امکان آسان باشد. در این بخش، در مورد برخی از الگوهای طراحی پیاده سازی برای Aerial View برای رسیدن به این هدف صحبت خواهیم کرد.
جهت گیری ویدیویی
مهم است که جهت صفحه دستگاهی را که ویدیوی Aerial View در حال بارگیری است در نظر بگیرید. نمایش یک ویدیوی منظره گرا در یک دستگاه تلفن همراه، به خصوص در حالت تمام صفحه، می تواند تجربه کاربری بدی باشد. با نمایش یک ویدیو با استفاده از نسبت تصویر نادرست برای دستگاه، مقدار قابل توجهی از صفحه نمایش را هدر خواهید داد.
ویدیوهای Aerial View در جهت افقی و عمودی ارائه می شوند.
در زیر، نمونه‌ای از تفاوت اجرای نمای هوایی در دستگاه تلفن همراه، در جهت توصیه‌شده، و جهت غیر توصیه‌شده را می‌توان مشاهده کرد:
هاورکارت جاسازی شده
هنگام نمایش چندین ویژگی در نمای جستجوی دارایی، اضافه کردن کارت های شناور تعبیه شده برای نمایش ویدیوی نمای هوایی، با اطلاعات اضافی درباره ملک، مانند آدرس و قیمت در بالا، مفید است. این به کاربران این امکان را می‌دهد تا بدون نیاز به کلیک کردن بر روی صفحه جزئیات ملک، به سرعت و به راحتی احساسی از ملک پیدا کنند.
مثال زیر نشانگری را نشان می دهد که مجموعه Googleplex را در Mountain View نشان می دهد. هنگامی که ماوس را روی این نشانگر می‌برید، کارت شناور ظاهر می‌شود و ویدیوی نمای هوایی ملک را نشان می‌دهد.
یک رویداد onClick را می توان هم به نشانگر و هم به کارت شناور تعبیه شده اضافه کرد تا کاربر را به صفحه جزئیات دارایی هدایت کند. این امر باعث می شود تا کاربران بتوانند اطلاعات بیشتری در مورد ملک پیدا کنند و تصمیم بگیرند که آیا برای آنها مناسب است یا خیر.
تجربه ای شبیه به داستان برای دارایی خود ایجاد کنید
اگر می‌خواهید تجربه‌ای واقعاً همه‌جانبه برای خریداران بالقوه ایجاد کنید، می‌توانید ملک خود را با تجربه‌ای شبیه به داستان که ترکیبی از عکس‌ها و ویدیوی نمای هوایی است، به نمایش بگذارید. HTML، CSS و جاوا اسکریپت.
در مثال بالا، ویدیوی Aerial View را در یکی از اسلایدها قرار داده ایم، با یک لینک در پایین برای مشاهده جزئیات بیشتر در مورد ملک. این دکمه باید کاربر را به صفحه جزئیات ملک ببرد.
در اینجا نحوه کار آن آمده است:
- عکس های خود را انتخاب کنید عکس های متنوعی را انتخاب کنید که بهترین ویژگی های ملک شما را برجسته می کند.
- ویدیوی Aerial View خود را ایجاد کنید.
- عکس ها و ویدیوهای خود را در یک داستان ترکیب کنید.
- داستان خود را به اشتراک بگذارید داستان خود را با خریداران بالقوه در وب سایت یا کمپین های بازاریابی ایمیلی به اشتراک بگذارید.
با ایجاد تجربه ای شبیه به داستان برای ملک ویترین خود، می توانید توجه خریداران بالقوه را به خود جلب کنید.
شروع نمای هوایی در بارگذاری صفحه
در مطالعات UX گوگل می بینیم که بیشترین تعامل کاربر زمانی رخ می دهد که نمای سه بعدی به طور پیش فرض بارگیری شود. از آنجایی که این یک فرم فاکتور جدید و هیجان انگیز است، می خواهیم به محض اینکه مشتری بخواهد جزئیات ملک را مشاهده کند، آن را بارگیری کنیم. وقتی به هزینه فکر می کنید، اگر یک ویدیوی Aerial View را از API دریافت می کنید، هزینه ای از شما دریافت می شود. پس از درخواست ویدیو، پخش خودکار را در نظر بگیرید تا مطمئن شوید که کاربران شما مزیت را خواهند دید.
الگوی ضد: پنهان کردن نمای هوایی در پشت یک دکمه به عنوان یک ضد الگو در نظر گرفته می شود زیرا کاربران را مجبور می کند تا یک گام اضافی برای مشاهده نمای سه بعدی بردارند. این می تواند ناامید کننده باشد، و همچنین می تواند منجر به از دست دادن مزایای نماهای سه بعدی یا اشتباه گرفتن نمای هوایی به عنوان محتوای ثابت شود.
توصیه می شود زمانی که مشتری می خواهد جزئیات ملک را مشاهده کند، Aerial View را به صورت پیش فرض بارگیری کنید. این یک تجربه کاربری عالی خواهد داشت و به آنها کمک می کند تا تصمیم آگاهانه ای در مورد ملک بگیرند. هنگام طراحی تجربه پخش خودکار، به خاطر داشته باشید که ویدیوی Aerial View 30 مگابایت + است و ممکن است برای برخی از کاربران کند باشد.
اگر یک چرخ فلک تصویری به عنوان بخشی از صفحه خود دارید، ویدیوی Aerial View را می توان به عنوان آیتم اصلی درج کرد و به شما این امکان را می دهد که به راحتی تجربه سه بعدی را در طراحی وب سایت فعلی خود ادغام کنید.
قرار دادن دکمه‌ها برای بارگذاری نماهای سه بعدی آسان است، اما می‌تواند تعامل را کاهش دهد. Google Maps نماهای سه بعدی را به طور پیش فرض بارگیری می کند. به عنوان مثال، هنگامی که ساختمان امپایر استیت را جستجو می کنید، نمای سه بعدی به طور خودکار بارگیری می شود و در حالی که هنوز در نمای سه بعدی هستید، می توانید نمای جزئی از تصاویر را مشاهده کنید. این یک راه عالی برای ارائه تجربه ای فراگیرتر و جذاب تر به کاربران است.
طراحی دکمه
اگر می خواهید از دکمه ای برای دسترسی به نمای هوایی استفاده کنید، مهم است که موارد زیر را در نظر بگیرید:
- مکان : دکمه باید با سایر دکمه های مربوط به نقشه برداری گروه بندی شود تا کاربران بدانند که مربوط به مکان ملک است.
- انتقال : انتقال به ویدیو باید صاف و بدون درز باشد. اگر قبلاً بخشی در صفحه وجود دارد که تصاویر، نقشه‌ها و نمای خیابان را نشان می‌دهد، ویدیوی Aerial View باید در همان بخش نمایش داده شود.
- برجسته کردن : از آنجایی که این یک افزودنی جدید به صفحه خواهد بود، برجسته کردن دکمه با یک برچسب "ویژگی جدید" یا یک تصویر کوچک تصویر ثابت از ویدئو مفید است.
- تاکید : دکمه باید با تاکید متوسط یا زیاد طراحی شود، زیرا فشار دادن آن عمل برجسته ای را انجام می دهد. Google Material Design راهنمایی هایی در مورد نحوه طراحی دکمه ها با سطوح مختلف تاکید دارد.
در اینجا چند نکته اضافی برای طراحی دکمه Aerial View موثر وجود دارد:
- از زبان روشن و مختصر استفاده کنید. دکمه باید به وضوح برچسب گذاری شود تا کاربران بدانند چه کاری انجام می دهد.
- از فونت بزرگ و خوانا استفاده کنید. دکمه باید به اندازه ای بزرگ باشد که به راحتی توسط کاربران دیده و کلیک شود.
- از رنگ متضاد استفاده کنید. دکمه باید رنگی متفاوت از متن و پس‌زمینه اطراف داشته باشد تا برجسته شود.
- از یک فراخوان برای اقدام استفاده کنید. این دکمه باید شامل یک فراخوان برای اقدام واضح باشد، مانند "تماشای نمای هوایی" یا "تماشای ویدئو".
ملاحظات نمایش
ویدئو در حال بارگذاری
ممکن است بخواهید با نمایش یک پیش‌نمایش تصویر ثابت از ویدیو، و بارگیری تجربه کامل در تعامل با کاربر، مانند onClick، اتصالات کندتر را در نظر بگیرید. همراه با ویدیوی Aerial View، به یک تصویر کوچک نیز دسترسی خواهید داشت که می‌توان از آن برای انجام این کار استفاده کرد.
شما همچنین به ویدئو با رزولوشن های مختلف دسترسی خواهید داشت، بنابراین می توان از آنها به صورت استراتژیک برای به حداقل رساندن زمانی که کاربر در انتظار بارگذاری تجربه صرف می کند، در سرعت های مختلف اتصال استفاده کرد.
اسناد لوگو
هنگامی که نمای هوایی را اجرا می کنید، باید مطمئن شوید که از تمام شرایط، از جمله انتساب لوگو پیروی می کنید. برای جزئیات بیشتر به این صفحه مراجعه کنید .
نتیجه
امیدواریم این مقاله الهام بخش شما باشد تا به این فکر کنید که چگونه می‌خواهید Aerial View را در وب‌سایت خود با درگیری کاربر بالا پیاده‌سازی کنید.
مهم است که فکر کنید کاربر شما چگونه محتوا را کشف می‌کند و در چه قالبی برای نمایش آن مناسب‌تر است. همچنین خوب است نوع دستگاهی را که ویدیو در آن پخش می‌شود، به خصوص جهت صفحه و سرعت اتصال کاربر در نظر بگیرید. .
مراحل بعدی
پیشنهاد مطالعه بیشتر:
مشارکت کنندگان
گوگل این مقاله را حفظ می کند. مشارکت کنندگان زیر در ابتدا آن را نوشتند.
نویسنده اصلی:
Henrik Valve | مهندس راه حل های پلتفرم نقشه های گوگل