Carsparency Web — مسیر فروشی که اول قیمت خودرو را نشان می‌دهد
فروشنده اول قیمت خودرویش را می‌بیند و بعد به سؤال‌های جزئی‌تر جواب می‌دهد؛ در آخر هم با دوربین گوشی و شانزده عکس هدایت‌شده، خودرو را خودش کارشناسی می‌کند.
شرکت
Carsparency
نقش
طراح محصول
نوع
محصول · رشد
صنعت
مارکتپلیس خودرو · B2C
تیم
طراح محصول؛ تعداد اعضا و نقشهای تیم در فایل‌ها ثبت نشده است
ابزارها و فناوریها
Figma
مسئله
فروشنده می‌خواهد بداند خودرویش چقدر می‌ارزد، اما پلتفرم به پروندهای دقیق و همراه با عکس از خودرو نیاز دارد. اگر اول پرونده را بخواهیم، فروشنده قبل از اینکه بفهمد این پرونده چه اهمیتی دارد، از سایت میرود.
نقش
مسئولیت طراحی محصول را در بخش فروشنده پیش بردم؛ از ویزارد سه‌مرحله‌ای و قیمتهای تخمینی تا سؤال‌های مشخصات خودرو و خودکارشناسی هدایت‌شده، هم در موبایل و هم در دسکتاپ.
نتیجه
طراحی ۱۱۴ فریم موبایل و ۱۱۲ فریم دسکتاپ. در فایل‌ها تاریخ انتشار یا دادهای از قیف تبدیل ثبت نشده است.
شکل 01
شکل 01ویزارد فروشنده روی گوشی: انتخاب برند، اولین قیمت تخمینی همراه با زمان اعتبارش، و شروع خودکارشناسی هدایت‌شده.
01زمینه
مسیر هر خودرو در پلتفرم از همین وب‌سایت شروع می‌شود
Carsparency خودرو را از مالکان شخصی در امارات می‌خرید و در مزایده به نمایشگاه‌داران می‌فروخت. وب‌سایت بخش مالک‌ها در این چرخه است: مالک خودرویش را معرفی می‌کند، قیمت می‌گیرد، مشخصات و عکس‌ها را اضافه می‌کند و بقیه‌ی کار را به Carsparency می‌سپارد.
فایل Figma وب‌سایت ۱۱۴ فریم موبایل و ۱۱۲ فریم دسکتاپ دارد: نسخه‌ی اول، بنچمارکی از فلو فروش یک سرویس موجود و صفحه‌های بعدی که برای امارات طراحی کردم؛ با قیمت به درهم، شماره‌ی تلفن با +971 و سؤالی درباره‌ی مشخصات GCC.
شکل 02اولین چیزی که در صفحه‌ی اصلی دسکتاپ دیده می‌شود، کادر ارزش‌گذاری است: فروشنده قبل از هر چیز انتخاب می‌کند خودرویش را با پلاک، VIN یا برند و مدل معرفی کند.
02مسئله
فروشنده فقط قیمت را می‌خواهد، اما پلتفرم به پرونده‌ی کامل خودرو نیاز دارد.
کارشناسی، قیمت‌گذاری اپراتورها و پیشنهاد نمایشگاه‌دار، همه به اطلاعات دقیق و درستی از خودرو بستگی دارند. اما فروشنده‌ای که از جست‌وجو به سایت می‌رسد، دنبال جواب یک سؤال ساده است: خودروی من چقدر می‌ارزد؟
اگر اول پرونده را می‌خواستیم، خیلی از فروشنده‌ها قبل از دیدن قیمت از سایت می‌رفتند. اگر هم فقط قیمت را نشان می‌دادیم و چیزی نمی‌پرسیدیم، آن قیمت ارزش چندانی نداشت. باید کاری می‌کردیم که هر سؤال برای فروشنده ارزش جواب دادن داشته باشد.
03فلو
قیمت را وسط سه گام فلو گذاشتیم.
ویزارد سه گام دارد: اطلاعات خودرو، مشخصات خودرو و خودکارشناسی. در گام «اطلاعات خودرو»، فروشنده با چند لمس برند، مدل، سال، تیپ، نوع بدنه، بازه‌ی کارکرد و رنگ خودرو را انتخاب می‌کند و شماره‌ی تلفنش را تأیید می‌کند. بعد، قبل از هر سؤال سخت‌تری، قیمتی تخمینی می‌بیند که تا زمان مشخصی معتبر است.
گام «مشخصات خودرو» هفت سؤال درباره‌ی مالکیت سند، وام، وضعیت خودرو، گارانتی، سوابق سرویس، چراغ‌های هشدار و محل خودرو می‌پرسد و در آخر دوباره قیمت تخمینی را نشان می‌دهد. خودکارشناسی فقط وقتی شروع می‌شود که فروشنده قیمتی گرفته که نمی‌خواهد از دستش بدهد.
ویزارد فروشنده، به همان ترتیبی که در فایل آمده است
01
اطلاعات خودروبرند، مدل، سال، تیپ، نوع بدنه، بازه‌ی کارکرد و رنگ، و بعد تأیید شماره‌ی تلفن.
02
قیمت تخمینیاولین قیمت با زمان اعتبارش، قبل از هر سؤال سختتر.
پیش از مشخصات خودرو
پس از مشخصات خودرو
شکل 03قیمت تخمینی دو بار نمایش داده می‌شود: یک بار بعد از اطلاعات خودرو و تأیید شماره‌ی تلفن، قبل از سؤال‌های سختتر، و بار دیگر بعد از مشخصات خودرو. هر دو بار مشخص است قیمت تا چه زمانی معتبر است.
04تصمیم‌های کلیدی
چهار تصمیمی که فلو فروشنده را شکل داد
این تصمیم‌ها از فریم‌ها و ترتیبشان پیداست؛ دلیلشان در فایل ثبت نشده است.
01
قیمت پیش از سؤال‌ها
قیمت تخمینی را قبل از هفت سؤال مشخصات قرار دادیم؛ فروشنده فقط با چند لمس اطلاعات خودرو را وارد می‌کند، شماره‌اش را تأیید می‌کند و قیمت را می‌بیند. این‌طور زود به چیزی که برایش آمده می‌رسد و هر سؤال بعدی را راهی برای دقیق‌تر شدن قیمت خودش می‌بیند، نه مانعی سر راه.
بده‌بستان
قیمت اول تقریبی‌تر است و قیمت دوم ممکن است با آن نخواند.
02
روی قیمت زمان اعتبار بگذار
کنار هر قیمت تخمینی، زمان انقضای آن را هم نشان دادیم تا روشن باشد قیمت بازار فقط برای همان لحظه درست است، و فروشنده دلیلی داشته باشد که همین حالا ادامه بدهد.
گزینه‌های دیگر
قیمتی بدون تاریخ انقضا؛ قیمتی که با تغییر بازار، بی‌سروصدا اعتبارش را از دست می‌داد.
03
مانع‌ها را به مسیر تبدیل کن
وام تسویه‌نشده یکی از دلیل‌های رایجی است که فروش خودرو را متوقف می‌کند. برای همین، سؤال وام را طوری طراحی کردیم که با جواب «بله» تمام نشود و سه راه برای تسویه پیش روی فروشنده بگذارد؛ از جمله سپردن تسویه به Carsparency.
05راه‌حل
هر سؤال دلیلی برای بودنش دارد
برای اینکه فروشنده در این فلو طولانی گم نشود، پیشرفت را در دو سطح نشان دادم: سه گام شماره‌دار در بالای صفحه و ردیفی از چیپ‌ها برای سؤال‌های گام فعلی. با هر جواب، سربرگ صفحه مشخصات خودرو را کامل‌تر نشان می‌دهد؛ اول فقط برند و در آخر برند، مدل، سال، تیپ و نوع بدنه.
سؤال‌های سخت هم راه ادامه را نشان می‌دهند. سؤال وام با جواب «بله» تمام نمی‌شود و سه گزینه پیش روی فروشنده می‌گذارد: خودش وام را تسویه کند، تسویه را به Carsparency بسپارد، یا بگوید وام تسویه شده اما هنوز به‌روز نشده است. خودکارشناسی هم قبل از باز شدن دوربین، فروشنده را آماده می‌کند؛ از نور کافی و تمیز بودن خودرو گرفته تا فاصله گرفتن، چرخاندن گوشی و قرار دادن خودرو درون خطوط راهنما. بعد شانزده عکس از زاویه‌های مشخص می‌خواهد.
معرفی خودرو با پلاک، VIN یا برند و مدل
شناسایی خودرو با لمس، همراه با جست‌وجوی برند و مدل
قیمت تخمینی پیش و پس از مشخصات خودرو، هر کدام با زمان اعتبار
عکاسی هدایت‌شده با محل آسیب، اندازه‌ی آن و نمونه‌های کیفیت عکس
وام، با راههایی برای ادامه
01عکس‌ها را به همان ترتیبی دستهبندی کردم که خریدار خودرو را بررسی می‌کند: بیرون، چرخها، آج لاستیکها، داخل، آسیبها و سوابق سرویس
02هر جایگاه عکس نام زاویه‌ی خودش را دارد تا ابهامی نماند
03فروشنده از همان اول میداند چند عکس لازم است
04فروشنده میتواند کار را ذخیره کند و بعداً تمامش کند، چون کمتر پیش می‌آید هر شانزده عکس را یکجا داشته باشد
شکل 05صفحه‌ی بازبینی عکس‌ها، در اندازه‌ی مرورگر تبلت یا دسکتاپ.
چک‌لیست وضعیت
شکل 07فیلمی برای معرفی صفحه‌های ریسپانسیو، همانطور که طراحی شدهاند، روی دو تبلت: صفحه‌ی اصلی و کادر ارزش‌گذاری، بخش «چطور کار می‌کند»، قیمت تخمینی و گامهای عکسبرداری ویزارد.
روی گوشی
مشخصات خودرو و صفحه‌ی اصلی
06اکوسیستم
پاسخ‌های فروشنده به چک‌لیست کارشناس تبدیل می‌شود
فروشنده در وب‌سایت به سؤال‌هایی درباره‌ی دارنده‌ی سند، وام، گارانتی، سوابق سرویس، چراغ‌های هشدار و مشخصات GCC جواب می‌دهد؛ کارشناس همین موارد را در محل بررسی می‌کند و همین‌ها در گزارش کارشناسی چاپ می‌شوند. وب‌سایت ادعای فروشنده را ثبت می‌کند و کارشناسی درستی آن را می‌سنجد.
قیمت تخمینی همان ارزش‌گذاری‌ای است که نمایشگاه‌داران در Pro با نام Fair Market Value و اپراتورها در بک‌آفیس با نام Fair می‌بینند؛ اینجا فروشنده هم آن را می‌بیند. وب‌سایت از تم روشن دیزاین سیستم استفاده می‌کند و سه محصول دیگر از تم تیره‌ی آن.
07نقش من
سهم سینا
این فهرست را از روی فایل Web نوشتم. تعداد اعضای تیم و اینکه چه کسی چه تصمیمی گرفت در فایل‌ها ثبت نشده است؛ پس این فهرست کاری را نشان می‌دهد که در فایل هست، نه اینکه همه را به‌تنهایی طراحی کرده باشم.
مسئولیت با من
↳طراحی ویزارد سه‌مرحله‌ای فروشنده و نمایش پیشرفت در دو سطح
↳طراحی صفحه‌های قیمت تخمینی، پیش و پس از مشخصات خودرو
↳طراحی سؤال‌های مشخصات خودرو و پاسخ‌های شاخه‌دار آن‌ها
↳طراحی خودکارشناسی هدایت‌شده: آموزش، زاویه‌های مشخص، ثبت آسیب و بازبینی
↳طراحی صفحه‌های پشتیبان در دسکتاپ و موبایل: حساب کاربری، سوابق سرویس، راهنما و خطاها
مسئولیت مشترک
—
همکاری
↳همکاران فنی و عملیاتی که نامشان در فایل‌ها نیامده است
در فایل، بنچمارکی از فلو فروش یک سرویس موجود و نسخه‌ی اول صفحه‌ها هم مانده است؛ صفحه‌های ویزارد و خودکارشناسی مال نسخه‌ی بعدی‌اند که برای بازار امارات طراحی کردم.
08نتایج
آنچه در فایل تحویل دادم
این عددها تعداد فریم‌های طراحی‌شده‌اند، نه نتیجه‌ی کار. عددهایی هم که صفحه‌های مارکتینگ درباره‌ی نظر کاربران و تعداد نمایشگاه‌داران نشان می‌دهند متن موقت‌اند، برای همین هیچ‌کدام را اینجا نیاوردم.
فریم موبایل
۱۱۴
ویزارد، خودکارشناسی و صفحه‌های پشتیبان
خروجی تحویل‌شده
فریم دسکتاپ
۱۱۲
همان مسیر و صفحه‌ها در عرض ۱٬۴۴۰ پیکسل
خروجی تحویل‌شده
زاویه‌ی عکاسی هدایت‌شده
۱۶
هر کدام با نام، و آموزشی پیش از باز شدن دوربین
خروجی تحویل‌شده
آنچه تحویل شد
↳شروع ارزش‌گذاری با پلاک، VIN یا برند و مدل
↳ویزارد سه‌مرحله‌ای فروشنده
↳قیمت تخمینی پیش و پس از مشخصات خودرو
↳سؤال‌های وام، سند و وضعیت خودرو با پاسخ‌های شاخه‌دار
↳خودکارشناسی هدایت‌شده و بازبینی عکس‌ها
↳صفحه‌های حساب کاربری، سوابق سرویس، راهنما و خطا
09آنچه یاد گرفتم
آموخته‌های این کار
01
پیش از آنکه بیشتر بخواهی، چیزی به کاربر بده
وقتی قیمت تخمینی را وسط فلو گذاشتیم، سؤال‌های بعد از آن معنای دیگری پیدا کردند: قیمتی را دقیق‌تر می‌کردند که فروشنده از قبل گرفته بود.
02
بنچمارک نقطه‌ی شروع است، نه طراحی
نسخه‌ی اول تا حد زیادی از فلو یک سرویس فروش موجود پیروی می‌کرد و فریم‌های بنچمارک هنوز کنار طراحی در فایل هستند. فلو را در صفحه‌های بعدی برای امارات طراحی کردم: با قیمت به درهم، شماره‌ی تلفن با +971 و سؤالی درباره‌ی مشخصات GCC.
03
مدرک خوب از راه دور با آموزش به دست می‌آید
کیفیت عکس‌های فروشنده بیشتر به آموزش قبل از عکاسی بستگی دارد تا به خود صفحه‌ی عکاسی؛ برای همین، آموزش را قبل از باز شدن دوربین گذاشتیم.
مشخصات خودروسند، وام، وضعیت خودرو، گارانتی، سوابق سرویس، چراغ‌های هشدار و محل خودرو.
04
تخمین دوبارهدوباره قیمت، این بار بر اساس مشخصات.
05
خودکارشناسییک آموزش کوتاه، شانزده زاویه‌ی هدایت‌شده و بعد ثبت آسیب و بازبینی.
04
قبل از عکاسی، عکس درست را یاد بده
در هر کارشناسی از راه دور، عکسهایی که فروشنده می‌گیرد ضعیفترین حلقه است. برای همین، قبل از باز شدن دوربین یک آموزش کوتاه، زاویه‌های مشخص و نمونه‌های خوب و بد گذاشتیم تا عکس‌های فروشنده به مدرکی قابل استفاده تبدیل شوند.
کادربندی پیش از دوربین
شکل 04در دو جا، فلو بهجای پرسیدن به فروشنده کمک می‌کند: وام باقیمانده به سه راه برای ادامه تبدیل می‌شود و دوربین فقط وقتی باز می‌شود که فروشنده بداند خودرو را چطور در کادر بگیرد.
محل و اندازه
شکل 06فروشنده آسیب را با زبان خودش ثبت می‌کند، اما در قالبی مشخص: چکلیستی از انواع مشکل با نمونه، و بعد سمت خودرو و بازه‌ی اندازه برای هر کدام.
روی تبلت
شکل 08دو فیلم دیگر از همین صفحه‌ها: روی گوشی، صفحه‌ی اصلی و صفحه‌ی حساب کاربری با یک خودروی ذخیرهشده، و روی تبلت، اسکرول از صفحه‌ی اصلی تا صفحه‌ی تماس.
یک سؤال خودکارشناسی و صفحه‌ی حساب کاربری
شکل 09دو تصویر دیگر از همین مجموعه: صفحه‌ی مشخصات خودرو کنار صفحه‌ی اصلی، و یک سؤال خودکارشناسی کنار صفحه‌ی حساب کاربری.
