ضرر 1000 دلاری با اشتباه 1 پیکسلی در طراحی پروژه

در این داستان برایتان تعریف می‌کنم که چگونه یک مشتری باعث شد که با جابجایی 1 پیکسلی در طراحی یک پروژه، 1000 دلار از دست بدهم. این اتفاق، دوران کاری مرا متحول کرد، و من هرگز نخواستم که این پول را پس بگیرم. این اتفاق همچنین درس‌های زیادی در مورد چگونگی تحولات توسعه وب به من داد و همچنین فهمیدم که می‌توانیم با این تغییرات سازگار شویم.

در آن زمان، من یک آژانس شبکه‌های اجتماعی را اداره می‌کردم. به غیر از اداره کردن اکانت‌های شبکه‌های اجتماعی در یک سیستم پیشرفته داخلی، ما همچنین یک سری کارهای رقابتی انجام می‌دادیم و به توسعه اپلیکیشن‌های بازاریابی کوچک برای مشتریان‌مان می‌پرداختیم.

گاهی اوقات مشتری بدون هیچ ایده‌ای به ما مراجعه می‌کرد. بنابراین مجبور بودیم که اپلیکیشن را از نقطه صفر ایجاد کنیم. ما به ندرت مشتریانی داشتیم که برای توسعه اپلیکیشن خود، طراحی‌های آماده‌ای داشتند.

من معمولاً طراحی اپ را بر اساس بودجه مشتری انجام می‌دادم، و همه از این روش راضی بودند. ما در رقابت پیروز می‌شدیم و مشتریان ما تعداد زیادی فالور جدید برای برند خود به دست می‌آوردند.

آن دوران، آغاز ظهور شبکه‌های اجتماعی بود و در مقایسه با زمان حال، نحوه دسترسی به مشتریانی با فعالیت‌های ارگانیک، بسیار آسان بود.

مشتری جدید، با طراحی پروژه جذاب و پردردسر خود وارد می‌شود!

بنابراین کار من به عنوان یک توسعه دهنده وب بسیار آسان بود. تا زمانی که یک مشتری وارد زندگی من شد. او نمی‌خواست وارد رقابت خاصی شود. او فقط می‌خواست یک صفحه اشتراک خبرنامه در حساب شبکه اجتماعی خود داشته باشد.

نامی از پلتفرم شبکه اجتماعی که او در آن فعالیت داشت نمی‌برم، اما در گذشته، می‌توانستید در صفحه خود در این شبکه اجتماعی، یک صفحه فرعی با HTML ، CSS و JS ایجاد کنید.

برای طراحی این پروژه درخواست یک بودجه معقول کردم. مشتری آن را پذیرفت. وقت کافی داشتم تا سفارش را بدون عجله انجام دهم.

فراموش کردم این نکته را بگویم. او طراحی خودش را برای صفحه خبرنامه داشت. طراحی اولیه او برای پروژه زیبا و چشم نواز بود و از ایده‌های بازاریابی آن زمان کیلومترها جلوتر بود.

این موضوع کار من را آسان‌تر کرد. زیرا فقط باید صفحه را تنظیم می‌کردم و بعد سراغ کارهای دیگرم می‌رفتم. پس از دو روز و در حالی که در بین آن کارهای دیگری هم انجام می‌دادم، صفحه فرود این مشتری را تمام کردم و با رضایت خاطر نتیجه را برایش ارسال کردم.

اما مشتری راضی نبود!

اما مشتری به اندازه من راضی نبود. او به من گفت که صفحه فرود با آن طراحی که به من داده بود، متفاوت است. خب، درست می‌گفت. من از طراحی او فقط الهام گرفته بودم، و همه چیز را کمابیش در جای درست خود قرار داده بودم.

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

این یک قدم طبیعی و مهم در به ثمر رساندن طراحی یک پروژه است. زیرا به مشتری احساس مشارکت و رضایت می‌دهد.

پس از چند روز دیگر، صفحه فرود خبرنامه را تنظیم کردم و آن را برای مشتری ارسال کردم. پس از یک ساعت، این پاسخ را دریافت کردم: «هنوز کج است».

یعنی چی که طراحی پروژه من کج است؟!

