Презентация на Валентин Ликьов от Уебдизайн 3х30, април 2014. Акцентите: - UX в компанията - процес на създаване на прототип - самите прототипи - card sorting - A/B Tests, feedback - Landing pages - Fixed menus

1. Задният двор на дизайна
Валентин Ликьов
Interaction designer, Телерик

3. Защо се налага да правя
това?
Не може ли направо да се правят дизайни?

4. Ами може, но...
• дизайните имат повече детайли и изискват повече време
• скъпи промени
• не показват взаимодействие

5. Mind the... общата картинка

6. Прототипите спестяват време
на по-късен етап
• бързо изграждане на концепция
• прецизност в правенето на дизайна
• концентрация в съдържание и функционалност

8. Варианти на подреждане на продукти в главното меню

13. Супер!
Но откъде да започна?

14. Как да си направя прототип?
• изисквания

15. Как да си направя прототип?
• изисквания
• инвентаризация на съдържанието и анализ

17. Анализ за възможни
оптимизации за достъп
до съдържание през
системата за вход

18. Как да си направя прототип?
• изисквания
• инвентаризация на съдържанието и анализ
• подреждане на информацията

24. Как да си направя прототип?
• изисквания
• инвентаризация на съдържанието и анализ
• подреждане на информацията
• инструменти

28. Фиксирано меню

29. Фиксирано меню в реалния свят

30. Падащо меню в реалния свят

33. Chrome Mobile Google+ app Facebook app

34. • да се опрости йерархията на страниците
• да се обобщи информацията за продукта - да
разказва история
• отделните секции да са лесно достъпни
• винаги да са под ръка най-важните действия
• да се запазва контекстът на продукта

37. Нужно ли е да ползвам
фиксирано меню?
• често манипулиране на информацията
• много дълги страници
• когато имаме важен CTA
Не е нужно, но помага при:

38. Ако ползвам фиксирано меню
трябва да
• не заема много място
• има контраст
• помисля дали наистина е нужно

39. Как да разбера правилно ли е
това, което правя?
• тестове с хора
• софтуер за статистика и анализ
• A/Б тестове

40. Clicktale stats: страница Telerik Platform
Atention map Scroll reach Mouse move heatmap

42. Как се правят А/Б тестове?

43. Hamburger vs Menu
The Final AB Test
exisweb.net
Вариант1 – икона
Вариант2 – надпис
240 000 участници
Android users are almost 3x less likely to
click a navigation button than iOS users.
http://exisweb.net/menu-eats-hamburger

44. А/Б тест на текста в бутона на Тест Студио
Оригинал: Try now Вариант1: Download trial

48. Валентин Ликьов
facebook.com/valix
twitter.com/valix

49. Използвани материали
1 - http://starwarsaficionado.blogspot.com/2013/12/classic-image-pre-race-fix-up.html
2 - http://thehipperelement.com/post/77994680911/ui-is-what-you-see-ux-is-why-you-see-it
5 - http://www.tfl.gov.uk/maps/track/tube
19, 20, 21,22 - http://www.optimalworkshop.com/optimalsort.htm
23 - https://www.flickr.com/photos/fergaloid/6334228220/
25 - http://www.rachelilansimpson.com/what-is-it-that-you-do-exactly
26 - https://popapp.in/
27 - http://www.axure.com/
29 - http://libertyhardwares.net/services.html
30 - http://forums.rennlist.com/rennforums/10366251-post278.html
40 - http://www.clicktale.com/
43 - http://exisweb.net/mobile-menu-abtest
45, 46, 47 - https://www.optimizely.com/
48 - http://starwars.wikia.com/wiki/Star_Wars_Episode_I:_The_Phantom_Menace
www.telerik.com
Полезни връзки
Nielsen Norman Group: UX Training, Consulting, & Research
Using, abusing & designing human behaviour
User Experience Stack Exchange
UX Magazine | Defining and Informing the Complex Field of User Experience (UX)
Ideas | Adaptive Path
Design / UX — Medium
UXmatters :: Insights and inspiration for the user experience community