پرش به محتویات

اول رابط

پیش از شروع برنامه‌نویسی، رابط را طراحی کنید

اپ‌های زیادی با ذهنیت «اول برنامه» شروع می‌شوند. ایده بدی است. برنامه‌نویسی سنگین‌ترین جزء ساختن اپ است؛ یعنی گران‌ترین و سخت‌ترین بخش برای تغییر. به جایش، اول طراحی کنید.

طراحی نسبتاً سبک است. sketch کاغذی ارزان است و تغییرش آسان. طراحی‌های HTML هم هنوز نسبتاً ساده اصلاح یا دور انداخته می‌شوند. درباره برنامه‌نویسی این‌طور نیست. طراحی اول شما را منعطف نگه می‌دارد. برنامه‌نویسی اول شما را در حصار می‌گذارد و آماده هزینه‌های اضافه می‌کند.

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

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

قلم نارنجی‌ای که Blinksale را شروع کرد

به‌محض اینکه فهمیدم از نرم‌افزارهای invoicing آماده کلافه‌ام، تصمیم گرفتم بکشم که ترجیح می‌دهم راه‌حل invoicing من چطور کار کند. یک قلم نارنجی برداشتم، چون آن شب تنها چیزی بود که دم دست بود، و در چند ساعت حدود ۷۵ درصد UI را کشیدم. آن را به همسرم Rachel نشان دادم، که آن موقع اتو می‌کرد، و پرسیدم: «چه فکر می‌کنی؟» او با لبخند جواب داد: «باید این کار را انجام بدهی. واقعاً.»

طی دو هفته بعد، طراحی‌ها را صیقل دادم و صفحه‌های HTML ثابت تقریباً کل نسخه اول چیزی را که بعدها Blinksale شد mockup کردم. هرگز فراتر از آن sketchهای قلم نارنجی wireframe نساختیم، و رفتن مستقیم به طراحی HTML کمک کرد درباره «واقعی» شدن پروژه هیجان‌زده بمانیم، هرچند آن زمان واقعاً نمی‌دانستیم وارد چه چیزی می‌شویم.

وقتی mockupهای HTML کامل شدند، ایده Blinksale را پیش توسعه‌دهنده‌مان Scott بردیم. اینکه بیشتر UI از قبل طراحی شده بود، در چند سطح بسیار مفید بود. اول، به Scott vision واقعی و هیجان درباره مسیرمان داد. چیزی خیلی بیشتر از یک ایده بود؛ واقعی بود. دوم، کمک کرد دقیق‌تر بسنجیم تبدیل طراحی به اپلیکیشن کارکردی چقدر تلاش و زمان Scott را می‌گیرد. وقتی پروژه را از جیب خودتان تامین می‌کنید، هرچه زودتر بتوانید نیازهای بودجه را پیش‌بینی کنید بهتر است. طراحی UI benchmark ما برای دامنه اولیه پروژه شد. در نهایت، طراحی UI مثل راهنما عمل کرد تا در ادامه توسعه یادمان بماند اپلیکیشن درباره چیست. وقتی وسوسه می‌شدیم قابلیت تازه اضافه کنیم، نمی‌توانستیم فقط بگوییم: «حتماً، اضافه‌اش کنیم!» باید به طراحی برمی‌گشتیم و از خودمان می‌پرسیدیم آن قابلیت تازه کجا می‌رود؛ و اگر جایی نداشت، اضافه نمی‌شد.

—Josh Williams، بنیان‌گذار Blinksale


منبع اصلی: Interface First