Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

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

1,072 views

Published on

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

Published in: Design

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

  1. 1. تمرین کاربردی برای یک طراح تجربه کاربری علی اکرمی aliakrami.ir - ضريع که - بررسی ویاز کاربران - طراحی رابط کاربری - استراتژی محت اً - ت سًؼ محص لً و اُیی
  2. 2. توسعه محصول نهایی جلس پىجم 41 م اًرد در حال يیرایص را برجست که 42 بارگساری تذریجی 43 ب بُ دً مرحل ای 44 استراتژی برای صفح ومایص اَی ک چًک 45 تحقیق در م رًد ريیکرد رابط کاربری 46 ب بُ دً بارگساری تصايیر 47 استفاد از قابلیت اَی HTML 5 48 CSS را مذیریت که 49 فطرد کردن فایل اَ 50 تفکیک کلاس اَ ي ضىاس اَ در CSS
  3. 3. توسعه محصول نهایی م اًرد در حال يیرایص را برجست که 41
  4. 4. بارگساری تذریجی توسعه محصول نهایی 42 مطکل: بارگساری صفحات ب ريش سىتی با ػث می ض دً ک مَ اطلاػات قبل از ومایص چیسی فراخ اًوی ض دً ک باػث می ض دً کاربر خیلی مىتظر بماوذ. را حل: با استفاد از بارگساری تذریجی، ابتذا ػىاصر ثابت صفح فرياخ اًوی می ض وًذ.سپس داد اَ فرياخ اًوی می ض وًذ ي در و اُیت ب تذریج ي با پیمایص کاربر، داد اَی بیطتری بارگساری می ض وًذ.
  5. 5. ب بُ دً مرحل ای توسعه محصول نهایی 43 1 - ابتذا ريی محت اً تمرکس کىیذ. یک وسخ پای ایجاد کىیذ ک مَ بت اًوىذ ب آن دسترسی داضت باضىذ ي محت اًی م رًد وظر ضما را ب ضکل قابل قب لً ومایص د ذَ. 2 - جل اَی بصری را برای دستگا اَیی ک قابلیت ومایص آن اَ را داروذ اػمال کىیذ. 3 - در و اُیت لای تؼاملی را برای دستگا اَیی ک آن اَ را پطتیباوی می کىىذ اضاف کىیذ. Aaron Gustafson http://www.alistapart.com/articles/understandingprogressiveenhancement http://filamentgroup.com/dwpe
  6. 6. استراتژی برای صفح ومایص اَی ک چًک توسعه محصول نهایی 44 Responsive Web Design: Ethan Marcotte http://www.alistapart.com/articles/responsive-web-design
  7. 7. تحقیق در م رًد ريیکرد رابط کاربری Programmatic vs Declarative http://candanny.wordpress.com/2011/08/14/declarative-vs-programmatic-in- javascript-mobile-app-frameworks توسعه محصول نهایی 45
  8. 8. ب بُ دً بارگساری تصايیر CSS Sprite Generator http://spritegen.website-performance.org http://css-tricks.com/css-sprites توسعه محصول نهایی 46
  9. 9. استفاد از قابلیت اَی HTML 5 توسعه محصول نهایی 47 •url •email •datetime •datetime-local •date •month •week •number •range •color •search •tel •time
  10. 10. CSS تیریذم ار هک توسعه محصول نهایی 48 • از ت ضًیحات برای ایجاد ػى اًن برای بخص اَی مختلف استفاد که ي ایه کار تا اوت اُی فایل ادام بذ .ٌ • در ابتذای رَ فایل یک لیست ػىايیه ایجاد که ي بخص اَی مختلف را ب ترتیب ف رُست که. • برای ایه ک بت اًوی در محت اًی CSS راحت ي سریغ جستج کىی، از یک وطاو خاظ در ابتذای ػىايیه استفاد که.
  11. 11. فطرد کردن فایل اَ Minify http://code.google.com/p/minify توسعه محصول نهایی 49
  12. 12. تفکیک کلاس اَ ي ضىاس اَ در CSS توسعه محصول نهایی 50

×