Выражай свои мысли правильно
 Публичный пост
15 апреля 2020     2854   

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

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

А выход прост — рисуй и черти.

Не умеешь рисовать?

Я тоже не умею, но есть отличные инструменты, которые помогают это делать.

Зачем нужно рисование?

Когда все части картины консистентны и видны только в одном месте, то сразу видно, что упущено, а что недосказано. К рисунку всегда можно вернуться, перерисовать, докинуть деталей. Рисунок можно переиспользовать в следующий раз.

Какие инструменты есть?

Мой любимый с недавних пор — excalidraw.com
Хорош тем, что простой как карандаш и бумага, но при этом безумно удобный, а самое главное — стильный. С таким стилем можно выглядеть очень крафтово и не банально (пока все не стали им пользоваться, лол).

Так выглядит, например, накиданный за 5 минут макет сайта-визитки.

site
site

Если кажется, что твой менеджер человек сухой и не одобрит каракули и крафтовость, то всегда есть другой инструмент, наверное, самый известный — draw.io

Хорош тем, что достаточно прост, известен и имеет кучу пресетов внутри. Я лично его не использую, ибо он перегружен возможностями.

Выглядит неплохо, но мне не нравится строгость, иногда хочется представлять, что мы все-таки ближе к художникам, а не к сантехникам:

drawio
drawio

Третий инструмент, которым стоит пользоваться чаще, это miro.com

Он похож на draw.io, однако удобство пользования намного выше.
К тому же, доступна работа в команде, что позволяет очень комфортно на удаленочке в команде подвигать схему и фиксировать все события на "бумаге".

miro
miro

Имеет огромное количество пресетов, так что грустно не будет.

Практики для начинающих

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

Блоки

block
block

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

User story

user story
user story

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

Основные приципы: верхние карточки это шаги пользователя, чем атомарнее тем лучше, а под ними сколько угодно карточек, которые задают вопросы, уточняют карточки, дополняют, короче все, что является полезным.

Лучше всего почитать первые 4 главы книги User story mapping, так как то что я описал не совсем user story, но сильно упрощенный вариант. Зайдет — усложняйте.

Mind map

Здесь я возьму miro, ибо он лучше всего подходит для этого.

mind
mind

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

Особых правил нет, просто развивай мысли и структурируй их, помогает найти решение в стиле out of the box.

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

Одному делать тоже здорово, помогает задать самому себе неудобные вопросы.

Выхлоп

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

Главное не забудь продать эту тему коллегам или близким, так они тоже смогут начать повторять столь простую и полезную практику, дает невероятный пинок культуре создания продуктов.

25 комментариев 👇
Михаил Санников, Продюсер потребительской электроники 27 апреля 2020

Использую Draw.io постоянно. Эта тула очень сильно изменилась за последние несколько лет. Для меня главное в ней: кроссплатформа, нет необходимости платить за каждый чих, экспортирует чистый pdf без сюрпризов. Интересно, что ты привёл draw.io в качестве скучной тулы для сантехников, но в скрине оттуда прекрасный в своей красоте и сложности пример до которого другим скетчам из поста далеко.)

Для маиндмапов давно использую coggle.it . Очень простой и позволяет работать со скоростью мысли не отвлекаясь на UI.

Говоря про UI: часто для объяснения кому-то «по-быстрому» использую Mermaid не выходя из VSCode.

  Развернуть 1 комментарий

Интересно, что ты привёл draw.io в качестве скучной тулы для сантехников, но в скрине оттуда прекрасный в своей красоте и сложности пример до которого другим скетчам из поста далеко.

Просто в 9 из 10 случаев draw.io это из пушки по воробьям, а так инструмент то тоже отличный.

  Развернуть 1 комментарий

Плюсую за draw.io: есть псевдонативное приложение для Мака, в интернете куча готовых наборов иконок (и можно свои создавать), не спамит никакими емейлами (в отличие от Миро), годится для энтерпрайзов: храни себе исходник в Шерпоинте (или что там у вас он-прем) и никто не переживает за утечку данных в облако, ну и интеграция с Конфлуэнсом.

  Развернуть 1 комментарий
Nikita Kulikov, Android Software Engineer 27 апреля 2020

Лично я использую балдежный инструмент - Плагин MindMap для IDEA

Удобно и в привычной среде.
Можно прикреплять картинки, даже оставлять mindmap прямо в папочке рядом с README.md в коде.

Плюс инструмент максимально тупой. Это прям плюс.

  Развернуть 1 комментарий
Влад, Управляю командой хотя все почему-то пытаются назвать это ресурсным менеджментом ;) 13 мая 2020

Когда речь заходит про диаграммы и совместную работы над ними (бывает и такое) мне всегда хочется порекомендовать посмотреть на такой инструмент как PlantUML (https://plantuml.com/)
Его основная прелесть заключается в том, что диаграмма описывается кодом (никакого мышкокликательства :) ), к примеру вот так:

