{"id":4711,"title":"\u041f\u043e\u0434\u043a\u0430\u0441\u0442 \u043e\u0442 Mercedes-Benz \u043e \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044f\u0445 \u0441 \u0410\u043d\u0442\u043e\u043d\u043e\u043c \u041a\u043e\u043c\u043e\u043b\u043e\u0432\u044b\u043c","url":"\/redirect?component=advertising&id=4711&url=https:\/\/vc.ru\/promo\/263165-korotko-podkast-o-tehnologiyah-i-innovaciyah-ot-mercedes-benz&hash=c6f93899ff5e0c658ae71a18a81977a3309accf3b2bfd459f77ec74e37ef61d4","isPaidAndBannersEnabled":false}
Дизайн
ВКонтакте

Публикуем «Канон» — библиотеку знаний дизайнеров ВКонтакте

Всем привет, я Матвей Правосудов, старший продуктовый дизайнер ВКонтакте. Ранее мы делились нашей системой VKUI и описывали подход к оформлению приложения для iPad.

Сегодня расскажу о нашей внутренней базе знаний — как и почему она создавалась, о процессе сбора материалов и опыте использования. Как обычно, в конце статьи вас ждёт бонус — ссылка на публичную версию «Канона».

Год назад в департаменте дизайна было десять дизайнеров, сегодня нас уже 28. Мы стремительно расширяемся, и передавать знания в таком темпе становится сложнее. Недавно за один месяц должны были выйти пять новых дизайнеров — без «Канона» процесс адаптации занял бы тучу сил и ресурсов. Поэтому хочу обратиться к руководителям дизайн-команд — не переключайтесь, вам будет интересно!

Департамент дизайна ВКонтакте вне работы 😊

Всё началось с онбординга

В марте 2020 года Команда ВКонтакте ушла на удалёнку. Департамент дизайна начал адаптироваться: стали по максимуму использовать Figma, перевели еженедельное дизайн-демо в онлайн и участили созвоны, чтобы не терять живое общение.

Летом мы планировали взять стажёра в команду дизайна, а в команду e-commerce параллельно присоединялась дизайнерка. Нам впервые предстояло онбордить дизайнеров в режиме онлайн. В офисе всё было проще — настроили ноут, получили доступы, посмотрели на файлики, сходили за чаем и начали пилить задачу. Все вопросы разбирали сразу — достаточно было подъехать на стуле. С удалённой работой всё сложнее. Есть две большие проблемы:

1. Много знаний живёт в головах разных дизайнеров. Это так называемый bus-фактор — вряд ли наставник сможет сразу ответить на все вопросы новичка. В офисе дизайнеры сидят в одной комнате, поэтому ответ находится быстро.

2. Онбординг всегда проходил хаотично. У наставников не было понятного плана, что нужно сделать новичку и им самим, — вопросы решались по мере поступления.

К тому моменту в нашем Dropbox Paper уже было несколько документов с инструкциями по работе в Figma от Миши и Вани. Ещё была статья с серьёзным названием «Регламент для новичка» от Паши. Я предложил её переписать — добавить информацию про доступы и инструменты, ближе познакомить с командой и рабочим процессом.

Одна из первых версий онбординга для новичка

С этой статьёй мы успешно приняли на работу стажёрку и дизайнерку. Конечно, в тексте не оказалось всех ответов на возникающие вопросы, поэтому в ходе онбординга мы собирали обратную связь и улучшали документ. Все материалы объединили в дизайн-библиотеку, чтобы у сотрудников была единая точка входа в статьи и руководства. Так «Канону» было положено начало.

Первая версия дизайн-библиотеки

Сценарии и структура

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

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

Мы посмотрели на «Канон» как на продукт, у которого будут пользователи (дизайнеры) со своими сценариями, и выделили два самых популярных:

  • 👨‍🎓Я новичок и хочу понять, что вообще происходит. Нужен необходимый минимум информации, чтобы познакомиться с контекстом и приступить к первой задаче.
  • 🤔У меня конкретный запрос: как сделать иконку, заказать иллюстрацию, провести исследование? Возможно, человек никогда не создавал анимации, и у нас есть понятный гайд, как решить эту задачу.

Так как эти два сценария возникают чаще других, мы вынесли разделы максимально наверх. Сначала идёт пара статей для новичков, затем наш любимый раздел «Как?» — в нём собраны краткие, но ёмкие ответы на вопрос «как сделать X». Все остальные дополнительные инструкции находятся дальше по скроллу и не отвлекают.

Актуальная версия главной страницы «Канона»

