Принципы дизайна

Соблюдение может гарантировать
"приличный" результат при
минимальных затратах.
Кадочникова В.И.
«Учебная книга»
Принцип единства формы и
содержания
Основные понятия:
•Пространство (размер,
пропорции, плотность,
размещение)
•Форма
•Цвет
•Текстуры
•Шрифт
Кадочникова В.И.
«Учебная книга»
Пространство
(размер, пропорции, плотность, размещение)
Функции дизайнера:
1. Структурирование
содержимого: сведение к
минимуму числа групп, на
которые разлагается
содержимое.
2. Выбор средств для
отображения содержимого:
каждое новое средство
Пример как не надо
Пример как надо
усложняет композицию.
3. Размещение, выравнивание уменьшение общего
количества вертикалей и
горизонталей.
Кадочникова В.И.
4. Панели навигации.
«Учебная книга»
Фокусировка
Либо один фокус.
Либо выстраивается иерархия фокусов:
на каждом уровне свой фокус
Кадочникова В.И.
«Учебная книга»
Форма
1. Избегайте пестроты форм.
Один закругленный угол
требует закругления всех
остальных.
Пример
Скругленных форм
2. Академический стиль. В
основе лежит логическая
Пример
разметка документа.
Академического стиля
Внешний вид в браузере
является побочным
эффектом.
Выбирается вид:
- цвет фона,
- цвет основного текста,
- цвет заголовков,
Кадочникова В.И.
- цвет ссылок.
«Учебная книга»
Достоинства
Академического стиля
минимум затрат по
времени;
не зависит от выбора
браузера;
не раздражает при
просмотре;
не устаревает при
дальнейшем развитии
HTML.
Кадочникова В.И.
«Учебная книга»
Цвет
Определяется набор 2-4-х
цветов.
• Берите контрастные, но
сочетаемые цвета (2
холодных или 2 теплых)
• Фиксируйте основной цвет
композиции: фон - более
светлый оттенок, текст более темный (или наоборот);
декор - более насыщенный
Кадочникова В.И.
«Учебная книга»
Текстура
• Фото хорошо сочетается
с плоской - одноцветной
или градиентной
заливкой.
• Материальную текстурную заливку
лучше не использовать
на сайте.
Кадочникова В.И.
«Учебная книга»
Шрифт
Примеры шрифтов:
•
•
•
•
Мама мыла раму
Мама мыла раму
Мама мыла раму
Мама мыла раму
Используйте 1 шрифт с
засечками и 1 рубленый.
Не забывайте о привносимых
элементах (например, логотипах)
Кадочникова В.И.
«Учебная книга»
Принцип баланса
Информация
Цвет
Текстура
Шрифт
"Единство и баланс - два главных
свойства, отличающих творения
человека от созданий природы.»
плотность в центре
При отходе от центра требуется противовес
(правило рычага)
Наибольшая плотность по одному
аспекту может не совпадать с
плотностью по другому аспекту. Но
это несовпадение должно как-то
быть связано. При балансировке по
нескольким аспектам часто
требуется соединить оси баланса.
Кадочникова В.И.
«Учебная книга»
Принцип контраста
Одномерный контраст (по
размеру)
Многомерный контраст (по
размеру, цвету, форме)
Следите, чтобы композиция не
• Размер - относительный контраст.
• Расстояние между объектами чем оно больше, тем быстрее
теряются связи.
• При контрасте цвета - всегда
остается что-то общее.
• Текстура - противопоставление
фото и плоской текстуры.
• Шрифт - любые два шрифта
контрастны. Связь- постоянное
использование шрифта в данном
аспекте.
• Форма - как связующий элемент
развалилась.
Кадочникова В.И.
«Учебная книга»
Принцип динамики
"Лишенная какой бы то ни было динамики вещь покажется
скучной и безжизненной»
Под принципом динамики
понимаем динамику
восприятия, движение глаз и
сознания при изучении
страницы.
Приемы динамики:
• Изображение объекта,
которому по природе
свойственно движение.
•
Размывка в движении.
• Анимация.
• Динамика загрузки.
• 5. Динамика традиционного
восприятия.
Кадочникова В.И.
«Учебная книга»
Принцип нюансировки
"Тщательная нюансировка - главное отличие работы
профессионала от упражнений любителя"
• Нюанс - едва заметный
оттенок, тонкое различие.
Кадочникова В.И.
«Учебная книга»