@startuml
start
while (data available?)
  :read data;
  :generate diagrams;
endwhile
stop
@enduml

ну и получается вот так

  Развернуть 1 комментарий

Если кто любит кодом (или когда прям надо программно генерить), то ещё есть отличный же https://mermaid-js.github.io/mermaid/#/

Умеет хоть вот так:

  Развернуть 1 комментарий
Egor Ogarkov, Senior Software Engineer 27 апреля 2020

Из инструментов MindMap еще могу посоветовать http://tabula.online/ минималистичный, но крутой minmap-редактор, его пилит человек из ВКонтакте. Из особенностей у него как мне кажется крутая поддержка хоткеев и вообще работы с клавой.

  Развернуть 1 комментарий
Anna Devi, Веду управленку, иногда редактор 27 апреля 2020

Понравился excalidraw.com, спасибо!

  Развернуть 1 комментарий

А вот если по работе нужно что-то облачное нарисовать, чтобы солидно смотрелось, я пользуюсь cloudcraft.co


Вполне профессионально выглядит + можно сразу экспортировать в 2d и в документацию пихать.

  Развернуть 1 комментарий

Я тебе больше скажу, можно это сразу в Terraform экспортировать и задеплоить: https://modules.tf/

  Развернуть 1 комментарий
Дмитрий Фирсов, Координатор отдела продаж 31 мая 2020

За Excalidraw большое спасибо, думал, в чем нарисовать макетик для сайта-визитки/возможно блога - заходит на ура

  Развернуть 1 комментарий

@Shtihl, да, каждый новый сайт рисую в нем

  Развернуть 1 комментарий
Nikita Yudenkov, Backend Python Developer 27 апреля 2020

Спасибо за инструменты! Знал из этих всех только про draw.io

  Развернуть 1 комментарий
Dmitry Kochkin, Engineering Manager 28 апреля 2020

Кстати если не хочется рисовать, то Workflowy или любой иерархичный вложенный список - это и есть Mindmap.

  Развернуть 1 комментарий

да, в Dynalist даже есть такой режим

  Развернуть 1 комментарий

@pecheny, я бы глянул на картинку

  Развернуть 1 комментарий
Yulia Belozerova, Technical Program Manager 13 мая 2020

В копилку практик для повышения понятности, но про текст. Почитайте "Пиши, сокращай". Мне помогло писать не-душно.

  Развернуть 1 комментарий

Использовал в своё время SimpleMind для карт, а для очень быстрых макетов Balsamiq

  Развернуть 1 комментарий
Misha Mikheev, presale в B2B IT-компании 13 мая 2020

Для mindmap использую приложение iThoughts, в версиях под windows и ios.
https://www.toketaware.com/ithoughts-win
Нравится то что это не веб, простота и шустрость.

  Развернуть 1 комментарий
Rostislav Katin, Пишу бэкенды 14 мая 2020

Я в свое время перешел на lucidchart. По сути такой же комбайн, как и draw.io, только работать в нем приятнее. Но он и платный, что-то около $5 в месяц

  Развернуть 1 комментарий
Dmytro Filipenko, Fullstack Engineer 23 мая 2020

😱 Комментарий удален его автором...

  Развернуть 1 комментарий
Timur Valiev, Software Engineer 29 мая 2020

Собираюсь использовать excalidraw в ближайшее время. Его делает Christopher Chedeau (React, React Native, Prettier), коллега по фб из одного подразделения, так что я довольно часто вижу диаграммы сделанные в excalidraw :)

Вот тут его доклад на React Europe

  Развернуть 1 комментарий
Dmitry Gurinovich, Синьор Быкендер 31 мая 2020

Для любителей формата diagram-as-code есть клёвый Python пакет для рисования чартов:

https://diagrams.mingrammer.com/docs/guides/edge

  Развернуть 1 комментарий

Безусловно, эта статья больше про структуризацию информации без привязки к техническому контексту... но! Ещё есть Visual Paradigm, в нём присутствуют вообще все виды диаграмм, какие только можно представить. Её можно купить на торрентах, к слову.

  Развернуть 1 комментарий
Alexander Burluka, Софтваре девелопер 23 марта в 12:11

Интересно, что никто еще не упомянул скрайбинг. Я вот пытаюсь вкатиться, не знаю еще что получится в результате, но мне очень нравится рисовать человечков и всякие стрелочки с тенями. Умиротворяет, знаете ли :-)

  Развернуть 1 комментарий

@a-a-b, был хорший выпуск у подлодки про простые иллюстрации https://podlodka.io/170. Удивительно, но у них кажется получилось в подкасте внятно рассказать, что это и как можно научиться.

  Развернуть 1 комментарий

😎

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

Что вообще здесь происходит?


Войти  или  Вступить в Клуб