Mockflow
Процесс работы с Mockflow
Для работы с сервисом нужно зарегистрироваться в системе и оформить тариф — можно использовать его полностью бесплатно или оплатить подписку, которая дает больше возможностей. Например, возможность создавать несколько рабочих пространств или интегрировать сервис с Jira, Slack, Trello или сервисами Google.
После регистрации нужно создать свое Рабочее пространство — достаточно уточнить название, но можно и оформить его под себя.
Когда пространство будет готово, можно перейти в Редактор сервиса — там и создаются все прототипы и дизайны. Функций для управления достаточно много, но они будут понятны всем, кто когда-то использовал Figma или Photoshop.
Как видно из скрина, пользователь может не только делать UI-прототипы, но и выбирать конкретный формат для своего прототипа и загружать собственные файлы для создания дизайна. Например, при выборе формата можно остановиться на обычном свободном макете, а можно выбрать формат документа, гайда, карты сайта и так далее.
Так как на базовой версии большинство шаблонов для макета недоступны, остановимся на свободном макете — при его выборе пользователь попадет в редактор.
В нем можно выбрать тип элементов — то есть стиль оформления всех шаблонов. Например, есть просто статичные фигуры, есть в формате скетчей.
Мы выбрали статичные формы для работы, и в элементах отразились различные фигуры, кнопки, фреймы для загрузки картинок, визуальные элементы вроде стрелок и линий, списки и так далее. Чтобы использовать элемент, нужно просто перетащить его на поле, изменить размер и стиль оформления, вшить ссылку по необходимости или добавить эффектов вроде тени. Удобно, что для каждого элемента указывается его CSS-код, который можно использовать при кодировании элементов.
В редакторе есть и другие разделы — это С траницы . Здесь можно управлять каждой страницей сайта, приложения или документа — удалять, добавлять новые или менять их местами.
Для управления есть и раздел Edit — в нем можно найти функции для отмены действия, копирования или дублирования файла и так далее.
Следующий раздел — это раздел с Изображениями , в котором можно добавлять свои картинки для проекта.
В разделе с Магазином можно загрузить отдельные элементы-шаблоны, а также полноценные страницы или сайты-шаблоны.
Последний раздел редактора — это Шаблоны , которые можно использовать для визуального представления любой информации. При этом их можно экспортировать.
Вывод