هزینه طراحی UI/UX به چهار عامل اصلی بستگی دارد: تعداد صفحه‌ها و جریان‌های کاربری، پیچیدگی منطق محصول، عمق تحقیق و تست با کاربر، و این‌که خروجی فقط چند صفحه‌ی ثابت باشد یا یک دیزاین سیستم کامل و پروتوتایپ قابل تست. برای همین هیچ عدد ثابتی برای همه‌ی پروژه‌ها وجود ندارد؛ قیمت منصفانه زمانی به دست می‌آید که محدوده‌ی کار (Scope) روشن باشد و مدل قیمت‌گذاری با شرایط پروژه جور دربیاید.
در این راهنما، بر اساس تجربه‌ای که ما در دییر از سال ۱۳۹۱ در طراحی محصول برای برندهایی مثل کافه بازار، علی‌بابا و دیجی‌کالا به دست آورده‌ایم، توضیح می‌دهیم چه چیزهایی قیمت طراحی رابط کاربری اپلیکیشن یا سایت را بالا و پایین می‌برد، مدل‌های رایج قیمت‌گذاری چه تفاوتی دارند، در هر سطح از پروژه دقیقاً چه چیزی تحویل می‌گیرید و چطور می‌توانید بدون آسیب زدن به کیفیت، هزینه را مدیریت کنید. اگر هنوز با خود مفاهیم UI و UX آشنا نیستید، پیشنهاد می‌کنیم اول راهنمای جامع طراحی UI/UX را بخوانید.
هزینه طراحی UI/UX به چه عواملی بستگی دارد؟
وقتی دو پیشنهاد قیمت برای یک پروژه‌ی به‌ظاهر یکسان فاصله‌ی زیادی دارند، دلیلش معمولاً این است که دو تیم دو کار متفاوت را قیمت داده‌اند. شناختن عوامل زیر کمک می‌کند پیشنهادها را درست مقایسه کنید.
۱. تعداد صفحه‌ها، حالت‌ها و جریان‌های کاربری
شمردن صفحه‌ها ساده‌ترین معیار است، اما معیار کاملی نیست. هر صفحه حالت‌های مختلفی دارد: حالت خالی، بارگذاری، خطا، موفقیت، کاربر مهمان و کاربر واردشده. یک فرم ثبت‌نام ساده ممکن است روی کاغذ یک صفحه باشد ولی در عمل شش یا هفت حالت طراحی لازم داشته باشد. به همین دلیل طراح‌های باتجربه به جای «تعداد صفحه» بیشتر به تعداد جریان‌های کاربر فکر می‌کنند؛ یعنی مسیرهایی مثل ثبت‌نام، جست‌وجو، خرید یا پرداخت که کاربر از ابتدا تا انتها طی می‌کند.
۲. پیچیدگی منطق و نوع محصول
طراحی یک سایت معرفی شرکت با پنل مدیریت یک پلتفرم مالی یا یک مارکت‌پلیس دوطرفه قابل مقایسه نیست. هرچه نقش‌های کاربری بیشتر باشند (مثلاً خریدار، فروشنده، پشتیبان و مدیر)، داده‌ها پیچیده‌تر باشند و قوانین کسب‌وکار ظریف‌تر، زمان بیشتری صرف فهم مسئله و طراحی تعامل می‌شود. داشبوردها، فرم‌های چندمرحله‌ای و جریان‌های پرداخت معمولاً پرهزینه‌ترین بخش‌ها هستند.
۳. پلتفرم‌ها: وب، اندروید، iOS
هزینه طراحی اپ موبایل وقتی هم برای iOS و هم برای اندروید طراحی می‌شود، دو برابر نمی‌شود، ولی صفر هم اضافه نمی‌شود. الگوهای ناوبری، کامپوننت‌های بومی و راهنماهای هر پلتفرم تفاوت‌هایی دارند که باید رعایت شوند.
۴. عمق تحقیق و تست با کاربر
پروژه‌ای که با مصاحبه با کاربران، تحلیل رقبا و تحقیقات کاربر شروع می‌شود، در کوتاه‌مدت گران‌تر است اما احتمال این‌که محصول نهایی چیزی باشد که کاربران واقعاً می‌خواهند بسیار بیشتر است. تست کاربردپذیری روی پروتوتایپ هم هزینه‌ی جداگانه‌ای دارد که معمولاً بارها از هزینه‌ی اصلاح بعد از برنامه‌نویسی کمتر است.
۵. دیزاین سیستم و مقیاس‌پذیری
اگر قرار است محصول سال‌ها رشد کند و چند تیم روی آن کار کنند، ساختن دیزاین سیستم با توکن‌ها، کامپوننت‌ها و مستندات بخشی از سرمایه‌گذاری است. این کار در شروع زمان می‌برد ولی هزینه‌ی طراحی و توسعه‌ی هر صفحه‌ی جدید در آینده را به‌شکل محسوسی پایین می‌آورد.
۶. تجربه‌ی تیم و زمان‌بندی
تیمی که پیش‌تر محصولات مشابه طراحی کرده، اشتباهات رایج را از قبل می‌شناسد و سریع‌تر به راه‌حل درست می‌رسد. از طرف دیگر، ددلاین‌های فشرده معمولاً یعنی اضافه کردن نیرو یا کار موازی، که هزینه را بالا می‌برد.
مدل‌های قیمت‌گذاری طراحی رابط کاربری کدام‌اند؟
سه مدل رایج برای قرارداد طراحی UI/UX وجود دارد. هیچ‌کدام ذاتاً بهتر نیست؛ انتخاب درست به میزان شفافیت محدوده‌ی کار و افق همکاری بستگی دارد.
قیمت ثابت یا پروژه‌ای (Fixed Price)
در این مدل محدوده‌ی کار، خروجی‌ها و زمان‌بندی از ابتدا مشخص می‌شود و یک مبلغ کلی توافق می‌شود. برای پروژه‌هایی که نیازمندی‌هایشان روشن است، مثل بازطراحی یک سایت با ساختار مشخص، مناسب است. ریسک اصلی‌اش این است که هر تغییری بیرون از محدوده‌ی اولیه به درخواست تغییر و هزینه‌ی اضافه تبدیل می‌شود، و تیم طراحی برای پوشش ریسک معمولاً حاشیه‌ای در قیمت در نظر می‌گیرد.
ساعتی یا زمان و منابع (Time & Material)
در این مدل بر اساس ساعت یا روز کاری واقعی پرداخت می‌کنید. وقتی محصول در مرحله‌ی کشف است و نمی‌دانید دقیقاً به چه چیزی می‌رسید، این مدل انعطاف بیشتری می‌دهد. شرط موفقیتش گزارش‌دهی شفاف، جلسه‌های منظم مرور و سقف بودجه‌ی توافق‌شده برای هر فاز است.
قرارداد ماهانه یا تیم اختصاصی (Retainer / Dedicated Team)
برای محصولاتی که به‌طور مداوم توسعه پیدا می‌کنند، یک یا چند طراح به‌صورت ماهانه در اختیار شما قرار می‌گیرند و کنار تیم محصول و برنامه‌نویسی کار می‌کنند. هزینه‌ی ماهانه قابل پیش‌بینی است و دانش محصول در تیم باقی می‌ماند. این مدل برای استارتاپ‌ها و شرکت‌هایی که هنوز تیم طراحی داخلی ندارند، اغلب اقتصادی‌تر از استخدام کامل است.
| مدل | مناسب برای | مزیت اصلی | نکته‌ی احتیاط |
|---|---|---|---|
| پروژه‌ای | نیازمندی روشن و محدوده‌ی ثابت | بودجه از قبل مشخص است | تغییرات بعدی هزینه‌ی جدا دارد |
| ساعتی | مرحله‌ی کشف و محصول در حال تغییر | انعطاف بالا | بدون سقف و گزارش، بودجه قابل کنترل نیست |
| تیم ماهانه | محصول در حال رشد و همکاری بلندمدت | پیوستگی و انباشت دانش محصول | نیاز به نقشه‌ی راه و اولویت‌بندی منظم |
در هر سطح از پروژه چه چیزی تحویل می‌گیرید؟
یکی از دلایل اصلی تفاوت هزینه طراحی UI/UX بین تیم‌ها این است که «طراحی UI/UX» برای افراد مختلف معنای متفاوتی دارد. برای بعضی فقط چند صفحه‌ی زیبا در فیگما است و برای بعضی کل مسیر از تحقیق تا تحویل به برنامه‌نویس. جدول زیر سه سطح رایج را مقایسه می‌کند. زمان‌ها تقریبی‌اند و برای یک محصول با اندازه‌ی متوسط در نظر گرفته شده‌اند.
| خروجی | سطح پایه | سطح استاندارد | سطح جامع |
|---|---|---|---|
| تحقیق و تحلیل رقبا | مرور سریع | مصاحبه‌ی محدود و تحلیل رقبا | تحقیق کامل کاربر و پرسونا |
| معماری اطلاعات و جریان کاربر | برای جریان‌های اصلی | برای همه‌ی جریان‌ها | همه‌ی جریان‌ها و حالت‌های استثنا |
| وایرفریم | محدود | کامل | کامل همراه با تست |
| طراحی UI | صفحه‌های کلیدی | همه‌ی صفحه‌ها و حالت‌ها | همه‌ی صفحه‌ها، پلتفرم‌ها و حالت‌ها |
| دیزاین سیستم | استایل‌گاید ساده | کتابخانه‌ی کامپوننت | دیزاین سیستم مستند با توکن |
| پروتوتایپ و تست | ندارد | پروتوتایپ کلیک‌پذیر | پروتوتایپ و تست کاربردپذیری |
| زمان تقریبی | ۲ تا ۴ هفته | ۴ تا ۸ هفته | ۸ هفته به بالا |
سطح پایه برای اعتبارسنجی یک ایده یا ارائه به سرمایه‌گذار کافی است، اما اگر قرار است محصول برنامه‌نویسی و به کاربر واقعی عرضه شود، معمولاً حداقل سطح استاندارد لازم است. چیزی که در سطح پایه حذف می‌شود، دیر یا زود در مرحله‌ی توسعه به شکل سؤال‌های بی‌جواب برنامه‌نویس‌ها و دوباره‌کاری برمی‌گردد.
مراحل طراحی UI/UX و سهم هرکدام از هزینه
برای این‌که بفهمید پول‌تان صرف چه می‌شود، بهتر است مراحل استاندارد طراحی را بشناسید. سهم هر مرحله از کل هزینه طراحی رابط کاربری بسته به پروژه فرق می‌کند، ولی ترتیب منطقی آن‌ها تقریباً همیشه ثابت است.
- تحقیق و کشف: شناخت کاربر، کسب‌وکار و رقبا. این مرحله کم‌حجم‌ترین خروجی بصری را دارد اما بیشترین اثر را روی تصمیم‌های بعدی می‌گذارد.
- معماری اطلاعات و وایرفریم: چیدمان محتوا و جریان‌ها بدون درگیر شدن با رنگ و جزئیات. تغییر در این مرحله ارزان است.
- طراحی رابط کاربری: رنگ، تایپوگرافی، آیکون‌ها، تصاویر و همه‌ی حالت‌های هر صفحه. معمولاً بزرگ‌ترین سهم زمانی را دارد.
- دیزاین سیستم: تبدیل اجزای تکراری به کامپوننت‌های قابل استفاده‌ی مجدد تا طراحی و توسعه یکدست بماند.
- پروتوتایپ و تست: ساخت نسخه‌ی تعاملی و آزمودن آن با کاربران واقعی پیش از نوشتن حتی یک خط کد.
- تحویل (Handoff): آماده‌سازی فایل‌ها، مشخصات فنی، خروجی آیکون‌ها و همراهی تیم توسعه در زمان پیاده‌سازی.
حذف کردن یک مرحله هزینه را حذف نمی‌کند؛ فقط آن را به مرحله‌ی بعد منتقل می‌کند که معمولاً گران‌تر است. مثلاً اگر وایرفریم حذف شود، بحث‌های ساختاری در مرحله‌ی طراحی UI رخ می‌دهد و هر تغییر یعنی بازطراحی چندین صفحه‌ی کامل.
هزینه طراحی UI/UX سایت با اپلیکیشن چه تفاوتی دارد؟
هزینه طراحی ui ux سایت و اپ موبایل از یک منطق پیروی می‌کنند، اما چند تفاوت مهم دارند که روی برآورد اثر می‌گذارد:
- سایت‌های محتوایی و شرکتی معمولاً صفحه‌های بیشتر ولی تعامل ساده‌تری دارند؛ بخش بزرگی از کار، طراحی قالب‌های تکرارشونده و واکنش‌گرایی است.
- اپلیکیشن‌ها معمولاً صفحه‌های کمتر ولی تعامل عمیق‌تری دارند: ژست‌ها، ناوبری، اعلان‌ها، حالت آفلاین و ریزتعامل‌ها زمان بیشتری می‌برند.
- وب‌اپلیکیشن‌ها و داشبوردها به جدول‌ها، فیلترها، نقش‌های کاربری و حالت‌های داده‌ای متنوع نیاز دارند و از نظر پیچیدگی به اپلیکیشن نزدیک‌ترند تا سایت.
- اگر محصول هم وب و هم اپ دارد، طراحی یکپارچه با یک دیزاین سیستم مشترک در مجموع ارزان‌تر از دو پروژه‌ی جدا تمام می‌شود.
سفارش طراحی UI/UX: گام‌به‌گام از تماس اول تا تحویل
بخش زیادی از هزینه‌های پنهان پروژه‌های طراحی به‌خاطر شروع نامنظم است. اگر قصد سفارش طراحی ui ux دارید، این مسیر را پیشنهاد می‌کنیم:
گام ۱: هدف کسب‌وکاری را مشخص کنید
قبل از صحبت درباره‌ی صفحه‌ها، بگویید این طراحی قرار است چه چیزی را تغییر دهد: افزایش نرخ تبدیل، کاهش تماس‌های پشتیبانی، عرضه‌ی نسخه‌ی اول محصول یا آماده شدن برای جذب سرمایه. هدف روشن به تیم طراحی کمک می‌کند تلاش را جای درست خرج کند.
گام ۲: بریف بنویسید
یک بریف خوب نیمی از کار برآورد را انجام می‌دهد. در بخش بعد توضیح داده‌ایم چه چیزهایی باید در آن باشد.
گام ۳: جلسه‌ی کشف و دریافت پیشنهاد
در جلسه‌ی اول تیم طراحی سؤال‌هایی درباره‌ی کاربران، رقبا، محدودیت‌های فنی و زمان‌بندی می‌پرسد. برآوردی که بدون این گفت‌وگو داده شود، معمولاً بعدها تغییر می‌کند.
گام ۴: توافق روی محدوده، خروجی‌ها و تعداد بازبینی
در قرارداد باید روشن باشد چه چیزی تحویل داده می‌شود، چند دور بازبینی در قیمت لحاظ شده، مالکیت فایل‌ها با کیست و تغییرات خارج از محدوده چطور قیمت‌گذاری می‌شوند.
گام ۵: اجرای مرحله‌به‌مرحله و تأیید هر فاز
پرداخت و تأیید را به مراحل گره بزنید. این کار هم برای شما ریسک را کم می‌کند و هم تیم طراحی را مطمئن می‌کند که پیش از رفتن به مرحله‌ی بعد، پایه درست است.
گام ۶: تحویل و همراهی در توسعه
طراحی با تحویل فایل تمام نمی‌شود. بهترین نتیجه وقتی به دست می‌آید که طراح در زمان پیاده‌سازی در دسترس باشد و خروجی کدنویسی‌شده را با طرح مقایسه کند. اگر توسعه هم در همان تیم انجام شود، این هماهنگی ساده‌تر است؛ ما در دییر به همین دلیل طراحی و توسعه وبسایت و اپلیکیشن را کنار هم ارائه می‌کنیم.
بریف طراحی UI/UX را چطور بنویسیم تا برآورد دقیق‌تر شود؟
هرچه بریف دقیق‌تر باشد، فاصله‌ی بین برآورد اولیه و هزینه‌ی نهایی کمتر می‌شود. لازم نیست سند طولانی بنویسید؛ پاسخ روشن به این موارد کافی است:
- معرفی کسب‌وکار و محصول در چند خط، و مسئله‌ای که حل می‌کند.
- کاربران هدف: چه کسانی هستند، در چه موقعیتی از محصول استفاده می‌کنند و چه انتظاری دارند.
- دامنه‌ی کار: طراحی از صفر، بازطراحی یا بهبود بخشی مشخص؛ و پلتفرم‌ها (وب، اندروید، iOS).
- فهرست جریان‌ها یا قابلیت‌های اصلی؛ اگر سند نیازمندی‌های محصول (PRD) دارید، پیوست کنید.
- دارایی‌های موجود: هویت بصری، لوگو، طراحی قبلی، داده‌های تحلیلی و بازخورد کاربران.
- محدودیت‌ها: زمان عرضه، فناوری انتخاب‌شده، و بازه‌ی بودجه‌ای که در نظر دارید.
- نمونه‌هایی که دوست دارید یا دوست ندارید، همراه با دلیل.
گفتن بازه‌ی بودجه شاید عجیب به نظر برسد، اما به تیم طراحی کمک می‌کند به جای یک پیشنهاد کلی، بهترین ترکیب خروجی‌ها را در همان بودجه پیشنهاد کند.
نشانه‌های هشدار در پیشنهادهای خیلی ارزان
هزینه طراحی UI/UX پایین به‌خودی‌خود مشکل نیست؛ ممکن است تیمی کوچک‌تر یا محدوده‌ای ساده‌تر را قیمت داده باشد. اما اگر پیشنهادی به‌طرز محسوسی از بقیه ارزان‌تر است، این نشانه‌ها را بررسی کنید:
- هیچ سؤالی درباره‌ی کاربران و اهداف کسب‌وکار پرسیده نشده و قیمت فقط بر اساس تعداد صفحه داده شده است.
- مرحله‌ی تحقیق، وایرفریم یا تحویل به برنامه‌نویس اصلاً در پیشنهاد نیامده است.
- نمونه‌کارها فقط تصاویر نهایی زیبا هستند و هیچ توضیحی درباره‌ی مسئله، فرایند و نتیجه ندارند.
- حالت‌های خطا، خالی و بارگذاری و نسخه‌های واکنش‌گرا در محدوده‌ی کار دیده نشده‌اند.
- مالکیت فایل‌های منبع یا تعداد دورهای بازبینی مبهم است.
- استفاده از قالب‌های آماده به اسم طراحی اختصاصی ارائه می‌شود.
ارزان‌ترین طراحی، طراحی‌ای است که مجبور نباشید بعد از برنامه‌نویسی دوباره انجامش دهید.
برای ارزیابی تیم‌ها، به جای تصاویر نهایی سراغ مطالعه‌ی موردی بروید. در نمونه‌کارهای دییر تلاش کرده‌ایم مسئله و فرایند را هم کنار خروجی نشان دهیم. نکات بیشتر درباره‌ی انتخاب تیم را در مقاله‌ی آژانس طراحی چیست نوشته‌ایم.
چطور هزینه طراحی UI/UX را بدون افت کیفیت کم کنیم؟
کم کردن هزینه طراحی UI/UX به معنای حذف مراحل نیست؛ به معنای خرج کردن هوشمندانه‌تر است. این راهکارها در پروژه‌های واقعی جواب داده‌اند:
- با MVP شروع کنید: به جای طراحی همه‌ی قابلیت‌ها، روی جریان‌های اصلی‌ای تمرکز کنید که ارزش محصول را ثابت می‌کنند.
- از کیت‌ها و سیستم‌های آماده‌ی معتبر به‌عنوان پایه استفاده کنید و فقط بخش‌هایی را سفارشی کنید که هویت برند یا تجربه‌ی متمایز به آن‌ها وابسته است.
- تحقیق را حذف نکنید، کوچکش کنید: حتی پنج مصاحبه‌ی هدفمند یا یک دور تست سریع روی پروتوتایپ، بسیاری از اشتباهات پرهزینه را پیش از توسعه آشکار می‌کند.
- محتوای واقعی را زود آماده کنید تا طراحی با متن و تصویر واقعی انجام شود و بعداً به‌خاطر جا نشدن محتوا تغییر نکند.
- یک تصمیم‌گیرنده‌ی مشخص داشته باشید؛ بازخوردهای متناقض از چند نفر، بیشترین عامل دوره‌های بازبینی اضافه است.
- طراحی را فازبندی کنید و فاز بعد را بر اساس داده‌ی واقعی از فاز قبل تعریف کنید.
سؤالات متداول
هزینه طراحی UI/UX یک اپلیکیشن معمولاً چقدر زمان می‌برد؟
برای یک اپلیکیشن با اندازه‌ی متوسط، طراحی در سطح استاندارد معمولاً بین ۴ تا ۸ هفته طول می‌کشد. محصولات بزرگ‌تر با چند نقش کاربری یا چند پلتفرم ممکن است چند ماه زمان ببرند یا به همکاری پیوسته نیاز داشته باشند.
آیا می‌شود فقط UI را سفارش داد و UX را کنار گذاشت؟
از نظر فنی بله، اما در عمل UI بدون تصمیم‌های UX یعنی طراح باید روی ساختاری که آزموده نشده رنگ و شکل بگذارد. اگر بودجه محدود است، بهتر است دامنه‌ی محصول را کوچک کنید تا این‌که UX را حذف کنید.
چرا قیمت طراحی رابط کاربری اپلیکیشن در آژانس‌ها با فریلنسرها فرق دارد؟
آژانس معمولاً تیمی از پژوهشگر، طراح UI، طراح تعامل و مدیر پروژه را در اختیارتان می‌گذارد و پاسخ‌گوی کل فرایند است. فریلنسر برای کارهای مشخص و محدود می‌تواند انتخاب مناسبی باشد، اما مدیریت و یکپارچه‌سازی کار با خود شماست.
آیا تست کاربردپذیری ارزش هزینه‌ی اضافه را دارد؟
در بیشتر پروژه‌ها بله؛ چون اصلاح یک مشکل در پروتوتایپ بسیار ارزان‌تر از اصلاح آن پس از برنامه‌نویسی است. جزئیات روش‌ها را در راهنمای تست کاربردپذیری توضیح داده‌ایم.
فایل‌های طراحی بعد از پایان پروژه متعلق به کیست؟
این موضوع باید در قرارداد مشخص شود. در پروژه‌های سفارشی معمول این است که پس از تسویه، فایل‌های منبع و حقوق استفاده از طراحی به کارفرما منتقل شود.
اگر در حال برنامه‌ریزی برای طراحی یا بازطراحی محصول دیجیتال خود هستید، خوشحال می‌شویم درباره‌ی محدوده‌ی کار و بهترین مدل همکاری با هم صحبت کنیم. بریف‌تان را از طریق صفحه‌ی درخواست همکاری بفرستید یا با خدمات طراحی محصول و UI/UX دییر بیشتر آشنا شوید.
