خيلي شيك و قشنگ بود ، من كه لذت بردم
آقای Juza66 طراحی های شما خوب و استاندارد هستند.
البته فرم اصلی یکمی نا هماهنگی با بفیه فرم ها داره!
اما در کل خوب هستند
موضوع UXD رو هم رعایت کردید
برای عددها چه فونتی استفاده کردی؟ خیلی خوبه...
سلام دوستان
به نظر شما بهترین desing یا ظاهر کاربری برای نرم افزارها در سی شارپ باید چطور باشه ؟ آیا اصولی هست برای این کار؟
این که منوها کجا باشند، از چه کامپوننت هایی استفاده کنیم بهتره ، صفحه اصلی باید چطور باشد ؟!
کلاً در رابطه با طراحی ظاهر نرم افزار هرکس هر چی میدونه بگه
ممنون
دوستان من devcomponent رو زیرو رو کردم ولی این TabControl که این دوست عزیز استفاده کردن رو نتونستم پیدا کنم. میشه یکی کمک کنه؟
2.jpg
خیلی خوشگله - البته ایشان با عکس قشنگ ترش کرده
تویی تنظیمات همین ایتم اگر نگاه کنید نوشته که:
TabStyle روی Office2010BackstageBlue گذاشتم، و براش یک آیکن از لیست تنظمات تب انتخاب کردم
دوستان این عکس کلی مطلب داره : (درباره UI & UX)
یه مطلب دیگه هم خوندم :
"رابط کاربری + تجربه کاربر = برند شما"
آخرین ویرایش به وسیله ghasem110deh : دوشنبه 30 شهریور 1394 در 22:53 عصر دلیل: اصلاح متن
هر دو مهم هستند و هم رو کامل میکنن
8-tips-for-successful-ui-ux.jpg
لینک مفید برای مطالعه: http://www.elinext.com/8-tips-for-successful-ui-and-ux
سلام به همه ...
دوستان توی فرم اصلی بهتره به کاربر اجازه بدیم هر چند تا فرم که دلش خواست باز کنه یا فقط یه فرم (showDialog) !؟
با توجه به اینکه توی فرمهای فرعی (هنگام کار باشون) نیازی به اطلاعات فرم های دیگه نیست و اگه هم باشه از تو خود فرم دسترسی دادم ...
.
.
.
اگه فقط یه فرم باز بشه کاربر احساس محدودیت نمیکنه ؟
و وقتی هم که اجازه باز شدن هر فرمی رو میدم (Show) خیلی قاتی پاتی میشه ! در صورتی که نیازی به اینکار نمی بینم و هر قسمت با فرمهاش برای کاربر مرحله بندی (step by step) شده ...
آخرین ویرایش به وسیله ghasem110deh : یک شنبه 05 مهر 1394 در 10:44 صبح دلیل: اصلاح متن ...
با سلام خدمت اساتید
من تو این فرم اصلی که برنامه حسابداری و فروش یک فروشگاه کاشی و سرامیک هستش با توجه به گسترش برنامه نیاز به تغییر این فرم دارم
با توجه به اینکه عکس مربوطه نباید حذف شود میخواستم پیشنهادهای دوستان رو در مورد استفاده از منو یا هر ابزار دیگه بدونم.
ممنون از مهندسین محترم
سلام مهندس
مواقعی پیش میاد که دستکاری و ویرایش اطلاعات باید بصورت مستقیم، یکباره، یکتا و بصورت واحد انجام بشن تا باعث چندباره شدن کار نشه
مثلاً موقعی که نام کاربری و رمز عبور رو تغییر میدید و یا مشخصات یک مشتری رو ویرایش میکنید، سندی رو چاپ میکنید و یا تنظیمات برنامه رو تغییر میدید باید پنجره بصورت ShowDialog باشه تا حین انجام تغییرات مشکلی پیش نیاد و اون پنجره بصورت خاص و تکی نشون داده بشه؛
شما نمیتونید همزمان مشخصات یک مشتری رو در دو فرم نمایش بدید و هرکدوم رو یک جور متفاوت ویرایش کنید!
اما مثلاً نمایش فاکتورها و بطور کلی پنجرههای نمایش اطلاعات و آمار برای مقایسه بصورت عادی استفاده میشن و ضرری به یکتا و پاک بودن اطلاعات نمیزنن
سلام
همونطور که دوستان گفتن، با توجه به شرایط باید طراحی کنید...
من معمولا فرم ها رو طوری نمیزارم که روی هم رو بپوشونن! معمولا وقتی چند تا فرم لازم دارم اونها رو در تب نشون میدم و برای برخی فرم های خاص هم بصورت دیالوگ باز میکنم و کاربر رو مجبور میکنم فقط در اون فرم باشه. اصلا برای همینه که این همه تنوع وجود داره که بشه برای هر کار خاصی تصمیم درست گرفت...
در اکثر برنامه ها نباید کاربر را مجبور به استفاده از یک فرم کرد
ولی شما باید کاری کنید که کاربر یک فرم را بیشتر از یک بار نتونه باز کنه یعنی اگر باز بود دوباره باز نشه بلکه فعال بشه
پیشنهاد می کنم به WPF رو بیارید.
در عجبم که به غیر از یکی دو تا طرح که دیدم بقیه از UX پیروی نکرده اند حتی این چند نمونه که پیروی کرده بودند طرحشون خیلی تعریفی نداشت.
جان هرکسی که دوست دارید از این طراحی های زمان ویندوز 98 خارج بشید هر برنامه ای که پیچیدگی خاص خودش رو داره بدون رابط کاربری درست حسابی ارزش رقابت در بازار کار رو نداره.
من یک طرحی رو میزارم اینجا که از دیشب طی 1 ساعت طراحیش کردم هرکس میبینه میگه طراحی نرم افزار وب هست نه دسکتاپ !
001.jpg011.jpg
نظر شما چیه این طرح طرح دسکتاپه یا وب ؟
میتونید حدس بزنید در چه محیطی و تحت چه زبانی طراحی شده ؟
مشکل برنامه نویسان ایرانی در اینه که بیبشتر از کیفیت محصولشون به پول فکر میکنند ، باور کنید تا زمانی که در ذهن کاربر یک خلاقیت جدید و یک حس جدید ایجاد نکنید پول در آوردن از دسترنجتون هم سخت خواهد بود چرا که با در نظر گرفتن مواردی مثل UI که نظر کاربر رو جلب میکنه میشه مشتری رو راضی نگه داشت و این امر باعث میشه از محصولات شما بیشتر استقبال بشه.
در مورد اشتباهات در طراحی که رواج پیدا کرده یک مثال ساده ای رو میزنم که حتما همه دوستان باهاش آشنایی دارند : یادم هست وقتی منوی Office 2007 وارد کار شد همه ازش استقبال کردند و هرچقدر دلتون بخواد نرم افزار هایی که دارای همچین منویی هستند روانه بازار شدند ولی آیا مایکروسافت همین منو رو در نسخه های بعدی محصولاتش تغییر نداد ؟ خب مسلما باید تغییر میداد دلیل داره چون باید حس جدیدی رو برای کاربر انتقال بده چیزی که اصلا ما بهش توجه نمیکنیم هرجا یه نرم افزار سفارش میدن سریع یه کامپوننت منو آفیسی میزنیم با به به چه چه هم تعریفش میکنیم خب که چی ؟ کاربر چه حسی جدیدی رو تجربه کرد ؟! جالب اینجاست به جای طراحی و نو آوری جدید در طراحی بیشتر توسعه دهندگان و طراحان روش های تکراری رو ترجیح میدن که درست نیست ، مثلا محصول نفر Y با محصول نفر X یکی شد هم از لحاظ طراحی و هم کارآیی اونوقت مسلما تنها چیزی که باعث میشه رقابت ایجاد بشه قیمت هست و این قیمتی که بالا پایین میشه بازار کار خراب و حال و حوصله صاحب محصول رو از بین خواهد برد و این کار باعث میشه با اینکه هزاران نرم افزار روانه بازار شده تنوع قابل توجهی رو مشاهده نکنیم.
به نظرم با در نظر گرفتن محیط های ساده و در عین حال جذاب و پیچیده میشه محصول بهتری رو خلق کرد که در این میان کاربر یا مشتری با رابط کاربری سرو کار داره نه با هسته نرم افزار ، چرا که شما اگه هسته رو فوق العاده نوشته باشید ولی ظاهری نه چندان قابل تعریف طراحی کنید ارزش هسته مشخص نمیشه و برعکس ! پس بهتره همانطور که به امکانات و هسته نرم افزار اهمیت میدیم به ظاهرش بیشتر اهمیت بدیم چرا که کاربر به هیچ عنوان کد های نوشته شده رو نمیبینه و اصلا دانش کافی رو هم نداره که بفهمه نرم افزار چطوری و با چه متدی داره یک سری عملیات رو انجام میده و برای مشخص کردن کیفیت هسته نرم افزار میتونیم با طراحی خوب اون حس خوب و ریزه کاری هایی که در هسته برنامه گنجانده میشه رو به کاربر منتقل کنیم.
باور کنید برنامه هایی میشناسم که فقط به خاطر آیکونش دانلود میشه ! یا برنامه هایی هستند در این Store ها که طرف Shot ها رو میبینه و تمایل پیدا میکنه حداقل دانلود و تجربش کنه در رابطه با بحث تجربه کاربری حتما مطالعه کنید که یکی از نیازهای اصلیه یک محصول هستش.
آخرین ویرایش به وسیله کامبیز اسدزاده : یک شنبه 12 مهر 1394 در 13:24 عصر
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C
به نظر من Desktop
معمولا چنین طرح های در وب توسط CSS3 در قالب HTML5 و جلوه های نمایشی و انیمیتش تحت JS پیاده سازی میشه و در دسکتاپ پیاده سازی این موارد سخته ولی...بر خلاف تصور خیلی ها این امر در دسکتاپ خیلی بهتر و جالبتر پیاده سازی میشه.
برای مثال فرض کنیم چندین فرم داریم و برای دسترسی سریع به همه فرم ها ترجیح میدیم از Tab ها استفاده کنیم که این موارد هم یک سری مشکلاتی رو دارند مثلا در یک لحظه همه فیلد های موجود در زبانه ها در دسترس قرار گرفته و یکجورایی دلو روده محتوای زبانه ها بیرونه که من به شخصه با این موضوع کنار نیومدم و به ذهنم یک ایده جالبی رسید که قبل اینکه کاربر مستقیما وارد فرم و پر کردن اونها باشه یک لایه محو مانندی رو ایجاد کنیم مانند راهنما های پیش از استفاده در اندروید و دیگر برنامه ها که دیده ایم و در عین حال دسترسی و انتخاب دیگر زبانه ها نیز فعال باشد و تا زمانی که قصد ورود به محتوای هر زبانه رو نداریم اتفاقی رخ ندهد که میتونه در این قسمت یک علامتی ، توضیحی چیزی بده به صورت زیر :
012.jpg
به این تصویر دقت کنید ، البته چون عکس هستش جلوه نمایشیش مشخص نیست ، من اومدم روی فرم یک همچین طرحی رو به صورت Flat و با Opacity 0.8 مقدار دهی کردم و بهش یک حالت انیمیشن هم دادم که به صورت چشمک زن شیء مربوط به تصویر دست در حالت کلیک در اومده در این حالت قبل از پر کردن فرمی که در داخل زبانه ها ایجاد شده راهنمایی مورد نظر داده میشه یعنی در این قسمت کاربر باید فرمی رو پر کنه و چون تعداد زیادی از زبانه استفاده کردیم بهتره تا زمانی که قصد پر کردن فرم رو نداریم همه فیلد ها نمایش پیدا نکنند.
و کلی کارای دیگه میشه انجام داد که بیشتر اینها در طراحی تحت وب مشاهده میشه حال ما این رو روی دسکتاپ هم پیاده سازی کردیم که خیلی جذاب هم هستش.
به صورت لمس کردن و یا استفاده از کلیک ماوس فرم آزاد میشه و به صورت زیر میتونیم اطلاعات رو وارد کنیم :
014.jpg
حالا یه ایده جالبی بعد از اینکه فرم پر شد و اقدام به ذخیره کردیم با کلیک بر روی دکمه مثلا ذخیره یه لحظه اتفاق جالبی به صورت زیر خواهد افتاد :
013.jpg
همینکه اقدام به ذخیره میکنم سریعا در وسط همون کادر به صورت Fill شده پیغام ذخیره شد داده میشه و بعد دوباره فرم میره به مرحله افزودن جدید.
با همچین خلاقیت های نه چندان سخت میشه طرحی رو ارائه کرد که تکراری نیست و این برای مشتری مهمه.
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C
تبریک مهندس چالب بود.
اگه ممکنه بفرمایید این موارد را با چه کنترلی و کامپوننتی و فونتی ایجاد کردید؟
خواهش میکنم دوست عزیز ، به ترتیب شماره من به سوال شما پاسخ میدم.
- کامپوننت TabView
- این گزینه رو بنده انحصاری از تب منوی جدید Fire Fox الگو گرفتم چند روز پیش بود نسخه جدید این مرورگر رو دریافت کردم که واقعا طرح جالب و جدیدش دلنشین هست بنابراین به صورت یک Component برای خودم نوشتم که مشکل نحوه منو بندی رو در پروژه ها حل میکنه.
- فیلد های معروف TextInput هستند که با تغییر اندازه به این شکل تغییر یافته اند.
- کنترل Label و Text که هر دو به صورت مجزا نتیجه خروجی از کلاس های Time و Date رو نمایش میدهند.
- کنترل برچسب و همچنین TextArea
- کنترل های Button هستند که با استفاده از اشکال هندسی و تصاویر داخل اوها رو با استفاده از CodeBase64 تولید کرده ام و شکل ظاهرش رو هم توسط شیء Rectangle تغییر دادم.
- دیگر مواردی مثل تصاویر و مخصوصا زمینه نم
در مورد زبان و فناوری هم باید اشاره کنم که تمامی این موارد ریز به ریز در C++ تحت فناوری QML پیاده سازی شده.
میتونید به این تاپیک برای مشاهده طرح ها و یک سری نمونه ها مراجعه کنید.
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C
طرح جالبی زدین استاد کامبیز اسدزاده، این ایتم های که ساختین با wfp ایجاد شده اند؟! یا وین فرمه؟! کامپونتی استفاده شده؟! نسخه جدید DevCompont؟!
بعدش همون طرح UX که شما فرمایش میکنید و مایکروسافت همه رو (اندروید و IOS) به این طرح بسیار زیبا کشانده بنظرم بیشتر برای وب زیباست (نظر شخصی منه)
ارتباطی با C# و فناوری های مربوط به WPF ندارند و در C++ پیاده سازی شده اند.
طراحی مدرن در تمامی زمینه ها گستردگی فراوانی دارند ، تنها دلیلی که در دسکتاپ زیاد با طرح های خلاقانه روبرو نمیشویم عدم شناخت فناوری های موجود در دسکتاپ هستش.
برای مثال در وب همگی با فناوری های CSS3, HTML5 و .. آشنا هستند ولی این سوال است که آیا با این فناوری ها در دسکتاپ هم میشه طراحی کرد ؟ جواب خیر است یا بلی ؟ شاید اگر دیدمان را نسبت به دسکتاپ هم در حد موبایل و وب گسترده تر کنیم توانایی رسیدن به این جواب رو خواهیم داشت.
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C
تشکر آقای اسد زاده - میشه بگید با چه IDE ایی این برنامه ها را با C++ ایجاد کردید؟
برای این کار دو روش وجود داره : 1.استفاده از محیط مخصوص C++ که Qt Creator هستش و 2. اینکه نصب افزونه Qt Library روی Visual Studio در لیست انواع پروژه های C++ به ویژوال استودیو افزوده خواهد شد که این روش شامل محدودیت هایی هست.
اگه سوالی هم در رابطه با این موضوع داشته باشید در تالار های بخش C++ بپرسید.
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C
سلام خدمت دوست خوبم آقا کامبیز...
طرح شما رو دیدم و اتفاقا در ابتدا تصور کردم با jquery طراحی شده. آفرین . قشنگه!
اما نقدهایی در اون هست که باید خاطر نشان کنم:
1- این طرح کاملا سلیقه ای هست ممکنه خیلی از مشتری ها اون رو نپسندن: بارها توی همین تاپیک گفتم که اول از همه باید از دید مشتری به برنامه نگاه کنید و نه از دید برنامه نویس. مشتریان ما معمولا این طرح رو نمیپسندن به دلایل زیر:
1-1: قالب بی روح و خسته کننده در دراز مدت و همچنین کمرنگ بودن فونت ها که چشم رو خسته میکنه
2-1: تعداد زیاد اینپوت ها و نزدیک بودنشون به هم
3-1: مشخص نبودن کاربرد برخی کنترل ها: منظورم اون dropbox هست بالای سوابق کاری
4-1: یادمه یکی از مشتریام میگفت برنامه شما خیلی جدیده!!! و من نمیتونم باهاش کار کنم... و من برای همین مجبور شدم دکمه ها رو از حالت فلت در بیارم و رنگ برنامه رو مثل win98 کنم!!! (البته این ها موردی هستند و مشکل از خود مشتری هست که سلیقه نداره!!! ولی باید بهشون توجه بشه: مثلا نرم افزار همکاران سیستم با همین اینترفیس win98 داره فروش میکنه و حتی سپیدارشون که مال خودشونه بخاطر ظاهر office2007 نتونست موفق بشه)
2- آیتم های داخل کامپوننت popup که از فایرفاکس ایده گرفتید اصلا متناسب با کاربردشون نیستن (برای مثال جستجو نباید اینجا باشه : هر جستجویی باید جایی متناسب با اون دیتا باشه). علاوه بر این مقدار زیادی از ارتفاع صفحه نمایش رو به منوی مربوطه و نوار وضعیت اختصاص دادید که با توجه به عریض بودن مانیتورهای امروزی کار درستی نیست. بهتره بجای ارتفاع از عرض استفاده بشه. همونطور که مشخصه عرض برنامه جای خالی زیاد داره
3- از لحاط UX هم خیلی ها با تعداد زیاد اینپوت ها در یک صفحه و همیتطور اینپوت های داخل popup کنار نمیان...
---
اما درکل میدونم که این طرح رو در یک ساعت و فقط برای اهداف آموزشی زدید برای همین جسارت کردم و نکات آموزشی بیشتری رو بهش اضافه کردم.
تمامی نکاتی که فرمودید درسته و 4 نکته ای که بهش اشاره کردین در صورت اعمال بر روی یک سبک جدید بسیار موثر خواهد بود.
به یه نکته ای در رابطه با Popup ها اشاره کنم که البته متناسب با سلیقه یا هدف پیاده سازی میشوند مثلا در این طرح قرار هست مشخصات و جزئیات بیشتری رو از کاربر دریافت کنیم بنا بر این فکر میکنم کاربر وقتی با تعداد زیادی از فیلد روبرو بشه و شاید قرار نباشه همه اونهارو مقدار دهی کنه مواجه خواهد شد و برای همچین کار هایی Popup تنها روشی بود که به ذهنمون رسید.
مثلا در صورت نیاز برای وارد کردن یک سری اطلاعات بیشتر میتونه با کلیک بر روی بخش مورد نظرش فیلدهای بیشتری رو مشاهده و در صورت نیاز اونهارو پر کنه.
015.jpg
یا مثلا در رابطه با اینکه کاربرد بعضی از کنترل ها مشخص نیست طی یک سری اضافات میشه مفهومی ترش کرد.
یا این چهار تا آیکونی که هیچ گونه متنی روشون وجود نداره با Hover شدن روی اینها حالت انیمیت اتفاق میفته حالت چرخشی و یا حالت Scale شدن و شایدهم تغییر رنگ به حالت اصلی و غیر خاکستری.
برای مثال در این بخش کاربر میتونه علاوه بر اینکه گروه کارسیش رو مشخص کنه اگر گروه کاری مربوط به اون در لیست موجود نبود با کلیک بر روی دکمه کنار اون یک فرمی سریعا باز بشه و اطلاعات جدید رو هم وارد کنه.
016.jpg
و البته در رابطه با اینکه مشتری میگه برنامه شما جدیده و من نمیتونم باهاش کار کنم ! برای این موضوع هم میشه Style های مختلفی رو به عنوان تم معرفی کرد که بر اساس سلیقه طرحی رو که میپسنده انتخاب کنه دقیقا Visual Studio رو در نظر بگیرید ، تم هایی برای ست کردن داره که برنامه رو کاملا مجزا میکنه مگر اینکه کاربر کاربر عصر یخبندان باشه و کلا با مدرن بودن کنار نیاد که خب این هم احتمالش بسیار کمه
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C
سلام طرح دوم رو بیشتر میپسندم...
رنگهای شاد داره
با اجازتون طرح اول رو کمی فتوشاپ کردم:
sdf.jpg
استفاده از این نوع popup برای موردی که فرمودید خیلی جالبه و به ساده شدن محیط خیلی کمک میکنه. آفرین
این نمونه رنگ ها رو در اختیار داشته باشید کد ها و رنگ ها توسط گوگل مورد استفاده قرار میگیره که طبق گفته خودشون از همین کد و رنگ بندی ها در Android 5 استفاده کرده اند، فایل swatch رو برای فوتوشاپ اینجا قرار میدم.
.:.We speak a universal language that brings us together.:.
=======================================
انجمنهای برنامهنویسی مدرن ایران
آموزشهای سیپلاسپلاس و Qt و دیگر کتابخانهها
کانال یوتیوب من | کانال آپارات من
کانال تلگرامی من | گروه تلگرامی ++C