Ux & ui 1
-
Upload
mokarimi -
Category
Data & Analytics
-
view
93 -
download
3
Transcript of Ux & ui 1
چه زمانی ما
به دیگران
محصولی را
می پیشنهاد
کنیم؟معرفی موجب انگیزش در
محصول
که خلق تجربه لذت بخشی
شده
[email protected]محمد کریمی
UX & UIUser satisfaction
U S E R E X P E R I E N
C E
U S E R I N T E R FA
C Eبه چگونگی صفحه
بندی محصول
معطوف است.
رفتار، حالت و
احساسات کاربر
آ�ش�ن�ا�ی�ی� ب�ا� چ�ن�د� م�ف�ه�و�م(CXی�ا� ) customer experienceت�ج�ر�ب�ه� م�ش�ت�ر�ی
CX با یک شرکت یا یک موسسه، یک برند، محص�ول، تعامل آن چیزی است که مشتری در احساس خدمات شرکت، سایت و یا اپ موبایل دریافت می کند.
(UXی�ا� ) user experienceت�ج�ر�ب�ه� ک�ا�ر�ب�ر
UX هRب یRک فرد چطور کRه ایRن یعنRی کاربری به تجربRه یRا درونRی صRورت احسRاسی یRا به طور ویژRه یRکتعاملRی کRه بRا یRک پروژRه )مثRل وب سایت ها، محصRول دیجیتال و
اپلیکیشن های موبایل و ... ( دارد، واکنش نشان می دهد.
RیRلRمRاRعRت RیRحRاRرRطInteraction design ( RاRیIXD)
انسانایRن بحRث مربوط بRه طراحRی واکنش های رد و بدل شده یRا در واقRع تعامRل میان است. محصوالت دیجیتال و
آ�ش�ن�ا�ی�ی� ب�ا� چ�ن�د� م�ف�ه�و�م RیRحRاRرRط RرRکRفRتdesign thinking
و فیزیکی تعاملRی بRا رابطRه در فرد یRک کلRی تجربRه طراحRی یعنRی طراحRی تفکRر موبایل، وب اپلیکیشRن بRا تعامRل از تجرRبRه مثالً دارد، یRک شرکRت بRا کRه غیرفیزیکRی
سایت، تماس تلفنی و ... مسئله در تفکر طراحی2سود و بهره وری شرکت و صاحب خدمات1(تیم ها و کسانی که این خدمات را ارائه می کنند.2(
RلRوRصRحRم RیRحRاRرRطPRODUCT DESIGN
و فرم چیزهای تعریRف کردن شکRل یعنRی کلRی به طور یا فیزیکRیطراحRی محصRول .دیجیتالی
ایRن اسRت کRه طراحRی محصRول بسRیار کلی تر از طراحRی تعاملRی بRا اصRطالحتفاوت ایRن طراحRی تعاملRی در نظRر گرفتRه می شود کRه هRم بRه تعامالت مرتبRط مRی باشRد و هRم به
اجسام و اشیاء[email protected]
ISO ب�ر�ا�س�ا�س� UXت�ع�ر�ی�ف�
تعریف اساس عنوانISOبر user experience
شامل کلیه عواطف، اعتقادات، مزیت ها، پاسخ های
اجراهRا و رفتارهRا روانRی، و زمان فیزیکRی از قبل
اطالق می بعRد از آRن و زمان اسRتفاده، در اسRتفاده
گردد. [email protected]
UX و� UIت�ف�ا�و�ت� ب�ی�ن� UI ه میRی شود گفتRش داده مRفحه نمایRه در صRر چیزی کRه هRنعت نرم افزار بRدر ص
شود کRه شامRل تصRاویر، متRن هRا، دیاگرام هRا، ماژولهRا، جداول ، ویدئوهRا و همچنین
رنگ ، سایر و مکان آن ها می باشد.
UX ر ازRیع تRیار وسRبس UI ی که ازRاس کاربر زمانRه و احسRه تجربRد و بRی باشRم
محصول شما استفاده می نمایند گفته می شود.
بRه عنوان مثال زمانRی کRه شمRا از سRایت دیجRی کاال محصRولی را سRفارش مRی دهید و
خوبRی وجود داشته UXآRن بسRیار سRریع تحویRل شمRا مRی گردد بRه ایRن معناسRت کRه
ب�ا� ه�م� ب�ب�ی�ن�ی�مخارجی
ایرانی
http://www.pennyjuice.com/htmlversion/whoispj.htmwww.techinsider.iowww.mashable.comwww.engadget.com
www.tabnak.irhttps://www.alibaba.ir/ www.digikala.com https://bama.ir/ [email protected]
UX )USER EXPERIENCE(طراح�ی شده و تمام�ی تالش این کاربر خاص شمRا تجرب�ه کاربری، روش�ی برای س�اخت محص�ولی هس�ت ک�ه برای
رضایت در جه�ت خلRق محیRط تعاملRی راحRت و کاربردی عل�م برای موفقی�ت و رش�د کس�ب و کار شم�ا ب�ا هدف
می باشد.مندی کاربر نهایی در ذهن کاربر نقش ببنددخاطره ای خوش هدف، این است که
ارتباط راحت کاربر با محصول -< خوشحالی و رضایت کاربر
اصول و شناخت صحیح از کاربر نهایی محصول
(: هدف قراردادن مشکالت کاربر و ارایه راه حل تعاملی لذت بخش و UXDطراح تجربه کاربری )مفید
معیارهای توصیف رفتار کاربر، قابل اندازه گیری
?
?
?
?
? از محصول استفاده بازهمتا او
کند.
UXD )USER EXPERIENCE DESIGNER(
UXDدانش
روانشناسی
انسان شناسی
علوم کامپیوتر
طراحی گرافیک
طراحی صنعتی
علوم شناختی
شناخت و
حدس
رفتارهای
کاربر
روابط عمومی خوب و باالیی
به ویژگی هاي تکنیکی و فنی UXDیک کار کاری ندارد.
کدام برای شما
مناسب است:ذهن طراحRی بر مبنای رابRط کاربری بیشتRر بRه درد کسRایی میخوره کRه
دارن و یک کم نیاز به تکنیک هم دارنتوانایی های ویژوالو هنرمندتر
UX & UI
UI
طراحRی بر مبنای تجربRه کاربر بیشتRر یRه کار اجتماعیRه و یRه زمینRه تحلیلی
هم دارن که میشه گفت قسمت فنی طراحی هست
UX
Look outside world mentality
User status
کلید موفقیت در کسب و کار شناخت سریع کاربران
!WOW
!از دریچه دید کاربر به محصول نگاه کنید، خودتان را جای کاربر بگذارید و برای مشکالت راه حل مفید
پیدا کنید
کاربران همیشه در جای صحیح و مناسب خودشان قرار دارند، این شما هستید که باید در کنار آنها قرار ایده خود را با مشتری در میان بگذارید و از همفکری استفاده کنید
بگیرید.
ایده من کاربر زیاد آره این ایده توجیه پذیر هستجذب می کنه
!! کاربران با من موافق هستند
من درست میگمم�ن� ی�ه� ا�ی�د�ه� ن�ا�ب� !
د�ا�ر�م�!
خارج از ساختمان ذهنیت دنیا رو ببین
دید آیا تابحال به برنامه های خود از
نگاه کرده اید؟یک کاربر
چه برنامه ای ظاهر دید یک کاربر از
دانیم چه عواملی سبب میشود تا این برنامه ها مشکل این جاست که نمیحرفه ای دارد؟
به نظر برسند و شما می توانید آنها را از سایر برنامه های حرفه ای
کنید؟متمایزمعمولی [email protected]
ارایه راه حل برای داشتن یکپارچگی در سراسر نرم افزار1( های آماده در سراسر نرم افزارTemplateروش استفاده از 2(نکات مهم برای رنگ بندی نرم افزار3(چگونه با رنگ بندی مناسب کاربران را ساعت ها پای نرم افزار نگه دارید؟4(چرا باید در انتخاب فونت نرم افزار حساسیت به خرج داد؟5(بهترین انتخاب برای فونت های نرم افزار چیست ؟6(ارایه یک روش بسیار ساده برای تغییر فوRنت بخش های مختلف7( اولین گام را به سوی ارایه یک نرم افزار حرفه ای بردارید.Splashبا فرم 8( قرار دهیم که موثر باشد؟Splashچه اطالعاتی درون فرم 9(
خوب طراحی کنیم؟Splashچگونه یک فرم 10(
حفظ جامعیت نرم افزار
RیRحRاRرRط RیRاRهRدRنRفRرRت RزRا RیRشRخRمبRرRی فRاRه چRنRدR سRتRوRنRهR وRرRوRدR اRطRالRعRاRت
شRدRنتRکR سRتRوRنRه
RیRاRه RمRرRف RیRحRاRرRط RیRاRهRدRنRفRرRت RزRا RیRشRخRبوRرRوRدR اRطRالRعRاRت
قرار دادنLabelدر باالی کنترل های ورود اطالعات قرار دادنLabelهمراستا در سمت راست کنترل های ورود اطالعات Placeholderها به جای labelها تراز بودنlabelها نسبت به کنترل های ورود اطالعات
Label
RیRاRه RمRرRف RیRحRاRرRط RیRاRهRدRنRفRرRت RزRا RیRشRخRبButtوRرRوRدR اRطRالRعRاRت
on شامل عملیات ثبت ، ویرایش، بروزرسانی، حذفCRUDعملیات
تمایز در طراحی دکمه ها رنگ مناسب برای دکمه ها و آیکونها: رنگ بندی
براساس گاو بنفشمحل قرارگیری دکمه هانمایش دکمه های اضافه به درخواست کاربردر بیاورید Rدکمه ها را به شکل منواستفاده از آیکن ها انتخاب عنوان مناسب )از سوم شخص استفاده نکنید و
بهتر است از نام موجودیت استفاده کنید.(
RیRاRه RمRرRف RیRحRاRرRط RیRاRهRدRنRفRرRت RزRا RیRشRخRبوRرRوRدR اRطRالRعRاRت
Button
کنیم و چه موقع از دکمه استفاده نکنیم؟استفادهچه موقع دکمه
در صRورتی کRه فرمانRی مشخص بRه سیستم برای گرفتن یRا درخواسRت منبRع در سRرور( الگوریتRم )اجرای پاسRخ داده نمRی شود بهتRر اسRت از برچسRب لینRک بRه جای یک
دکمه استفاده گردد. )دکمه های راهنما(
RیRاRه RمRرRف RیRحRاRرRط RیRاRهRدRنRفRرRت RزRا RیRشRخRبوRرRوRدR اRطRالRعRاRت فیلدهای اختیاری را حذف نمایید. اگر نمی شود آن را حذف نمود در برچسب
بنویسید که این فیلد اختیاری است. فرم های ورود اطالعات باید از نگاه کاربر منطقی طراحی شوند نه از نگاه برنامه
نویسی یا بانکهای اطالعاتیبرای خالصه کردن شجاع باشید
RیRاRه RمRرRف RیRحRاRرRط RیRاRهRدRنRفRرRت RزRا RیRشRخRبوRرRوRدR اRطRالRعRاRت .R.R. RرRیRاRس
فرم های اس�تاندارد مث�ل about , splash را در پروژه های خودفراموش نکنیم.
اطالعات ورود های فرم در افزار نرم در سراسر یکپارچگ�ی ب�ه پایبند باشیم.
در ص�ورت عدم انتخاب فون�ت مناس�ب، ارتباط دایم�ی کاربر با نرمافزار را مختل می کنیم.
گران با رقاب�ت برای را افزارهایتان نرم ظاه�ر کوتاه، زمان در قیمت ترین نرم افزارهای تجاری طراحی کنید.
Ten do’s and don'ts of UI and UX design تجربه ی یکسانی بدون در نظر گرفتن نوع دیوایس برای کاربران فراهم کنید.1(
امکانی فراهم کنید که یافتن منابع در سایت شما ساده و قابل فهم باشد.2(
قسمت های مهم تر را در مرکز توجه قرار دهید.3(
اطمینان حاصل کنید که تمام لینک ها و دکمه ها به درستی کار می کنند.4(
اجازه دهید تا کاربران کنترل تجربه ی مرور کردن سایتتان را در دست بگیرند.5(
اجازه ندهید تا طراحی سایتتان مانع سهولت استفاده از آن شود.6(
مانع مرور اجمالی کاربران نشوید.7(
صفحه را با مطاالب غیر مرتبط پر نکنید.8(
بازدیدکنندگان را برای لود شدن مطالبتان منتظر نگذارید.9(
[email protected]مواردی را که موجب عدم توجه به مطلب اصلی می شود حذف کنید.10(
[email protected]محمد کریمی