Мы рассказывали, как с помощью модульного конструктора Tilda создавать отличные современные сайты. Но бывают ситуации, когда в голову приходит идея, которую не получается реализовать с помощью стандартных средств, встроенных в конструктор. Zero Block даёт возможность с лёгкостью спроектировать свой оригинальный блок.
Почему это круто
В редакторе Zero Block можно нарисовать что угодно и тут же опубликовать результат без участия верстальщика и программиста.
Любые элементы, произвольное расположение — никаких ограничений.
Так, как будто вы рисуете на бумаге. Только в вебе и очень быстро.
Редактор стал частью существующего интерфейса. В основе Tilda — модульная система: сайт собирается из готовых блоков, которые спроектированы дизайнерами. Редактор позволяет создавать свои блоки и комбинировать их с готовыми либо рисовать сайты с чистого листа. В любом случае сохраняется высокая скорость производства.
Для кого этот инструмент
Это инструмент для дизайнеров. Технически редактор освоить несложно. Но так как дизайн будет создаваться с нуля, потребуются профессиональные знания.
Специалистам, работающим с графическими редакторами, будут знакомы стандартные горячие клавиши и основные приёмы работы с объектами.
Как это работает
- Создаёте страницу в Tilda.
- Добавляете «нулевой блок».
- Создаёте дизайн.
- Настраиваете адаптивность.
- Сайт готов.
С чем можно работать
В редакторе можно добавлять и редактировать текст, картинки, в том числе фоновые изображения, простые фигуры (прямоугольник, круг, линию), видео, кнопки, формы захвата, всплывающие подсказки и HTML-код. Поддерживаются слои, поэтому объекты можно накладывать друг на друга.
Можно настраивать типографику (размер шрифта, его тип, насыщенность, межстрочное и межбуквенное расстояние), цвет, прозрачность элементов, добавлять тени и обводки, создавать эффект наведения для кнопок.
Внутри редактора есть стандартная для веба сетка из 12 колонок и 2 рабочие области: внутри сетки и внутри условного окна браузера. Все элементы могут быть привязаны либо к контейнеру сетки, либо к окну.
Адаптивность и отзывчивый дизайн
Zero Block позволяет адаптировать дизайн для всех типов экранов так, чтобы сайт хорошо отображался и на мониторе с диагональю 27 дюймов, и на iPhone 5.
В редакторе Zero Block можно настроить анимацию элементов разной сложности. С её помощью можно управлять вниманием пользователя, расставив акценты на странице.
В Zero Block есть два вида анимации — базовая и пошаговая. Базовая — это простая анимация, например, появление через прозрачность, параллакс по скроллу, фиксация и другие. Они часто применяются в веб-дизайне, поэтому чаще всего базовой анимации бывает достаточно. С помощью пошаговой анимации можно задать собственный сценарий движения по шагам и создать яркий сложный эффект.
Примеры дизайна, созданного с помощью редактора Zero Block
Лендинг редактора Zero Block:
Другие примеры: