Transcript HCI (Human-Computer interaction)

‫‪HCI (HUMAN-COMPUTER‬‬
‫‪INTERACTION) DESIGN IN‬‬
‫‪IT‬‬
‫طراحی تعاملی انسان و رایانه در فا‬
‫سید محمد طاهری ‪89100349 -‬‬
‫مطالعه انفرادی – مبانی فناور ی اطالعات‬
‫ترم دوم ‪91 - 90‬‬
‫دانشگاه صنعتی شریف‬
‫تعریف طراحي تعاملي‬
‫‪ ‬طراحي تعاملي امروزه به مفهوم ايجاد ارتباط بهتر و مفيدتر بين محصوالت‬
‫صنعتي و كاربران مي باشد‪ .‬اين واژه كه نخست در علوم كامپيوتر و در طراحي‬
‫صفحات واسطه اي كامپيوتر ها مطرح بود‪ ،‬امروزه در طراحي كليه محصوالت‬
‫صنعتي به كار برده مي شود‪ .‬عرصه طراحي تعاملي بسيار نو پا است و عمر آن‬
‫به دهه پيش مي رسد‪.‬‬
‫‪ ‬هدف طراحی تعاملی این است که کاربرد پذیری را درفرآیند طراحی وارد کند ‪،‬‬
‫به عبارت دیگر هدف این است که محصوالت متعاملی ایجاد کند که آسان‬
‫باشند ‪ ،‬مؤثر باشند و از نظر استفاده نيز شادی بخش و لذت بخش باشند‪-‬‬
‫البته از دیدگاه کاربر‪.‬‬
‫طراحي تعاملي و فناوری‬
‫‪ ‬انقالب دیجیتالی امروزه به طرز چشمگيری در حال عوض کردن عصر حاضر‬
‫است و فناوری اطالعات و رایانه قسمتی از زندگی و محیط اطراف ما هستند‪.‬‬
‫‪ ‬پیشرفت فناوری حتی بر ظاهر محصوالت و خدماتی که ارائه می کنند نيز تاثير‬
‫چشمگيری داشته است‪ .‬این طراحی یک طراحی چندجزیی است که طراحی نرم‬
‫افزار‪ ،‬سخت افزار‪ ،‬فرم خارجی و طراحی تعامالت در آن همگام با یکدیگر شکل‬
‫می گيرند‪.‬‬
‫‪ ‬محصوالت کامپیوتری دنیای حاضر ابعاد جدیدی از تعامل را به ما معرفی می‬
‫کنند‪ .‬آنها همراه فرم‪ ،‬دامنه ی وسیعی از دنیای دیجیتال را مطرح می کنند ‪،‬‬
‫بدین گونه که امروزه بیشتر محصوالت در تعامالت پیچیده کامپیوتری شکل‬
‫داده می شوند‪.‬‬
‫ادامه طراحي تعاملي و فناوری‬
‫‪ ‬با زیاد شدن قابلیت اختراع محصوالت فناورانه‪ ،‬پیچیدگی آنها نيز افزایش‬
‫یافته و در نتیجه نقش طراحان تعاملی نيز به طرز رو به اهمیتی افزایش پیدا‬
‫می کند‪ .‬چرا که فناوری در خدمت رفع نیازهای مردم‪ ،‬سير تکاملی خود را طی‬
‫خواهد کرد و پیشرفت روزافزدن آن نباید نارسانایی عمکرد محصوالت را سبب‬
‫شود‪.‬‬
‫ادامه طراحي تعاملي و فناوری‬
‫نقش طراحان تعاملي در دنیای کامپیوتر‬
‫‪ ‬همانگونه که مهندس عمران و مهندس معمار در کنار هم و موازی با یکدیگر‬
‫حرکت می کنند‪ ،‬به طوری که هدف مهندس عمران پدیدآوردن یک ساختار‬
‫مناسب است‪ ،‬در حالی که مهندس معمار به کیفیت و چگونگی طراحی فضاها و‬
‫سهولت زندگی مردم در آن اهمیت می دهد‪ ،‬در دنیای کامپیوتر نيز مهندس نرم‬
‫افزار به کاربرد در مورد کار نرم افزارها اطمینان می دهد و طراحان‪ ،‬روابط‬
‫تعاملی بين محصوالت و مردم را مدنظر قرار می دهند‪.‬‬
‫‪ ‬همانگونه که بين طراحی و اجرای ساختمان تفاوت است ‪ ،‬بين طراحی و اجرای‬
‫مهندس ی نرم افزار نيز تفاوت است‪.‬‬
‫حمایت های طراحی تعاملي‬
‫‪‬طراحی تعاملی در واقع همانند چتری است که همه جنبه های بنیادی تحقیقاتی‬
‫و طراحی سامانه های مبتنی بر کامپیوتر برای انسان را شامل می شود‪.‬‬
‫رابطه بين ‪ ID‬و ‪ HCI‬و سایر زمینه ها‪:‬‬
‫مقایسه بين طراحی تعاملی و عادی‬
‫‪‬هر چند تا قبل از پدیده ای به نام کامپیوتر واژه ای به نام طراحی تعاملی‬
‫ناشناخته بود‪ ،‬اما بسیاری از اصول طراحی تعاملی در طراحی ها و ایده های‬
‫طراحان صنعتی وجود داشت از جمله می توان به موارد زیر اشاره کرد‪:‬‬
‫)‪(Retting,2003‬‬
‫• قابل استفاده (مفید)‬
‫• متناسب با قابلیت ها و محدودیت های کاربر‬
‫• لذت بخش‬
‫• مناسب برای گروه هدف‬
‫• چند منظوره‬
‫• زیبا‬
‫• شفاف در عملکرد و نحوه استفاده‬
‫• قابل بسط و سازگارشدن با محیط‬
‫ادامه مقایسه بين طراحی تعاملی و عادی‬
‫‪ ‬تفاوت های اصولی و بنیادی بين طراحی معمولی در گذشته و تعاملی امروزی‬
‫وجود دارد که در جدول زیر بخش عمده ای از آنها آمده است‪(Frankel , :‬‬
‫)‪2000‬‬
‫مراحل طراحی محصوالت تعاملی‬
‫‪(1‬‬
‫‪(2‬‬
‫‪(3‬‬
‫‪(4‬‬
‫‪(5‬‬
‫فهم و درک ‪ :‬طراحان باید مفهوم محصول و فناوری مناسب دنیای رقابت و‬
‫توان بخش بازار و محدودیت هایی که باعث تغیير در میدان طراحی می شود را‬
‫بفهمند‪.‬‬
‫مشاهده‪ :‬شامل مشاهده چگونگی کارهای مردم‪ ،‬محیط زندگی آنها‪ ،‬عادات و‬
‫هرچيزی که مردم با آن در ارتباط هستند و مهمتر از همه هدف نهایی طرح‬
‫تصور کردن‪ :‬کلیه ی مراحل طراحی شامل طوفان ذهن‪ ،‬طرح اولیه( اسکیس)‬
‫و مدل سازی و شبیه سازی تیم طراحی و انواع تکنیک های پیش بینی عملکرد‬
‫نهایی محصول‬
‫ارزیابی و تصحیح‪ :‬اجرای مراحل پیشين به صورت آناليز‪ ،‬مشاهده‪ ،‬اسکیس‬
‫و ماکت سازی برای برطرف سازی نواقص‬
‫تکمیل و اجرای نهایی‪:‬معرفی محصول نهایی در جزییات و رنگهای مختلف‬
‫چرا تجربه کاربری)‪ (User Experience‬در ‪ iPod‬موفقیت آميز بود؟‬
‫‪ ‬کیفیت تجربه کاربری از ابتدا‬
‫‪ ‬ساده‪ ،‬باسلیقه‪ ،‬زیبا‪ ،‬متمایز‪ ،‬رضایت بخش‪ ،‬به روز ‪ ،‬مدرن‪ ،‬اسم های‬
‫جذاب و‪...‬‬
‫فرآیندهای اصلی در طراحی تعاملی‬
‫‪ ‬فراهم کردن نیازها و تجهيزات( ‪Establishing‬‬
‫‪)requirements‬‬
‫‪ ‬پیشرفت کردن متناوب(‪)Developing alternatives‬‬
‫‪ ‬شبیه سازی(‪)Prototyping‬‬
‫‪ ‬آزمایش و تست(‪)Evaluating‬‬
‫مثال)نماینده فروش آنالین در ‪Anna, IKEA‬‬
‫‪ ‬طراحی متفاوت برای مشتریان آمریکایی‬
‫و انگلیس ی‬
‫‪ ‬تفاوت های ظاهری در ‪Anna‬برای‬
‫مشتریان کشورهای دیگر مانند هند‪،‬‬
‫آفریقای جنوبی و یا چين چگونه خواهد‬
‫بود؟‬
‫اصول طراحی‪-‬بازخورد(‪)Feeback‬‬
‫‪ ‬بازگشتن اطالعات پس از کار کردن با محصول نهایی و دستاوردهای‬
‫هر گونه فعالیت کاربر‬
‫‪ ‬شامل هر گونه صدا‪ ،‬تصویر‪ ،‬انیمیشن‪ ،‬متن‪ ،‬برجستگی و هر گونه‬
‫ترکیبی از موارد به صورت چندرسانه ای‬
‫‪ ‬مانند فشرده شدن دکمه ای که صدایی تولید می شود و یا با کادر قرمزی برجسته می‬
‫شود‪.‬‬
‫”‪“ccclichhk‬‬
‫اصول طراحی‪-‬محدودیت ها (‪)Constraints‬‬
‫‪ ‬محدود کردن فعالیت های ممکن که با محصول نهایی می توان‬
‫انجام داد‪.‬‬
‫‪ ‬کمک به کاربر در جلوگيری از انتخاب های نادرست‬
‫‪ ‬اشیای فيزیکی هم حتی می توانند به صورت اشیای محدود طراحی‬
‫شوند‪.‬‬
‫‪ ‬مانند باز کردن یک قفل فقط با یک نوع کلید‬
‫اصول طراحی‪-‬ادامه محدودیت ها (‪)Constraints‬‬
‫‪ ‬مثالی از طراحی مبهم‬
‫‪ ‬محل نصب ماوس و کیبرد‪ ،‬کدام باال و کدام‬
‫پایين‪ ،‬رنگها کمکی می کنند؟‬
‫‪ ‬مثال هایی از طراحی منطقی‬
‫‪)A ‬ارتباط مستقیم و بالفاصله بين آیکون و‬
‫رابط ماوس و کیبرد‬
‫‪)B ‬رنگ مرتبط و محدودکننده با آیکون ها‬
‫در اطراف رابطها‬
‫اصول طراحی‪ -‬ثبات (‪)Consistency‬‬
‫‪ ‬طراحی واسط کاربری (‪ )Interface‬به گونه ای که عملیات های‬
‫مشابه و متغير های مشابه برای کار های مشابه به کار گرفته شود‪.‬‬
‫‪ ‬رعایت ثبات و پایداری واسط به یادگيری و استفاده آسان کمک می‬
‫کند‪.‬‬
‫‪ ‬مانند استفاده از کلید ‪ Ctrl‬همراه با حرف اول دستوری که قرار است اجرا شود –‬
‫‪ctrl+O ،ctrl+S ،ctrl+C‬‬
‫‪ ‬ثبات داخلی طراحی عمکلردهای داخل برنامه به طور مشابه اسو ولی‬
‫ثبات خارجی طراحی عمکردها و واسطها مشابه برنامه های مشهور در آن‬
‫زمینه است‪.‬‬
‫اصول طراحی‪ -‬ادامه ثبات (‪)Consistency‬‬
‫‪ ‬یک نمونه از ثبات های خارجی‬
‫الف)ماشين حساب ها ‪ ،‬کیبردهای کامپیوتر‬
‫اب) تلفن ها ‪ ،‬کنترل های از راه دور‬
‫‪9‬‬
‫‪8‬‬
‫‪7‬‬
‫‪6‬‬
‫‪5‬‬
‫‪4‬‬
‫‪3‬‬
‫‪6‬‬
‫‪5‬‬
‫‪3‬‬
‫‪2‬‬
‫‪1‬‬
‫‪0‬‬
‫‪9‬‬
‫‪8‬‬
‫‪2‬‬
‫‪1‬‬
‫‪4‬‬
‫‪7‬‬
‫‪0‬‬
‫اصول طراحی‪ -‬توانش (‪)Affordances‬‬
‫‪ ‬داشتن یک صفت و ویژگی خاص یک محصول که اجازه می دهد به‬
‫افراد تا چگونه از آن استفاده کنند‪.‬‬
‫‪ ‬مانند دکمه ماوس که به فشرده شدن و یا دستگيره در که به کشیده شدن دعوت و‬
‫راهنمایی می کند‪.‬‬
‫‪ ‬نورمن (‪ )1988‬این لغت را اولين بار برای بحث درباره طراحی های اشیای‬
‫روزمره به کار برد‪.‬‬
‫‪ ‬از آن به بعد در طراحی تعاملی برای بحث در چگونگی طراحی اشیا به‬
‫شدت به کار گرفته شد‪.‬‬
‫‪ ‬مانند پیچه لغزش (‪ )scrollbars‬که اشاره دارد به حرکت باال و پایين یا آیکون ها‬
‫که نشان می دهند باید روی آنها کلیک شوند‪.‬‬
)Affordances( ‫ ادامه توانش‬-‫اصول طراحی‬
‫ نمونه هایی از توانش‬
Physical Affordances 
Virtual Affordances 