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.
Принципы композиции и модульные сетки при          проектировании сайтов  October, 7 2011  Мария Чайкина  Usabilitylab
Почему одни сайты кажутсяприятными и гармоничными,а другие нет?
ЗОЛОТОЕ    СЕЧЕНИЕ
1,618…
по горизонтали   1,618…
Числа и спираль Фибоначчи 1 1 2 3 5 8 13 21
Закон направления движения   От темного к светлому   Сохранение начатого направления движения   взгляда   Движение вдоль л...
Чего ты хочешь?   Кушать   Домой   Чтобы докладчик не мешал спать
МАСШТАБ &  РАЗМЕР  имеет значение
Понятно ли какого размера эти устройства?
КАКОЕ УСТРОЙСТВО БОЛЬШЕ?           А теперь?
Почему же мы это не показываем?
КАКОЕ УСТРОЙСТВО БОЛЬШЕ?Используйте указатели масштаба              В данном случае –              человек, держащий      ...
Исправляем
ЗАКОН   ОБЛИЗ СТИ
С кем эта девушка?
С кем эта девушка?Объекты, расположенные близко другк другу, воспринимаются связанно.                           *ководство
Что запостилpolotra_bora?
К чему относится ссылка   Драма “Близость”?
КОНТРАСТ
Контраст нужен, чтобыобратитьвнимание
Способы достижения контраста   Размер   Форма   Цвет   Расположение   Фактура и текстура
ФормаЦвет       Фактура и текстура
Вы можете прочитать текст?
МОДУЛЬНЫЕ    СЕТКИ
В удаве 38 попугаев. Попугай –это модуль сетки!*статья Алексея Черенкевича
Задачи сетки   Ускорение работы   Сбалансированность и пропорциональность   Ускорение и шаблонирование   Единообразность э...
Колончатая сетка
Модульная сетка с одинаковыми модулями
Модульная сетка с разными модулями
Берем «холст» шириной 980 px
Определяем микромодультекст
Определяем микромодуль
Создаем композицию
Создаем композицию
Создаем композицию
Thank you   Спасибо за внимание     Чайкина Марияm.chaikina@usabilitylab.net
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов
Upcoming SlideShare
Loading in …5
×

User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов

1,162 views

Published on

Доклад с конференции User Experience 2011

Published in: Design
  • Be the first to comment

User Experience 2011: Принципы композиции и модульные сетки при проектировании сайтов

  1. 1. Принципы композиции и модульные сетки при проектировании сайтов October, 7 2011 Мария Чайкина Usabilitylab
  2. 2. Почему одни сайты кажутсяприятными и гармоничными,а другие нет?
  3. 3. ЗОЛОТОЕ СЕЧЕНИЕ
  4. 4. 1,618…
  5. 5. по горизонтали 1,618…
  6. 6. Числа и спираль Фибоначчи 1 1 2 3 5 8 13 21
  7. 7. Закон направления движения От темного к светлому Сохранение начатого направления движения взгляда Движение вдоль линий и по указателям Взгляд идет туда, куда смотрит человек на фотографии Движение от более контарстных объектов к менее контрастным
  8. 8. Чего ты хочешь? Кушать Домой Чтобы докладчик не мешал спать
  9. 9. МАСШТАБ & РАЗМЕР имеет значение
  10. 10. Понятно ли какого размера эти устройства?
  11. 11. КАКОЕ УСТРОЙСТВО БОЛЬШЕ? А теперь?
  12. 12. Почему же мы это не показываем?
  13. 13. КАКОЕ УСТРОЙСТВО БОЛЬШЕ?Используйте указатели масштаба В данном случае – человек, держащий устройство, работает как Указатель масштаба
  14. 14. Исправляем
  15. 15. ЗАКОН ОБЛИЗ СТИ
  16. 16. С кем эта девушка?
  17. 17. С кем эта девушка?Объекты, расположенные близко другк другу, воспринимаются связанно. *ководство
  18. 18. Что запостилpolotra_bora?
  19. 19. К чему относится ссылка Драма “Близость”?
  20. 20. КОНТРАСТ
  21. 21. Контраст нужен, чтобыобратитьвнимание
  22. 22. Способы достижения контраста Размер Форма Цвет Расположение Фактура и текстура
  23. 23. ФормаЦвет Фактура и текстура
  24. 24. Вы можете прочитать текст?
  25. 25. МОДУЛЬНЫЕ СЕТКИ
  26. 26. В удаве 38 попугаев. Попугай –это модуль сетки!*статья Алексея Черенкевича
  27. 27. Задачи сетки Ускорение работы Сбалансированность и пропорциональность Ускорение и шаблонирование Единообразность элементов
  28. 28. Колончатая сетка
  29. 29. Модульная сетка с одинаковыми модулями
  30. 30. Модульная сетка с разными модулями
  31. 31. Берем «холст» шириной 980 px
  32. 32. Определяем микромодультекст
  33. 33. Определяем микромодуль
  34. 34. Создаем композицию
  35. 35. Создаем композицию
  36. 36. Создаем композицию
  37. 37. Thank you Спасибо за внимание Чайкина Марияm.chaikina@usabilitylab.net

×