Идеально! Как создать и переделать свой сайт. Правильный подход и передовые техники разработки (Стори, Уолтер) - страница 208
Использование схем дизайна также позволяет нам продолжить циклы дизайна, даже в то время, когда развиваются другие аспекты сайта. Это помогает нам прервать отживший рабочий процесс, который мы переняли из допечатной подготовки, и печатного дизайна для Интернета.
Одна схема вам известна:
При более гибкой работе дизайн может иметь место на различных этапах, иногда даже до того как будет завершено планирование или после того как начнется разработка. Таким образом, дизайн становится глубже интегрированным и продолжается в циклах разработки.
Мозайка стилей
Абстракция дизайна во впечатлениях и ощущениях от элементов – это нечто такое, о чем думает дизайнер Саманта Уоррен. Она называет эту технику мозайкой стилей.
Саманта поясняет[141]:
«Мозаика стилей – это визуальный трей из элементов цветовой палитры, текстурных узоров и цветовых вариантов, которые поддерживают цели клиентов. У меня есть шаблон в Photoshop со специально замаскированными участками, где […] я представляю образцы стилей клавиш, решения навигации и типографических возможностей».
Саманта считает эту технику эффективным средством коммуникации, так же как и для дизайна на уровне компонентов[142].
BOOTSTRAP
Для других, элементы страницы могут быть компоновочными блоками для будущего дизайна. Возьмем Марка Отто и Джейкоба Торнтона – тандем дизайнеров-разработчиков, которые работают в Twitter. Эти двое стоят за Bootstrap[144]. Интернет может быть безграничным, но контент у него есть всегда. Мы выражаем этот контент через соответствующие HTML-элементы:
• заголовки и их уровни от 1 до 6;
• параграфы, цитаты и элементы на уровне текста;
• списки: определения, нумерованный и ненумерованные;
• медиа: диаграммы, заголовки и изображения;
• таблицы;
• формы: кнопки, элементы и метки.
Так же как у Twitter есть своя сетка, так и Bootstrap включает в себя дизайн по умолчанию для «типографики, форм, клавиш, меток, сеток, навигации и остального». Bootstrap интересен по ряду причин. Не только потому, что это мощный шаблон для разработки, но и потому что в нем есть полный список HTML-элементов, вместе с несколькими стилями по умолчанию, что является идеальной отправной точкой для нового дизайна.
Рисунок 11.1. Сначала вы должны узнать, почему такие средства разработчика, как Bootstrap важны для отзывчивого рабочего процесса. Возможно, вы удивитесь, когда узнаете, что Bootstrap – это великолепная исходная точка для разработки элементов страницы
Вы на Дрибле?
Dribbble[145] – это сайт, где дизайнеры обмениваются маленькими скриншотами (максимум 400 на 300 пикселей) дизайнов, над которыми они работают.