استفاده از رنگ های سرد برای لودینگ

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

در پایان پیشنهادم اینه : اگه میخواید کاربرا شب و روز دعاتون بکنن بیاید و زمان‌های طولانی مثل زمان لودینگ و انتظار برای هر کاری رو با رنگهای سرد (سمت چپ : آبی و ...) درهم بیامیزید.

تشکر

استفاده از رنگ های سرد برای لودینگ
مهدی منافی
۱ نظر ۰۵ مهر ۹۶ ، ۰۰:۱۱

طراحی رابط کاربری قالب وبسایت Xfer

سلام. این یکی از کارهای متفرقه ام هست که دیری هم نپایید سایتش قبل فعالیت رسمی خوابید. طرح اولیه اش رو احمد زینی عزیز از تیم یو ایکس شیراز زحمت کشید که سختی کار هم همون آماده سازی طرح اولیه ست. مابقی زیاد سخت نیست ;)


طراحی رابط کاربری قالب وبسایت Xfer
مهدی منافی
۰ نظر ۲۱ دی ۹۵ ، ۲۲:۱۳

طراحی رابط کاربری اپلیکیشن موبایل کیمیا

سلام. اوایل امسال شرکت کیمیا اقدام به ساخت و طراحی نسخه مکمل برای گوشی های همراه آیفون و گوشی های اندروید کرد. خوشبختانه طراحی رابط کاربری اپلیکیشن موبایل کیمیا هم مثل نسخه دسکتاپش به بنده سپرده شد و برای دومین بار تونستم در طراحی اپلیکیشن موبایل سهیم باشم.
طراحی اپ موبایل یه حس و حال دیگه ای داره. نمیدونم شاید بخاطر محدود بودن فضای نمایشگر موبایل ها باشه که چالش های مشتی و آبداری جلو پای آدم میذاره. و از طرفی هم تعامل آدما با گوشی های همراه به نسبت کامپیوترها و تبلت ها بهتر و خوش دست تره و اینجا مبحث UX یا تجربه کاربری خیلی شیرین میشه که علاقه فجیعی به UX موبایل دارم.

بریم ادامه مطلب که اصل کاری اونجاست!
طراحی رابط کاربری اپلیکیشن موبایل کیمیا
مهدی منافی
۱ نظر ۱۷ آبان ۹۵ ، ۰۰:۰۵

معرفی کتاب راهنمای روانشناسی بصری در طراحی رابط کاربری


این کتاب، جلد اول یک سه گانه بسیار مفید با موضوع طراحی UI است و به خوبی اثر متقابل بین انسان و ماشین را تعریف‌ و به شما کمک می‌کند تا شناختی عمیق در رابطه با واکنش‌های بینایی نسبت به تصاویر، متن‌ها، دیاگرام‌ها، ماژولها، جداول‌، ویدئوها و همچنین رنگ و مکان آن‌ها پیدا کنید و از سوی دیگر، بتوانید طراحی‌های اثربخشی برای نگه‌داشتن کاربر در فضای وب‌سایت انجام دهید. 
معرفی کتاب راهنمای روانشناسی بصری در طراحی رابط کاربری
مهدی منافی
۳ نظر ۲۴ مهر ۹۵ ، ۲۱:۵۵

انیمیشن باز و بسته شدن تولبار با WPF - کارهای خودم

سلام. 2 روز پیش یه انیمیشن واسه تولبار نرم افزار شرکت کیمیا زده بودم که اولش با نظرات دلسرد کننده مدیر شرکت مواجه شدم :) البته این نظرات از طریق کلیپ کوتاهی که براشون فرستاده بودم شکل گرفته بود (دیدن کی بود مانند کار کردن). بالاخره با دلایلی تونستم مدیریت محترم رو قانع کنم. اکثر انیمیشن هایی که تو بعضی سایتا یا رابط کاربری نرم افزارهای موبایل میبیند، از قوانین فیزیک استفاده کردن و انیمیشنی هم که من روش کار کردم از این قاعده مستثنی نیست.

انیمیشن باز و بسته شدن تولبار با WPF - کارهای خودم
مهدی منافی
۴ نظر ۱۰ دی ۹۴ ، ۲۳:۵۶

مجموعه تصاویر رابط کاربری اپ موبایل

سلام. تو این مجموعه سعی کردم گلچین رابط های کاربری موجود اپ های موبایل رو براتون جمع آوری کنم. از این اپ ها میشه تو نرم افزار های دسکتاپ هم استفاده کرد که من خیلی میگم ولی کسی مشتاق به انجام اینکار نیست. انشاا... نسخه ی 1 نرم افزار حسابداری طلا فروشی کیمیا منتشر که بشه، رابط کاربری فوق العادش رو که به جرات میتونم بگم نظیرش رو فقط تو نرم افزار های شرکتهای بزرگی مثل مایکروسافت و اپل و گوگل میشه پیدا کرد خواهید دید :)
مجموعه تصاویر رابط کاربری اپ موبایل
مهدی منافی
۵ نظر ۱۸ آذر ۹۴ ، ۲۲:۲۷

ویژوال استودیو 2015 (Blend) - راه زیادی مونده تا ایده آل

