Mockflow

— это сервис, который помогает создавать полноценные дизайны и прототипы для сайтов или приложений. С его помощью можно продумать интерфейс и сделать его уникальным. Пользователю дают много различных шаблонов для оформления. Можно использовать сервис в веб-версии, а также установить приложение на Windows и MacOS. Разберем все функции сервиса подробно.

---

Процесс работы с Mockflow

Для работы с сервисом нужно зарегистрироваться в системе и оформить тариф — можно использовать его полностью бесплатно или оплатить подписку, которая дает больше возможностей. Например, возможность создавать несколько рабочих пространств или интегрировать сервис с Jira, Slack, Trello или сервисами Google.

После регистрации нужно создать свое Рабочее пространство — достаточно уточнить название, но можно и оформить его под себя.

Когда пространство будет готово, можно перейти в Редактор сервиса — там и создаются все прототипы и дизайны. Функций для управления достаточно много, но они будут понятны всем, кто когда-то использовал Figma или Photoshop.

Как видно из скрина, пользователь может не только делать UI-прототипы, но и выбирать конкретный формат для своего прототипа и загружать собственные файлы для создания дизайна. Например, при выборе формата можно остановиться на обычном свободном макете, а можно выбрать формат документа, гайда, карты сайта и так далее.

Так как на базовой версии большинство шаблонов для макета недоступны, остановимся на свободном макете — при его выборе пользователь попадет в редактор.

В нем можно выбрать тип элементов — то есть стиль оформления всех шаблонов. Например, есть просто статичные фигуры, есть в формате скетчей.

Мы выбрали статичные формы для работы, и в элементах отразились различные фигуры, кнопки, фреймы для загрузки картинок, визуальные элементы вроде стрелок и линий, списки и так далее. Чтобы использовать элемент, нужно просто перетащить его на поле, изменить размер и стиль оформления, вшить ссылку по необходимости или добавить эффектов вроде тени. Удобно, что для каждого элемента указывается его CSS-код, который можно использовать при кодировании элементов.

В редакторе есть и другие разделы — это С траницы . Здесь можно управлять каждой страницей сайта, приложения или документа — удалять, добавлять новые или менять их местами.

Для управления есть и раздел Edit — в нем можно найти функции для отмены действия, копирования или дублирования файла и так далее.

Следующий раздел — это раздел с Изображениями , в котором можно добавлять свои картинки для проекта.

В разделе с Магазином можно загрузить отдельные элементы-шаблоны, а также полноценные страницы или сайты-шаблоны.

Последний раздел редактора — это Шаблоны , которые можно использовать для визуального представления любой информации. При этом их можно экспортировать.

---

Вывод

— полезный сервис для создания прототипов и дизайнов. Также он позволяет оформить различные документы, презентации, приложения или гайды. Шаблонов много, и их можно либо использовать в проекте, либо экспортировать, при этом есть возможность добавлять и свои собственные шаблоны и элементы.