Se ha denunciado esta presentación.
Se está descargando tu SlideShare. ×
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Anuncio
Cargando en…3
×

Eche un vistazo a continuación

1 de 19 Anuncio
Anuncio

Más Contenido Relacionado

Anuncio

UI introduction

  1. 1. ВЪВЕДЕНИЕ И ПРИНЦИПИ В ДИЗАЙНА НА ПОТРЕБИТЕЛСКИ ИНТЕРФЕЙС UI & UX BASICS Thursday, 18 April 13
  2. 2. UX & UI Basics www.isavkov.net За какво ще си говорим? Какво е UI дизайн? Типография в дизайна Психология на цветовете Принципи на модерния UI Thursday, 18 April 13
  3. 3. UX & UI Basics www.isavkov.net Какво е UI дизайн? Thursday, 18 April 13
  4. 4. UX & UI Basics www.isavkov.net UI (user interface) се използва, за да дефинира как работят елементите, а не как изглеждат Интерфейсът е вашият продукт Основна цел: комуникация Топ цел: Прост и елегантен, изчистен и консистентен UI - User Interface Thursday, 18 April 13
  5. 5. UX & UI Basics www.isavkov.net Лейаут и позициониране на елементите Форма и размер Избор на цвят Контраст Текстура Основите на UI дизайна Thursday, 18 April 13
  6. 6. UX & UI Basics www.isavkov.net Използване на бялото пространство Заоблените ъгли дефинират границите Предавайте значението с цветове Привличайте вниманието Сенки и тъмни фонове за фокус Фокус върху ключови call-to-action Техники за ефективен UI дизайн Labels в input полетата Иконки! Индикатори за действие: loading и т.н. Елементи свързани със съдържанието PopUP прозорци за потвърждение Hover елементи Thursday, 18 April 13
  7. 7. UX & UI Basics www.isavkov.net Типография в дизайна Thursday, 18 April 13
  8. 8. UX & UI Basics www.isavkov.net Типографията е мощен инструмент за ефективна комуникация Типографията съществува, за да въведе ред в информацията, като я разделя и организира Типографията помага на потребителите да намерят това, което искат. Въведение T Thursday, 18 April 13
  9. 9. UX & UI Basics www.isavkov.net Четимост Цвят и консистентност Размер на буквата Разстояние между редовете Между буквено разстояние Подредба и поддравняване Избор на правилния шрифт Thursday, 18 April 13
  10. 10. UX & UI Basics www.isavkov.net Избор на правилния шрифт Използвай Comic Sans и ще гориш в Ада!!! Thursday, 18 April 13
  11. 11. UX & UI Basics www.isavkov.net Психология на цветовете Thursday, 18 April 13
  12. 12. UX & UI Basics www.isavkov.net Изберете правилната цветова палитра Тествайте цветовата схема в прототип Какво мислят другите? (обратна връзка) 3 прости правила Thursday, 18 April 13
  13. 13. UX & UI Basics www.isavkov.net Цветовете и тяхното значение ОПТИМИЗЪМ ПРИЯТЕЛСТВО ДЪРЗОСТ КРЕАТИВНОСТ ДОВЕРИЕ СПОКОЙСТВИЕ БАЛАНС СВОБОДА ПРАЗНОТА ЗАБАВЛЕНИЕ Thursday, 18 April 13
  14. 14. UX & UI Basics www.isavkov.net От къде да си набавим палитри? Сайтове: http://www.colourlovers.com, https://kuler.adobe.com/, http://mobile.colorotate.org/ Създаване на собствени на базата на снимки сред природата Thursday, 18 April 13
  15. 15. UX & UI Basics www.isavkov.net Принципи на модерния UI Thursday, 18 April 13
  16. 16. UX & UI Basics www.isavkov.net Ползваемост? Ползваемост е когато имаш възможност да използваш нещо по лесен и достъпен начин. Ползваемостта е директно свързана с UI Thursday, 18 April 13
  17. 17. UX & UI Basics www.isavkov.net Как измерваме ползваемостта? Интуитувен интерфейс, познат на потребителите По-малко мислене, по-добре! Брой направени грешки Време прекарано в сайта, докато търсят информация Тествайте с хора, които нямат опит с UI Попитайте ги какво запомниха Thursday, 18 April 13
  18. 18. UX & UI Basics www.isavkov.net Принципи на добрия UI Краткотрайната памет на човека, помни от 5 до 9 елемента Потребителите не чакат повече от 2 секунди - ако се наложи, предупредете ги. Достигане на информацията с не повече от 3 клика Разбираема навигация и easy to follow менюта Консистентност на бутоните Създайте чуство у потребителя, че той контролира интерфейса Структуриране на грешките Без излишна информация Thursday, 18 April 13
  19. 19. UX & UI Basics www.isavkov.net Благодаря, за вниманието! Thursday, 18 April 13

×