سلام. 2 روزه ویژوال استودیو 2015 رو به همراه نرم افزار Expression Blend که همون Wpf خودمون توش قرار داره رو با ویندوز 10 رو سیستم نصب کردم. این دو روز کاری با Blend خیلی بهم سخت گذشت. طوری که از شدت عصبانیت دیگه میخواستم کلاً از نرم افزارها و خدمات مایکروسافت خداحافظی کنم و برم به سمت لینوکس و اپل.

خب حالا واسه چی این همه بد میگم از ویژوال 2015 ؟ بریم ادامه مطلب تا بگم

ویژوال استودیو 2015 (Blend) - راه زیادی مونده تا ایده آل
مهدی منافی
۳ نظر ۲۵ مرداد ۹۴ ، ۱۹:۵۲

خدا. بهترین الگو واسه تجربه کاربری و همچنین رابط کاربری؟

خدا. بهترین طراح تجربه کاربری و رابط کاربری که تا حالا میشناسم. شاید بخواین بدونین از کجا معلوم؟ انسان کامل ترین موجود روی زمین. هر طوری فکر کنیم میبینیم که موجودی کامل مثل من و شما تو کره زمین وجود نداره.


از لحاظ تجربه کاربری (UX)

به عنوان مثال بینی بهترین محل قرار گرفتنش همین وسط صورته و اگه سمت راست یا پشت سر باشه بیشتر در معرض خطر قرار میگیره تا جلو. البته واسه بعضیا که زیاد اهل بزن بزن هستن بهترین UX اینه که بینی پشت سرشون باشه تا مشت های حریف به استخوان صورت بخوره :D . یا فکرش رو بکنین اگه چشم رو دست بود چی میشد :)) تو هر دست دادن ممکن بود انگشت طرف مقابل چشمون رو از حدقه دربیاره

از لحاظ رابط کاربری (UI)

رابط کاربری موجوداتی مثل انسان با همدیگه فرق داره. بینی رو مثال میزنم باز. رابط کاربری بینی آدما کلاً با همدیگه متفاوت اندر متفاوته. یکی بینی معمولی داره (این گروه بهینه هستن:)) یکی دیگه مثل من یه بینی کمی بزرگ داره (هر دم و بازدم 1 کیلو اکسیژن مصرف میکنه :)) و خیلیا هم که تازگیا بینیشون رو کلاً اندازه نخود میکنن (در اصل کم مصرفن مثل پراید:)). رابط کاربری رو میشه به همون زیبایی ترجمه کرد.
رابط کاربری باید طوری باشه که تجربه کاربری رو مخفی نکنه و به UX علاوه بر جسم، روح هم ببخشه. رابط کاربری یعنی ساده ترین روش برقراری ارتباط کاربر با پشت صحنه. یعنی کاربر فکر و ذکرش فقط و فقط رو قسمت مورد نظرش باشه و هیچ چیزی تمرکزش رو بهم نزنه.


تک تک مخلوقات خدا پر از ایده های طراحی رابط و تجربه کاربریه که اگه تا به امروز به طراحی های موجود تو نرم افزارها و سایتها کمی دقیق تر نگاه کنیم میبینیم که نمونه خارجی و طبیعی خدادادی دارن همشون. نمونه اش : رابط کاربری متریال گوگل - مدرن ویندوز 8 -اسکیومورفیزم IOS
مهدی منافی
۲ نظر ۲۴ مرداد ۹۴ ، ۲۳:۲۷

طرحی از رابط کاربری اپلیکیشن (نرم افزار) شبکه فیروزه - نمونه کار

سلام. این رابط کاربری جزو اون کارهاییه که در اوقات کم فراغت انجام دادم. اسمش رو هم از خودم در کردم تا یکم جددی به نظر برسه، چون رنگش فیروزه ای بود اسمش هم فیروزه گذاردم تا بهش بیاد. تازگیا هم جذب سبک طراحی متریال کودکانه شدم و اینم خیلی نزدیک به این سبکه :)

3 تا صفحه داره که می تونید تو ادامه به نظاره بنشینید

طرحی از رابط کاربری اپلیکیشن (نرم افزار) شبکه فیروزه  - نمونه کار
مهدی منافی
۳ نظر ۲۳ خرداد ۹۴ ، ۲۳:۵۰

کدی که باهاش میشه تصویر نمایه کاربر رو تو WPF گرد کرد - نمونه پروژه

سلام. اول عذر می خوام بخاطر دیر جواب دادن و حتی جواب ندادن به بعضی پیام هایی که از وبلاگ برام میفرستین (واقعاً سرم شلوغه). امروز می خوام درخواست یکی از دوستان در مورد "نحوه گرد کردن حاشیه تصاویر تو WPF" رو با یه مثال پروژه ای پاسخ بدم. تو سبک های جدید طراحی نرم افزار های گوشی همراه، بیشتر مد شده که تصاویر نمایه کاربر رو گرد می کنن که هم به زیبایی رابط کاربری نرم افزار کمک می کنه و هم فضای بهینه ای برای استفاده بیشتر  توسعه دهنده ها از دیگر امکانات درست می کنه.

ادامه مطلب میتونین نمونه پروژه رو دریافت کنین :)

کدی که باهاش میشه تصویر نمایه کاربر رو تو WPF گرد کرد - نمونه پروژه
مهدی منافی
۵ نظر ۰۸ خرداد ۹۴ ، ۰۹:۴۰