این برای من ناامید کننده بود. زیرا اجرای این پروژه *تقریباً* نمایش کاملی از طراحی ارائه شده توسط او بود، و بودجه این پروژه تمام شده بود.

در آن زمان تصمیم گرفتم یک اسکرین‌شات از پیاده‌سازی پروژه تهیه کنم و آن را در برنامه Paint.NET ، روی طراحی مشتری overlay کنم. چیزی که دیدم، این بود که پیاده‌سازی من به طراحی مشتری بسیار شبیه بود، اما عناصر آن در جهات مختلف، تنها چند پیکسل از آن طراحی فاصله داشتند.

تا این مرحله از زندگی‌ام، هرگز به تفاوت‌های چند پیکسلی توجه نکرده بودم. این یک ناامیدی بزرگ بود. اما من واقعاً می‌خواستم وظیفه‌ای که به عهده گرفته بودم را به پایان برسانم. بنابراین من بیشتر روی این پروژه کار کردم. در مجموع، با چند ساعت کار اضافی، 300 دلار دیگر هزینه کردم.

pixel-perfect شد یا نه؟ این یعنی چی؟

این بار رویکرد متفاوتی را انتخاب کردم. من سعی نکردم پیاده سازی خودم را تنظیم کنم. من فقط عناصر را جابجا کردم، به طوری که در Paint.NET ، با طراحی مشتری  100% مطابقت داشته باشند. این اولین پیاده سازی کامل من از نظر پیکسلی بود.

در ذهنم برای انتخاب «مهم نیست» و «بیا امتحانش کنیم»، سخت درگیر بودم. بالاخره توانستم نسخه جدید را برای مشتری ارسال کنم. هنگامی که نتیجه طراحی پروژه من از نظر پیکسلی کامل و عالی (pixel-perfect) بود، مشتری نتیجه را پذیرفت.

من قبل از شروع این پروژه می‌خواستم بلافاصله سراغ پروژه بعدی بروم، اما کنجکاو بودم که چند پیکسل چه فرقی می‌کند؟ من دو برنامه Paint.NET را در کنار هم باز کردم تا اولین پیاده سازی pixel-perfect را انجام دهم.

آن‌چه چشم مهندسی و التقاطی من می‌دید، شگفت‌انگیز بود. طراحی پروژه اولیه‌ام نسبت به اجرای نهایی و pixel-perfect من زشت به نظر می‌رسید! من قبلاً چنین چیزی ندیده بودم و فکر می‌کردم این تفاوت 2-3 پیکسلی بر درک مخاطب تأثیری ندارد. اما من در نقطه مقابل این درک قرار داشتم و یک تابلوی مونالیزای بد خلق کرده بودم.

من در ابتدا می‌خواستم از مشتری خود برای این مزخرفات مربوط به پیکسل هزینه اضافی بگیرم، اما چون چیز بسیار مهمی را از طریق پروژه او یاد گرفتم، فقط نرخ پایه را از او دریافت کردم.

و من تبدیل به یک قهرمان شدم!

در این لحظه، این مشتری من را از یک توسعه دهنده front-end به یک توسعه دهنده design تبدیل کرد. از آن زمان، من با بسیاری از طراحان، مشتریان و توسعه‌دهندگان front-end کار کرده‌ام.

همه انتظار پیاده سازی pixel-perfect را ندارند. این گزینه از نظر مالی همیشه ضروری و عاقلانه نیست. اما گاهی اوقات باید این‌طور باشد. به خصوص زمانی که می‌خواهید جذب مشتری کنید.

طراحی‌های خوب نظر مردم را به خود جلب می‌کنند. طراحی پروژه خوب در همان 1 پیکسلی پنهان می‌شود که به تازگی به CSS sheet خود اضافه کرده‌اید.

برای این‌که بتوانید روی چنین مسائلی تمرکز کنید، باید جنبه‌های فنی نرم افزار خود را مرتب کنید. به طوری که بتوانید تلاش بیشتری برای جنبه‌های بازاریابی ،کسب و کار و تجربه فروشگاه یا اپلیکیشن e-commerce خود انجام دهید.

منبع ترجمه: hackernoon