Школа
Вёрстка

В какой программе вы делаете макеты?

Иван Соколов
11 июля 2018
👁 7421   🗩7
Вёрстка

В какой программе вы делаете макеты?

Иван Соколов
11 июля 2018
👁 7421   🗩7
Михаил Нозик
Арт‑директор и автор курса «Типографика и вёрстка»
Полезно
 7
7
Непонятно
  
Войдите в Бюросферу, чтобы голосовать

Иван!

Мы работаем в Фотошопе, Скетче, Индизайне, Иллюстраторе и других программах. Конкретный выбор зависит от условий и задачи.

Общее визуальное решение удобнее всего собирать в Фотошопе. По сравнению с другими программами он гораздо меньше ограничивает фантазию. Дизайнер больше думает о том, чего он хочет добиться, а не как это сделать.

Индизайн очень хорошо подходит для многостраничных изданий или сайтов. Например, мы собирали в Индизайне макеты газеты «Учёт. Налоги. Право» и другие печатные издания. Ещё мы собирали в Индизайне макеты страниц нового сайта бюро, но при этом общее визуальное решение сначала нарисовали в Фотошопе.

Несколько последних клиентских и внутренних проектов нарисованы в Скетче. Он накладывает довольно много ограничений, но зато ускоряет передачу макетов в разработку.

Ещё осваиваем Фигму. В ней практически невозможно нормально придумывать дизайн, но довольно удобно собирать макеты, если есть наброски в Фотошопе. Зато есть совместное редактирование, резина и всякие ништяки для разработчиков.

Параллельно я приглядываюсь к Фреймеру , но пока не пробовал в нём что‑то сделать. Если у кого‑то есть опыт, то поделитесь.

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

А в чём работают уважаемые советчики?

P. S. Это был совет по средам о вёрстке и типографике в вебе. Хотите знать всё об интерлиньяжах, полях, отступах, кеглях, выравниваниях и модульных сетках? Присылайте вопросы.

Типографика в вебеС чего начать
Полезно
 7
7
Непонятно
  
Войдите в Бюросферу, чтобы голосовать
Отправить
Поделиться
Поделиться
Запинить
Твитнуть

Комментарии

> Ещё осваиваем Фигму. В ней практически невозможно нормально придумывать дизайн

Миша, можешь рассказать, почему?

Affinity Designer. Супервещь и не требует подписки. Ролик — https://www.youtube.com/watch?v=ybPzM1NO9lc

Сейчас перешёл на Фигму. Это рай после Шопа, он все‑таки больше для обработки картинок.

Стас, потому что очень много времени и сил уходит на то, чтобы хоть что‑то сделать. Даже просто поставить заголовок и текст. Или какой‑нибудь список сделать. А если нужно нарисовать иконку, то надо идти в Иллюстратор или Фотошоп — Фигма для этого совершенно не приспособлена. Или если хочется быстро попробовать сделать какой‑нибудь эффект на всю страницу. Или быстренько обтравить и поставить поверх заголовка фотографию. Для всех этих операций надо бегать в другие программы и много думать.

В Фотошопе об этом думать не нужно совсем.

Зато в Фигме компоненты, резина и другие ништяки рулят. Надеюсь, ребята поскорее прикрутят нормальное редактирование стилей текста и дадут цеплять внешние файлы как в Индизайне.

Окончательный макет собираю в Иллюстраторе.

Всё, что векторное, делаю в Иллюстраторе. Всё, что нельзя или сложно следать в Иллюстраторе, делаю в Фотошопе (коррекцию фото, растровые эффекты). Потом размещаю подготовленные объекты в Иллюстраторе.

Просто там проще и быстрее макетировать, накидывать варианты, выравнивать объекты. Можно быстро менять цвета объектов и сами объекты (символы, глобальные цвета в палитре и т. п.).

В июле в Фигме появились стили текста и цвета: https://help.figma.com/properties-panel/styles

Я использую Experience Design для прототипов и драфтов, люстру для создания иконок и некоторых элементов, фотошоп для картинок и работы с фотографией, а бумагу для дизайн‑идей.

Цель рубрики — обсуждение вопросов дизайна, веб-разработки, переговоров, редактуры и управления.
Комментарии модерируются. Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры.

Рекомендуем другие советы