ݺߣ

ݺߣShare a Scribd company logo

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

•
•
Ali Akrami
Ali Akrami

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

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

More Related Content

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

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