Начало работы с Draftium
Draftium — это чёрно-белый инструмент для создания макета вашего будущего сайта. С Draftium вы можете сфокусироваться на структуре и контенте, прежде чем перейдёте именно к дизайну.
Эта статья подскажет, как начать работать с Draftium и опубликовать свой первый прототип.
Зарегистрируйтесь или войдите в уже существующий аккаунт на Draftium.
Нажмите на Создать новый сайт в правом верхнем углу, чтобы открыть библиотеку шаблонов:
В новом окне вы можете выбрать пустой (продвинутый уровень) или готовый шаблон для любой бизнес-ниши. Обратите внимание, что некоторые шаблоны доступны только на Pro-подписке.
Подсказка: вы можете выбрать шаблон по категориям либо просто подобрать тот, который приглянулся. Все шаблоны на 100% поддаются редактированию, так что вы сможете подогнать их под себя.
Нажмите на Предпросмотр, чтобы рассмотреть содержимое шаблона детальнее, либо на Редактировать, чтобы начать с ним работать.
Если в целом шаблон вам подходит, вы можете сразу приступить к наполнению его контентом. Для этого выделите существующий текст и замените его на свой собственный.
Вы также можете изменить вид существующих блоков. Для этого откройте настройки всего блока либо колонки и попробуйте всё настроить под себя. Вот лишь некоторые из существующих настроек:
добавить/ удалить колонки в блоке;
изменить порядок колонок;
изменить отступы;
добавить дополнительные элементы — те, которых не было в блоке изначально (например, кнопки, изображения, иконки и т.д.).
Для того, чтобы добавить другие блоки, нажмите на иконку «плюс» и выберите подходящий в нашей библиотеке блоков. Нажмите на сам блок, чтобы он появился в редакторе:
Вы также можете немного подправить дизайн блока в его настройках, кликнув на «бегунок» в правом верхнем углу блока:
Здесь вы можете выбрать цвет или картинку для фона, а также анимацию. Помните, что Draftium это чёрно-белый инструмент, а потому вы можете выбрать только монохромные цвета.
Нажмите на контейнер для изображения, чтобы добавить своё собственное. Вы также сможете изменить размер контейнера, потянув за «рычаги» снизу. Чтобы изменить наложение цвета на изображение или добавить к нему ссылку, нажмите на «бегунок»:
Пока вы работаете в редакторе, все изменения сохраняются автоматически. Если вы хотите откатить изменения, нажмите на кнопку «назад» в редакторе. Это сработает, если вы отменяете изменения в пределах одной сессии:
Нажмите на Предпросмотр, чтобы проверить, как прототип будет выглядеть на разных устройствах.
Как только вы готовы опубликовать прототип, нажмите на Опубликовать. Делайте это каждый раз после внесения изменений, чтобы они отобразились на самом прототипе.
Эта статья подскажет, как начать работать с Draftium и опубликовать свой первый прототип.
Шаг 1. Выбор шаблона
Зарегистрируйтесь или войдите в уже существующий аккаунт на Draftium.
Нажмите на Создать новый сайт в правом верхнем углу, чтобы открыть библиотеку шаблонов:
В новом окне вы можете выбрать пустой (продвинутый уровень) или готовый шаблон для любой бизнес-ниши. Обратите внимание, что некоторые шаблоны доступны только на Pro-подписке.
Подсказка: вы можете выбрать шаблон по категориям либо просто подобрать тот, который приглянулся. Все шаблоны на 100% поддаются редактированию, так что вы сможете подогнать их под себя.
Нажмите на Предпросмотр, чтобы рассмотреть содержимое шаблона детальнее, либо на Редактировать, чтобы начать с ним работать.
Шаг 2. Редактирование шаблона
Если в целом шаблон вам подходит, вы можете сразу приступить к наполнению его контентом. Для этого выделите существующий текст и замените его на свой собственный.
Вы также можете изменить вид существующих блоков. Для этого откройте настройки всего блока либо колонки и попробуйте всё настроить под себя. Вот лишь некоторые из существующих настроек:
добавить/ удалить колонки в блоке;
изменить порядок колонок;
изменить отступы;
добавить дополнительные элементы — те, которых не было в блоке изначально (например, кнопки, изображения, иконки и т.д.).
Для того, чтобы добавить другие блоки, нажмите на иконку «плюс» и выберите подходящий в нашей библиотеке блоков. Нажмите на сам блок, чтобы он появился в редакторе:
Вы также можете немного подправить дизайн блока в его настройках, кликнув на «бегунок» в правом верхнем углу блока:
Здесь вы можете выбрать цвет или картинку для фона, а также анимацию. Помните, что Draftium это чёрно-белый инструмент, а потому вы можете выбрать только монохромные цвета.
Нажмите на контейнер для изображения, чтобы добавить своё собственное. Вы также сможете изменить размер контейнера, потянув за «рычаги» снизу. Чтобы изменить наложение цвета на изображение или добавить к нему ссылку, нажмите на «бегунок»:
Шаг 3. Публикация прототипа
Пока вы работаете в редакторе, все изменения сохраняются автоматически. Если вы хотите откатить изменения, нажмите на кнопку «назад» в редакторе. Это сработает, если вы отменяете изменения в пределах одной сессии:
Нажмите на Предпросмотр, чтобы проверить, как прототип будет выглядеть на разных устройствах.
Как только вы готовы опубликовать прототип, нажмите на Опубликовать. Делайте это каждый раз после внесения изменений, чтобы они отобразились на самом прототипе.
Обновлено на: 11/01/2023
Спасибо!