Ищем разработчика, который без ума от JavaScript и клёвых анимаций
Дизайн
Собака Павлова
1965

Какие инструменты используют дизайнеры «Собаки Павловой»

Рассказываем про склад инструментов «Собаки Павловой», в котором графические редакторы занимают от силы десятую часть всего имущества. Только наша практика.

В закладки
Слушать

Аналитика

Когда мы только начинаем работать на проекте, у нас есть много вводных, но нет никакой системы. Их нужно где-то собирать, хранить и, внимание, обрабатывать. Просто складывать и смотреть — недостаточно. Мы используем облачные хранилища и специальные сервисы.

Наш фаворит — Google.Drive. Раньше был Dropbox, но отвалился. А «Яндекс.Диск» не прижился, хотя почтой «Яндекса» пользуемся только так. В Google.Drive можно хранить файлы и ссылки, писать тексты, создавать таблицы, шарить все что угодно. Мы им пользуемся каждый день, но все задачи он решить не может.

Google Drive

Так что Google Drive помогают два других инструмента для обработки вводных: Miro и AirTable.

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

Miro

AirTable — для тех, кто любит систематизировать информацию в табличном виде. Между таблицами можно проводить связи, а сами таблицы — превращать в канбан-доски или карточки.

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

AirTable

Другие инструменты применять не запрещено. Но эти три — самые важные для нашего процесса.

Концептуальное проектирование

В офисе мы используем бумагу, доску и стикеры.

Работает это так: дизайнеры встают у доски и начинают вместе рисовать. Иногда то же самое они делают на бумаге формата А3, но смысл остается тем же.

Концептуальное проектирование на доске

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

Стикеры с цветовым кодированием

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

Miro

Но реальность рассадила нас по квартирам, и теперь мы все же занимаемся концептуальным проектированием в связке Miro + DIscord. Первый позволяет вместе работать на одной доске, второй — находиться постоянно онлайн и созваниваться без необходимости кому-то набирать.

Достаточно зайти в один канал, и вот вы уже общаетесь. У Miro тоже есть возможности конференц-связи, но нам больше понравился Discord.

Поиск референсов

Когда нужно найти какой-то референс, мы идем сразу на знакомые ресурсы. Просто так ничего не гуглим — выйдет дольше.

Для мобильных интерфейсов ищем референсы на Mobbin, для веба — на Pinterest и «Контур.Гайдах».

«Контур.Гайды»

В одном из прошлых материалов мы рассказывали, что используем UI-киты из интернета. Чаще всего берем компоненты фреймворка Ant Design — там есть все, что нужно. Самое главное — в нем уже забиты все стили, а каждый элемент реализован в коде. Это здорово ускоряет работу и нам, и разработчикам. Вот пример проекта, о котором мы уже рассказывали на vc.ru.

Ant Design

Если заказчику нужно поменять цвета множества элементов или шрифты сразу везде, в Ant Design это можно сделать в несколько кликов.

Дизайн

Мы используем Figma. Это и так мощный инструмент, а с помощью плагинов он может заменить вообще все остальные сервисы.

Figma

Раньше мы использовали Axure, потом перешли на Sketch в связке с Invision, чтобы демонстрировать заказчикам интерактивные прототипы, иногда выгружали макеты в Zeplin.

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

Правда, мы все еще используем Miro. Для демонстрации и обсуждения дизайна он удобнее.

Общение с заказчиком

Презентуем дизайн в Miro или Figma, при этом обязательно созваниваемся в Скайпе и обсуждаем результаты с заказчиком. Просто ссылку на макеты не даем.

Письменно общаемся в Telegram, Skype и по почте. Созваниваемся в том же Skype или Zoom.

Командная работа

Письменно общаемся только в Slack. Голосом — только в Discord. Никаких почт, Telegram и Skype.

Поскольку мы практикуем именно командную работу, созваниваемся в Discord и вместе работаем в Miro или Figma.

{ "author_name": "Собака Павлова", "author_type": "self", "tags": [], "comments": 7, "likes": 32, "favorites": 124, "is_advertisement": false, "subsite_label": "design", "id": 132739, "is_wide": true, "is_ugc": true, "date": "Wed, 10 Jun 2020 17:54:38 +0300", "is_special": false }
Объявление на vc.ru Отключить рекламу
0
7 комментариев
Популярные
По порядку
Написать комментарий...
1

Как же много стало всего, с чем работать приходится...

Ответить
0

Ну... поэтому не так-то просто "войти вайти". 

Ответить
0

Что то новое что-то улучшенное старое, среди приложений много дублей потому не так уж много нового вводится.

Ответить
0

А какие плагины для фигмы используете?

Ответить
1

Добрый день.

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

Iconify для иконок, map maker для генерации карт, content reel и unsplash для прочего контента. Изучали возможности интеграции с Airtable, но пока не нашли ничего действительно простого и удобного. Если что-то посоветуете, будем благодарны.

Todo для текущих задачек на ближайший "спринт" еще нравится. 

Как видите, самое простое все.

Ответить
0

ну раз Евгений Романовский, то надо прочитать

Ответить
0

Интересно глянуть на содержимое доков в гугл драйве

Ответить

Комментарий удален

Комментарии

null