Кроме онбординга и гайдов, мы систематизируем и лучшие практики разных команд, например:

  • созвоны с менеджерами и дизайнерами для обмена новостями;
  • «непродуктовый» день — когда ребята не работают с продуктовыми командами и занимаются другими задачами;
  • брейнштормы;
  • наставничество.

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

Как улучшаем

Иногда в процессах и инструментах что-то меняется. Например, ещё пару месяцев назад дизайнеры сами выгружали и готовили иконки для разработчиков под каждую платформу. Теперь мы приблизились к тому, что нужно выгружать всего одну иконку в SVG. Процесс изменился, и мы обновили документ про иконки.

Чтобы не упускать такие нюансы из виду, мы просим ребят оставлять комментарии в любых документах, где они видят ошибки и неточности. В «непродуктовые» дни я прорабатываю и исправляю эти замечания.

Самые честные люди — это новенькие дизайнеры во время испытательного срока.

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

В других компаниях я подсмотрел ещё одну крутую штуку — единый документ для наставника и новичка с понятными задачами на весь период испытательного срока со всеми важными ссылками. Мы реализовали эту идею у себя — понравилось и новичкам, и эйчарам 🤠

Шаблон персонального чек-листа для новичка. Работает ещё и для наставников: сразу понятен список задач на весь испытательный срок

«Канон» — это коллективный труд, в котором собраны знания самых разных дизайнеров. Вклад в библиотеку может внести любой сотрудник. Недавно Андрей сделал нам подарок — собрал целый раздел про анимации и законтрибьютил его в «Канон». Такое произошло в первый раз, и я надеюсь, что не в последний.

Раздел про анимации

Что нам это дало

«Канон» стал неотъемлемой частью онбординга, которая упрощает многие бытовые моменты. Сейчас к нам уже почти не приходят с вопросами, раскрытыми в доке.

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

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

Посмотреть своими глазами

Хватит слов! Вот публичная версия «Канона». Она, конечно, немного урезанная — всю внутрянку показать не можем. Чтобы увидеть все статьи и разделы, приходите к нам работать 😉

На что обратить особое внимание

Загляните в «Принципы проектирования продуктов». Это ДНК нашего подхода к дизайну и своеобразный мостик между дизайнерами и продактами, который помогает создавать качественные интерфейсы. Почитайте статьи в разделе «Как?», посмотрите «Лучшие практики». И давайте обмениваться опытом — делитесь своими подходами и лайфхаками в комментариях!

Чем «Канон» может быть вам полезен

Мы прошли через трудности, с которыми сталкиваются многие дизайн-команды, когда начинают расти или переходят на удалёнку. Наша база знаний — это место, где подробно описаны решения таких проблем. Пользуйтесь!

(Это мы)
{ "author_name": "ВКонтакте", "author_type": "editor", "tags": [], "comments": 37, "likes": 84, "favorites": 247, "is_advertisement": false, "subsite_label": "design", "id": 265595, "is_wide": true, "is_ugc": false, "date": "Fri, 02 Jul 2021 15:35:41 +0300", "is_special": false }
0
37 комментариев
Популярные
По порядку
Написать комментарий...
35

Cегодня нас уже 28

И что ни один из 28 дизайнеров не сказал, что прятать в приложении популярный раздел Список сообществ и Последние сообщества под всплывающую панель с дополнительным нажатием это плохая идея?

Как и замена кнопки Уведомлений на Тиктоки в нижней панели до этого.

Ответить
27

Тоже самое с музыкой - нахрена мне предлагать при входе каждый раз раздел шлако-рекомендаций, вместо перехода на таб "Моя музыка"? 
Я понимаю, что им похеру и шлак надо продвигать как-то, но BLEAT, ведь можно стейты последние запоминать, не? И где тут каноны? 
Я не говорю уже про невозможность отключить ebanie клипы, содержание которых отталкивает от использования социалки всё больше и больше. Впрочем, давно уже нашел спасение в спотифае, реддите и твиттере.

Ответить
3

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

Ответить
0

Все 0.0001% пользователей, которые воспользуются этой возможностью.

Ответить
14

При чем тут дизайнеры? Продакт решил так. А решил так, чтобы продвигать свой клон тик-тока. Цель поставлена, KPI надо растить.

Ответить
1

