12
بردیینکار تمربریبهکاریکطراحتجر برای علی اکرمیaliakrami.ir - ضريع که- بران ویاز کاررسی بر- بریبط کاراحی را طر- اژی محترات است- یایل و محصسؼ ت

50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

Embed Size (px)

DESCRIPTION

50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

Citation preview

Page 1: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

تمرین کاربردی برای یک طراح تجربه کاربری

علی اکرمیaliakrami.ir

ضريع که - بررسی ویاز کاربران - طراحی رابط کاربری - استراتژی محتًا - تًسؼٍ محصًل وُایی -

Page 2: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

توسعه محصول نهایی

جلسٍ پىجم

برجستٍ کهيیرایص را مًارد در حال 41 بارگساری تذریجی 42 مرحلٍ ایبُبًد 43 استراتژی برای صفحٍ ومایص َای کًچک 44 تحقیق در مًرد ريیکرد رابط کاربری 45

بُبًد بارگساری تصايیر 46 HTML 5استفادٌ از قابلیت َای 4748 CSS که را مذیریت فطردٌ کردن فایل َا 49 CSSتفکیک کالس َا ي ضىاسٍ َا در 50

Page 3: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

توسعه محصول نهایی

را برجستٍ کهيیرایص مًارد در حال 41

Page 4: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

بارگساری تذریجی

42 توسعه محصول نهایی

:مطکل ضًد می ػث با سىتی ريش بٍ صفحات بارگساری

فراخًاوی چیسی ومایص از قبل اطالػات َمٍ کٍ .بماوذ مىتظر خیلی کاربر ضًد می باػث کٍ ضًد

:حل راٌ

ثابت ػىاصر ابتذا تذریجی، بارگساری از استفادٌ با َا دادٌ سپس.ضًوذ می فرياخًاوی صفحٍ

با ي تذریج بٍ وُایت در ي ضًوذ می فرياخًاوی می بارگساری بیطتری َای دادٌ کاربر، پیمایص

.ضًوذ

Page 5: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

مرحلٍ ایبُبًد

43 توسعه محصول نهایی

پایٍ وسخٍ یک .کىیذ تمرکس محتًا ريی ابتذا -1 داضتٍ دسترسی آن بٍ بتًاوىذ َمٍ کٍ کىیذ ایجاد قابل ضکل بٍ را ضما وظر مًرد محتًای ي باضىذ .دَذ ومایص قبًل

کٍ َایی دستگاٌ برای را بصری َای جلًٌ -2

.کىیذ اػمال داروذ را َا آن ومایص قابلیت

کٍ َایی دستگاٌ برای را تؼاملی الیٍ وُایت در -3 .کىیذ اضافٍ کىىذ می پطتیباوی را َا آن

Aaron Gustafson http://www.alistapart.com/articles/understandingprogressiveenhancement http://filamentgroup.com/dwpe

Page 6: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

استراتژی برای صفحٍ ومایص َای کًچک

44 توسعه محصول نهایی

Responsive Web Design: Ethan Marcotte http://www.alistapart.com/articles/responsive-web-design

Page 7: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

تحقیق در مًرد ريیکرد رابط کاربری

Programmatic vs Declarative http://candanny.wordpress.com/2011/08/14/declarative-vs-programmatic-in-javascript-mobile-app-frameworks

45 توسعه محصول نهایی

Page 8: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

بُبًد بارگساری تصايیر

CSS Sprite Generator http://spritegen.website-performance.org http://css-tricks.com/css-sprites

46 توسعه محصول نهایی

Page 9: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

HTML 5استفادٌ از قابلیت َای

47 توسعه محصول نهایی

•url •email •datetime •datetime-local •date •month •week •number •range •color •search •tel •time

Page 10: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

CSS که را مذیریت

48 توسعه محصول نهایی

بخص برای ػىًان ایجاد برای تًضیحات از• اوتُای تا کار ایه ي که استفادٌ مختلف َای .بذٌ ادامٍ فایل

ایجاد ػىايیه لیست یک فایل َر ابتذای در•

فُرست ترتیب بٍ را مختلف َای بخص ي که .که

ي راحت CSS محتًای در بتًاوی کٍ ایه برای•

در خاظ وطاوٍ یک از کىی، جستجً سریغ .که استفادٌ ػىايیه ابتذای

Page 11: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

فطردٌ کردن فایل َا

Minify http://code.google.com/p/minify

49 توسعه محصول نهایی

Page 12: 50 تمرین کاربردی برای یک طراح تجربه کاربری - جلسه پنجم

CSSتفکیک کالس َا ي ضىاسٍ َا در

50 توسعه محصول نهایی