Отличие веб-сервисов от сайтов и эволюция дизайна
Информация о продукте и работа с ней
Информация о продукте — это краткая информация. Чем лучше ты умеешь с ней работать, сортировать, делать подсказки, иконки, фотки, определять количество фоток в карусели, как это снято и написано текстом, какие плашки используются — это самая «мякотка» дизайна сегодня.
Отличие проектирования веб-сервисов от классического сайта
Раньше веб делился принципиально на лендинги (одностраничники) и информационные порталы (более сложная информационная архитектура). Потом стали подтягиваться маркетплейсы, которые, как правило, построены по механикам соцсетей. Соцсети — это большое направление, из которого выросли маркетплейсы (или наоборот: Amazon создан в 1994-м, а Facebook — в 2004-м).
Сервис WebArchive и эволюция интерфейсов
Для изучения истории интерфейсов полезен сервис WebArchive. Там можно посмотреть, как выглядел интерфейс 10 или 20 лет назад. Например, как выглядела Figma 10 лет назад — это колоссальный прорыв в дизайне. До Figma все механики взаимодействия среди дизайнеров и в продуктовых командах отсутствовали: дизайнеры, веб-мастера и разработчики были по отдельности. Дизайнеру давали задачу, он делал что-то в Photoshop, скачивал PSD-файл и отправлял его, а чтобы внести правки в код, нужно было открыть файл в Photoshop. Figma убрала все эти барьеры: файл доступен сразу в среде, прямо в браузере.
Тенденции в интерфейсах и пример анализа
Современная тенденция в интерфейсах — хороший визуал, построенный на микроинтерактивах. Это карточная сортировка, философия карточки, брендинг из систем, чистая верстка с правильным отступом. Инфографика подсвечивает информацию. Однако если на втором шаге не срабатывает клик (например, на кнопке «скачать бриф»), возникает конфликт: визуал не поддерживается логикой. Визуал и сценарий должны быть согласованы — чем лучше интерфейс захватывает и визуально, и логически, тем лучше.
Анализ визуала и логики интерфейсов
Спикер 1 отмечает, что в текущем сценарии визуал не поддерживается логикой: есть сценарий «скачать бриф», всё централизовано, но нажимать на блоки некуда, хотя интуитивно хочется. Карточная сортировка и информационный юнит не до конца понятны, но чистая верстка с правильными отступами и текстовыми мини-блоками, а также инфографика нравятся.
Далее спикер переходит к примеру Figma Education — ресурса, который он считает очень крутым. Он показывает, как Figma Education выглядит на его дашборде, и замечает небольшое несоответствие: при нажатии на «реформу» бегущая строка, по его мнению, лучше бы сработала на отбивке, чтобы не требовалось дополнительное усилие. Он предлагает сразу давать подсказку («международный фестиваль дизайна»), чтобы пользователь был спокоен, что не зря тратит время. В Figma, в отличие от текущего проекта, плашка «регистрируемся» и call to action («action in one») сразу захватывают в один клик — пользователь оказывается на Figma Events.
Спикер хвалит простой, чистый дизайн Figma и их маркетинг в LinkedIn (первый пост всегда от Figma). Он отмечает, что одно из больших направлений для текущего поколения — это конец работы анимационным дизайнером и дизайнером, который верстает посты. Веб движется в сторону шорткатов. Он рекомендует ресурс Shortcut (запомнить) для обучения: Figma Inside, Figma Product Update, Figma Make. Информация там дозированная, её интересно, полезно и приятно потреблять — это он называет «насмотренность».
Спикер видит у своих студентов высокий уровень логической и визуальной организации: белая плашка с подчеркиванием, выпадающие меню — всё понятно на интерфейсе. Для сравнения он упоминает курсовой проект дипломников «обучение служением служением», где делали digital для заказчика. Сравнение с лучшими практиками неуместно, но они хотя бы постарались. Это хороший проект под клиентскую задачу, сделанный вместе с заказчиком. Спикер просит прислать кейс и говорит, что его можно найти в его канале — подписывайтесь. Этим студенческим кейсом он может гордиться, так как для него главный критерий — работа.
Кейс «Сотри границы» и методика Painkiller/Delighter
Спикер 1 гордится кейсом «Сотри границы» — это не «студенческое, за что не стыдно», а работа, которой можно гордиться. Главный критерий для него — работа с заказчиком: в кейсе продуманы сценарии, согласованные с заказчиком. Визуально решение очень хорошо, потому что решает задачу сложного сегмента родителей, у которых «любой ребенок — это счастье в семье», а ребенок с особенностями — сложный кейс.
Этот кейс стал началом подхода для проектов Спикера 1: когда к нему приходят студенты, он просит нести «задачку с рынка, не тестовую» — хакатон, конкурс, реальную конкуренцию. Студенты понимают, что надо соответствовать требованиям рынка, приносят задачки, и они начинают их «разматывать» и решать. Этот подход трендовый и востребован.
Вопрос про целевую аудиторию и дизайн
Спикер 3 знакома с кейсом «Сотри границы» (заполняла документацию) и спрашивает: если целевая аудитория — 18–30 лет (новое поколение), не стоит ли для неё делать более креативный дизайн, а не простой?
Спикер 1 согласен: для более широкой возрастной аудитории дизайн делают проще, для меньшей — более красивым.
Секрет методики: Painkiller и Delighter
Спикер 1 раскрывает секрет методики: в вебе или цифровом дизайне продукт делят на Painkiller (снимает боль — покупка билетов, диагностика ребенка, четкий сценарий) и Delighter (самый яркий пример — Instagram: люди пытаются от него отделаться, но это «дешевый дофамин» и супер-развлечение, как TikTok для зумеров). Спикер 3 уточняет, что это диапазон между «здравым смыслом» и addiction (зависимостью).
Миссия фестиваля и польза для преподавателей
Спикер 1 спрашивает о миссии фестиваля, его искренности и пользе для преподавателей, подавших заявки.
Спикер 3 отвечает: это равнонаправленное движение. Глядя на трек продуктового дизайна и уровень работ, он делает пометки, идентифицирует ребят. Для него это «кроссопыление» (нетворк на вырост): если видит прилежных студентов, начинает за ними следить, давать подсказки, чтобы они вышли на нужный уровень. Пример: на «Сотри границы» две его дипломницы прошли фильтры — он их идентифицировал с самого начала и делал подсказки. С их стороны — это попытка посмотреть глазами студента-третьекурсника или четверокурсника. Он обращает внимание на такие вещи, если является для кого-то авторитетом. В качестве примера упоминает Анастасию, которая «очень большая молодец в плане коммуникации».
Коммуникация со студентами и языки
Выстраивание отношений со студентами
- Если у спикера выстраиваются отношения со студентами (например, на «Сотри границы» две его дипломницы), они проходят фильтры. Если бы он не идентифицировал их с самого начала, возможно, не делал бы столько подсказок, чтобы они вышли на этот уровень.
- Это кросс-опыление с его стороны. Со стороны студентов — попытка посмотреть глазами преподавателя, как если бы он был студентом-третьекурсником или четверокурсником.
- Если спикер является авторитетом для кого-то, он обращает внимание на такие вещи.
Пример студентки Анастасии
- Анастасия — большая молодец в плане коммуникации: отвечает быстро по существу, всегда внимательно.
- Говорит «спасибо», «пожалуйста», «здравствуйте», «до свидания».
- Спикер впервые познакомился с ней на курсе по портфолио и был сильно впечатлён тем, как она модерировала группу.
- Он понимает, кто такие зуммеры. Если в группе есть такой «вожак», он его выделяет и строит коммуникацию через такого человека. Он уделит больше внимания и даст больше подсказок такому человеку — больше шансов, что тот вырастет в профессии и как личность.
Правила общения в чате
- Если кто-то хочет обращаться к спикеру персонально, но вежливо, он всем говорит: «Ребята, спасибо, пожалуйста, и здравствуйте, до свидания» в чате — это маст.
- Если человек не соблюдает это, спикер может просто ничего не отвечать.
- Если он видит, что человек хорошо воспитан или стремится к этому, это мотивация участвовать в таком общении.
Важность кросс-опыления и связи поколений
- Если хоть какое-то кросс-опыление случается благодаря реформе, это очень круто.
- Для преподавателей нет «next generation» — получается, студенты уже «next», а преподаватели — «старое поколение». Важно сохранять эту связь.
- Если к преподавателям тянутся и хотят поддерживать связь, это показатель. Если преподаватель «уже не шаришь», к нему, наверное, никто не будет обращаться. А это важно в профессии.
Английский язык и англицизмы
- Спикер не считал, сколько англицизмов использовал за интервью (55 минут).
- Он предупреждает студентов, которые с ним не работали с первого курса, что на курсе используются англицизмы. Для него это шок-контент, когда пишут анонимный комментарий «какой токсичный» или «он хочет казаться умнее».
- Ответ на вопрос: если ты в интернешнл мире, то русский язык — великий и могучий, родной, наша гордость и достояние. Но он не так распространён в мире, и это его достоинство, потому что он сложный. Если кто-то хочет его выучить, это признак элитарности.
- Если ты, будучи русским по рождению и русскоговорящим, хочешь где-то конкурировать и получать работу, английский — это маст, просто пробук.
- Без английского на уровне мышления нельзя строить логические цепочки, запросы (prompt) в нейросеть, в поисковик или начинать живое общение.
- Спикер считает, что английский надо знать. Студенты: кто-то подхватывает быстро, кто-то теряется. Это подсказка.
- Второй язык — на выбор, но тоже полезно. Когда в голове начинаешь миксовать вербальные конструкции («А как это сказать по-английски? А как по-французски? А как по-испански? А как по-итальянски?»), это ключ к современному образованию XXI века, потому что практически все знания хранятся на серверах, а языки мы храним в голове. Чем лучше знаешь разные языки, тем больше шансов.
Портфолио дизайнера
- В дизайне всё конкретно и прикладно. Ты начинаешь делать своё портфолио.
- Портфолио можно складывать по разным папкам:
- Оффлайн-часть.
- Часть, выложенная на Behance (маст для любого дизайнера).
- Часть на личном сайте.
- Часть в Telegram-канале.
- Часть на ресурсах, где нужен доступ (например, на Яндекс.Диске — боевые, заряженные кейсы).
- Пример: сегодня общались с одной девушкой на тему позиции в стартапе. Есть сайт, LinkedIn — нет. Она сказала: «Я тебе попозже пришлю портфолио». Для спикера это показательно — человек сидит без работы, потеряла работу в классном месте. Чем круче портфолио, тем лучше. Курс по портфолио они делали с Настей, и она может это подтвердить.
Портфолио, выбор специализации и РЭУ
Портфолио — ключевой инструмент. Нужно иметь доступ к ресурсам (например, Яндекс.Диск) с «боевыми заряженными кейсами». Пример: человек потерял работу, но не прислал портфолио — это показательно. Чем круче портфолио, тем лучше; его нужно «полировать» много раз, выкладывая только лучшие кейсы, которыми можно гордиться в силу роста мастерства.
Архив с кейсами отправляется только при запросе клиента.
Выбор специализации: в профессии бывает неопределённость — ты больше аниматор, графический дизайнер или UI-дизайнер. Если в портфолио (например, на Behance) акцент идёт на графику или package (упаковку), это указывает на путь.
Package — низкий порог входа в профессию. Начинать можно с физического графического дизайна (упаковка) и постепенно расти. Сделать крутой digital сразу практически невозможно — нужно много знаний. Скилл (или great технически) растёт не резко.
Умение копировать — это не просто скопипастить, а продумать механику и интерактив, для чего нужно разбираться в теме. Для тренировки нужны деньги и время. Зарабатывать можно начать на паке (упаковке).
Реформа и кросс-опыление: в этом плане поможет РЭУ. Раньше были школы вроде Хутемас или Баухаус со своей тусовкой. Сейчас есть Британская школа дизайна, а РЭУ делает такую инициативу — это круто. РЭУ — университет экономики, а экономика всегда про деньги: любой проект начинается с денег.
О Британской школе дизайна: после изменений 2022 года уехали почти все хорошие преподаватели. Вопрос — есть ли сейчас, кто может нормально преподавать дизайн, или стоит идти в высшие школы вроде РЭУ.
Ответ: если в РЭУ будет больше таких студентов, как собеседник (с бэкграундом из Британки), это хорошо. В чужой монастырь со своим уставом не ходят — если интересно развивать российскую культуру и дизайн, надо опираться на генетический код и традиции.
У РЭУ — 120 лет архива, больше века традиции и наследия. С этими архивами можно работать и двигаться вперёд. Есть цифровой корпус, грамотная кадровая политика и классные методологии. Нравятся коллеги, с которыми чувство локтя. Бренд РЭУ — репутация на рынке: «ты закончил РЭУ — у тебя всегда будет нетворк, связи, ты сможешь найти своих» (как сквад).