Добавили ленту новостей "a la" Яндекс Дзен. В какую же сраку превратился ВК :( Дизайнеры молодцы ребята, многое смотрю в их гайдах, спасибо что делитесь. Манагеры конечно же уничтожают продукт, убери ВК пиратский контент, как ему придет конец.

Ответить
0

Какая адовая бюрократия, господи. Это уже даже не смешно.

Ответить
13

Абсолютно любая новость про ВК: *выходит*
Гриша: АААААААААААААА!!!!

Ответить
6

Ну какая же это бюрократия?

Здорово, что знания передаются внутри компании и, в данном случае, за её пределами. Это помогает организовывать работу в компаниях так, чтобы всем было удобно и комфортно.

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

Ответить
6

Так а толку от этой работы, если продукт только хуже становится? Кажется, если бы последние несколько лет в ВК не работал никто кроме сисадминов, поддерживающих сервера в работоспособном состоянии, он был бы лучше.

Кстати, а что делают дизайнеры, когда всё уже задизайнено? И зачем их целых 28, откуда столько работы берётся в готовом продукте?

Ответить
2

В итоге по теме Канона ничего не написал, ушёл в дефолтное обсирание вк. Вопрос, нахрена ты им вообще пользуешься

Ответить
1

Потому что пока больше нечем. Но я надеюсь это исправить своим проектом.

Ответить
0

А зачем себя мучить? Я не пользуюсь и не мучаюсь. С одноклассниками переписываться?

Ответить
3

Нет, а чем пользоваться вместо ВК? Инстаграмом? Он ещё хуже. Фейсбуком? Тем более. Простите, но у меня нет жизни, без соцсетей я вообще кукухой поеду.

Ответить
2

А че ты там делаешь-то в этом вк

Upd. Все, понял вопросов нету

Ответить
0

Эмм. Я уверен что есть куда больше соцсетей, чем ты перечислил.

Ответить
6

И тем не менее, новичкам в дизайне и разработке будет полезно почитать о процессах, например. Там все довольно неплохо описано. 

Ответить
0

Гриш папей таблеток

Ответить

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

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

0

Статью наверное тоже по канонам писали)

Ответить
0

Все компиляторы сделаны с использованием компиляторов...

Ответить

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

8

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

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

Ответить
1

между желанием создать удобный интерфейс и задачами от начальников по внедрению/продвижению

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

Ответить
0

году в 2006-2007, будучи мелким шкетом каким-то макаром в вопросах и ответах мэйл.ру наткнулся на программиста Руслана, который тогда пилил java mail.ru агент. Я описывал проблему, он мне ответил и предложил потестировать новый билд. так на добровольных началах я ему помогал где-то с год отлавливать баги. причем плодотворненько так правили. а вот потом началось. сначала его заставили отчитываться каждый день за то, что он делает. потом ко мне приставили менеджера, у которого и без меня работы было дофига и срок исправления бага с 30-60 минут растянулся до 1-2х дней. ну а вишенкой на торте стали постоянные извинения программиста, который в течение месяцев отписывался в стиле "Да-да, я помню про эти баги, но у меня от начальства приоритет на внедрение какой-то лабуды из "моего мира"". так за 3-4 месяца из условных 50 багов было исправлено штук 5-10 и на сим я распрощался с тестированием. Подозреваю что ничерта не изменилось и до сих пор думаю, что 1 индивид в разы продуктивнее, чем индивид с вышестоящим начальством

Ответить
5

Стажерка... Ну ок... Дизайнерка?... 😂🤣😂
Ради пары одобрений от особо упоротых феменисток и ЛГБТ так обосрать русский язык... 🤨
Днище полное, Яша... 😔

Ответить
–4

Сразу видно, что правил русского языка вы не знаете

Ответить
5

Вы в 21 году придумали внутреннюю вики и ramp up план?

Ответить

Армейский волк

2

Подобные корпоративные каноны-хуены делают из голодных дизайнеров самоуверенных негибких жирдяев, которые потом на выходе "все знают".
И хер их потом на другой кухне переучишь. Знали-проходили :-(

Ответить
2

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

Мы как раз поэтому и не пишем гайдлайны по компонентам в том же объёме, в каком делают Apple (Human Interface Guidelines) и Material Design. Хоть и описание некоторых вещей упростило бы нам работу, позволяя не отвечать на одни и те же вопросы, но они бы создавали рамки дизайнерам, заставляя принимать правила как данность

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

Ответить
3

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

Не знаю, миф это или нет, но психологически мы способны держать в голове одновременно не более 3-5 объектов, а все эти супермусорные подменю действительно вызывают большие вопросы. Рассуждаю с дивана как пользователь, но так это выглядит для меня - руководству хочется урвать по всем направлениям, но разделять и властвовать не докумекало. В том и суть эволюции, телеграм, все дела. Чисто с эргономичной точки зрения мне удобен телеграм как ничто другое, почти все действия модно делать одной рукой, нет огромного меню, агрессивно-пассивной рекламы и навязывания подписки, но это уже вопрос не к вам. 

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

Ответить
2

Интересно, думала, что вконтакте гораздо раньше к этому пришли

Ответить
2

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

Потребность и потенциальную пользу начали ощущать при переходе на удалёнку в марте год назад и при росте команды 

Ответить
2

28??? 28 человек не могут сделать приличный дизайн?? Пздц..

Ответить
1

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

Ответить
0

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

Ответить
0

А когда вы деньги зарабатываете для компании?))

Давайте я переведу на русский фрагмент статьи за вас.

Мой вариант:
Кроме инструкций, в которые можно вставить фио, чтобы назвать это модным онбордингом, мы обязательно тратим рабочее оплаичваемое время на:
Общение на посторонние темы с коллегами
День в неделю на неключевые непродуктовые задачи
Отдельно собираемся подумать все вместе, хотя как? Если это все чаще встреча онлайн))
Наставничество, чтобы 2 сотрудника тратили время, а не 1. Наш онбординг не справляется с задачей обучения новичков на 100 процентов, нужен еще наставник. Благодаря такому подходу мы не успеваем выделять время на ключевые задачи с примерно одинаковой скоростью в компании.

А вот как было у вас:

Кроме онбординга и гайдов, мы систематизируем и лучшие практики разных команд, например:

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

Ответить

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

0

Какие молодцы! Классная штука 👍 Утащу к себе.

Ответить
0

Канонка!!! Канонка где???!!!1!!1!! Негоже в такой прогрессивной команде дизайнеркам и стажеркам без канонки то онбордить.

Ответить
Читать все 37 комментариев
База данных ClubHouse с 3.8 млрд записей выставлена на продажу

Полная база данных номеров ClubHouse была выставлена на продажу в даркнете.

OZON самоустраняется при проблеме с возвратом несоответствующего описанию товара

Очень нравится сервис OZON - пункт доставки рядом с домом и в Самаре и в Питере, удобное приложение, но! Есть существенная проблема с процессом продажи у Партнеров магазина - очень хочется его поправить, чтобы и вам и мне было удобнее и спокойнее. Помогите, пожалуйста, советом.
Смысл кратко:
Если покупаешь у партнера Озон и возникает проблема, то…

«Тинькофф» перестал начислять кэшбек по спецпредложению за покупки во «Вкусвилл»

В июле доступно спецпредложение — кэшбек 10% во Вкусвилл. «Тинькофф» деактивировал его и перенес дату окончания.

«Стартап-полка»: Самокат набирает производителей альтернативных продуктов

Онлайн-ритейлер Самокат совместно с Ассоциацией Производителей Альтернативных Пищевых Продуктов объявляют сбор заявок от инновационных производителей продуктов для участия в «стартап-полке» Самоката. Лучшие продукты попадут в постоянный ассортимент Самоката в раздел «Супермаркет» уже этой осенью.

Что случилось со средним классом в США и есть ли пузырь на рынке недвижимости?

Raul Elizalde, contributor «Форбс», приводит ряд аргументов и графиков, что пузыря в отличие от краха доткомов и ипотечного кризиса 2008г сейчас нет. Потому что заемщиков выбирают тщательнее, банки в лучшем состоянии, а главное, что переизбытка жилья нет, поскольку темпы строительства резко упали после кризисов.

На конференции «B Word» Илон Маск в очередной раз поменял свою позицию по биткоину

В ходе конференции где также присутствовали Джек Дорси и Кэти Вуд, Маск отметил, что он является владельцем биткойнов не только через баланс Tesla и SpaceX, но и лично владеет биткойнами, эфиром и Dogecoin.

Восточная Техника успешно автоматизирует процессы управления складами на базе решения Columbus-WMS
Какие агро-стартапы получили больше всего инвестиций за июль 2021

Общая сумма финансирования проектов из подборки почти $800 млн.

Карьерный путь IT-инженера: от Долины к стабильной британской компании через стартапы и психотерапию

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

LTE на даче

Небольшой очерк без лишних технических деталей о подключении дачи к 4G интернету.

Можно ли продолжать работать в той же компании после выгорания: история продакт-менеджера Тинькофф

В Тинькофф — 28 000 сотрудников, и у каждого своя история. Кто-то легко справляется с работой, и после всех задач спокойно отключается и идет отдыхать. Другим все может даваться труднее, даже сложно в уйти в отпуск — думает, «как я всё здесь брошу». Мы начинаем серию статей от лица наших сотрудников, которые делятся своим опытом: какие появлялись…

null