BBE: UX/UI и продуктовый дизайн
10.7K subscribers
2.47K photos
85 videos
17 files
928 links
⚫️ Канал школы дизайна и технологий Bang Bang Education, посвященный продуктовому дизайну: https://tinyurl.com/5xtc4jtj

Чат → https://t.me/+6kGcOtk2cUc4NTJi

Номер заявления в РКН: 5317852641
Download Telegram
Дизайн-конференция от Figma Config 2022

Конференция пройдет 10 и 11 мая, где примут участие более 100 спикеров из 20 стран мира — все выступят на Config впервые.

Регистрация бесплатная и доступна для всех желающих.

Команда Figma анонсировала и первую награду за вклад в развитие Community — Figma Community Awards. Призеров выберут сами пользователи через кнопку «Nominate» в строке загрузки файла.

С 14 до 22 апреля можно голосовать за неограниченное количество файлов и плагинов, а со 2 по 10 мая выбрать сильнейших в десяти категориях. Победителей объявят на самой конференции 11 мая.
25👍7
UX-задачка

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

Через один день, в среду, расскажем о решении, которое предложила Оля, студентка годовой программы «UX/UI: дизайн цифровых продуктов».

#uxзадачка
👍32🔥19🥰1
Оля Кузнецова, студентка 2 потока программы «UX/UI: дизайн цифровых продуктов», для решения поставленной задачи разработала приложение Collegia.

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

Об исследованиях
«Во многих компаниях отсутствует культура тимбилдинга, и основное общение между сотрудниками происходит во время обеда. Только тогда они могут поговорить не о работе и узнать что-то о коллеге как о человеке.

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

Многие респонденты, которые не могли найти коллегу для совместного обеда, вели себя почти одинаково: находили место, в котором могли чувствовать себя безопасно или побыть наедине с собой. Да и чувства были похожие: хотели оставить работу, ощущали себя белой вороной, будто их не принимают».

О приложении
«В итоге получилось приложение для совместных обедов — чем-то похожее на тиндер, но без романтического подтекста. Идея была такая: человек попадает в компанию, ему выдается рабочий логин и пароль, который позволяет зарегистрироваться в приложении. Никакие посторонние люди зайти не смогут — так сотрудник будет чувствовать себя безопасно.

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

Еще добавила возможность найти поблизости кафе, которое соответствует вкусовым предпочтениям человека. Это дополнительная функция, которая поможет сотруднику выбрать интересное место».

О защите проекта
«В основном мою работу проверяла Катя (продуктовый дизайнер в ЦИАН): она подсказала, что можно взять за референс Яндекс.Карты, а также предложила добавить карточки, где будет небольшие полезные статьи: “Как завести новые знакомства в офисе?” или “Вопросы для начала разговора”.

На предзащите Саша (старший дизайнер в Яндекс.Маркете) подсказала, что стоит изменить кнопку свайпа с сердечком на кнопку свайпа с бутербродом. Так точно не будет никакого романтического подтекста. На самой защите добавили, что можно ввести ограничения на свайпы, чтобы не было ситуаций, где человек за день пролистает все 100 человек».

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

Дизайн-навыки, безусловно, прокачались, так как в процессе изучила Human Interface Guidelines и применила их на практике. Ещё лучше поняла, как создать интерактивные макеты в Figma. В нем же я сделала иллюстрации — это тоже было полезно. Конечно же, улучшила и насмотренность, потому что изучала разные проекты, навигацию в них, заметила фичи, на которые раньше не обращала внимания».
37👍23🔥8🥰1
3 сервиса для юзабилити-тестирования от Ярослава Шуваева, преподавателя курса «UX/UI: от стратегии к прототипу».

UX Feedback
Платформа для сбора обратной связи от пользователей — подходит для больших проектов с оборотом в 250 000 уникальных посетителей в месяц. Для маленьких проектов интересно почитать кейсы сервиса, где продуктовые дизайнеры рассказывают о проблемах, которые негативно влияли на конверсию.

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

Яндекс.Взгляд
Более доступный сервис UX-тестирования с готовыми шаблонами, подойдет для небольших проектов. На сайте есть полезные инструкции по написанию пользовательских опросов.

→ Если вы хотите научиться определять стратегию продукта и проводить исследования, приглашаем на курс Ярослава, который начнется 16 мая. До 30 апреля действует скидка 25% на все курсы и интенсивы.
👍8
«Смелый креатив» — онлайн-интенсив о том, как легко придумывать нестандартные идеи, правильно их оформлять и преподносить.

За неделю пройдем весь путь — от принципов разработки идей с помощью креативных техник до питчинга клиенту и создания сильного портфолио. Практика будет построена на реальных брифах. Лучшие идеи презентуем маркетинговой команде «Яндекса».

Преподаватель — Александра Новохацкая, основательница и креативный директор студии «Яндекса» «7.47». В прошлом работала в международных агентствах (BBDO, Ogilvy). Обладательница наград Eurobest, Epica, ADCR, ADCE, Golden Drum, Red Apple, Effie, Cannes Lions, Webby и One Show.

Старт интенсива — 25 апреля, понедельник.
👍4
→ До 30.04 действует скидка 25% на курсы и интенсивы по всем направлениям школы.
7
Стратегия для продуктового портфолио

4 вопроса, которые помогут собрать релевантные кейсы.

Кто аудитория вашего портфолио?

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

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

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

Какую проблему решает ваше портфолио для этой аудитории?

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

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

В какой точке касания разместить портфолио?

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

Иногда лучше продублировать портфолио на Tilda, Readymag или вести LinkedIn для развития собственного бренда. Кейсы тестовых заданий или редизайны уже сущетсвующих сайтов можно размещать на Dribbble.

Какие метрики успеха у вашего портфолио?

Важно понять, чего вы ждете от своего портфолио — ленточек на Behance для повышения узнаваемости или трудоустройства. Поставьте реальные сроки для своей цели — например, найти работу в дизайн-студию в своем городе в течение 6 месяцев.

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

Еще одна метрика, которая поможет оценить уже рабочие кейсы — Monthly Active Users (MAU). Это количество активных пользователей, которых вы осчастливили своим дизайном: чем больше людей соприкоснулись с вашим решением, тем «тяжелее» портфолио. Поэтому начинающим дизайнерам советуем идти сначала в крупную компанию, пусть и с небольшой зарплатой, чтобы портфолио быстрее набрало вес.

→ Если вы хотите пополнить свой продуктовый портфель релевантным кейсом и защитить его перед реальным заказчиком, приглашаем на курс Ярослава, который начнется 16 мая. До 30 апреля действует скидка 25% на все курсы и интенсивы школы.
👍173
✦ Собрали подборку шорткатов Figma в одну кнопку — они быстро запоминаются, и с них легко начать знакомство с горячими клавишами.
🔥7👍2
Чем заняться на выходных? Подборка бесплатных материалов от ВВЕ

«Работа и дружба» — беседа с Алиной Ермаковой, UX Research Lead Sber Devices

О клиентоцентричном дизайне, закалке в «Студии Лебедева» и личности в цифровом мире. Если вы хотите улучшить свои навыки UX-исследования, приглашаем на курс Алины «Дизайн-мышление: от исследования к концепции продукта», который начнется 16 мая.

Эфир ВВЕ с Эйч о поиске работы за рубежом

Полезные ссылки и платформы, о которых рассказали на встрече, собрали в отдельный файл в Notion.

«Живой разбор» с Сергеем Королем, руководителем редакции в «Яндексе»

На вебинаре разобрали наполнение сайтов, портфолио дизайнера, макеты в Figma и статьи. Тех, кто хочет научиться легко писать хорошие тексты, приглашаем на курс Сергея «Текст: от статей до интерфейса», который начнется 11 мая.

Бесплатные курсы в «Дизайн-библиотеке»

Добавили уроки с годовых программ по иллюстрации и графическому дизайну.

→ До 30 апреля действует скидка 25% на все курсы и интенсивы школы и 20% на все годовые программы.
13👍4
Сегодня, завтра и всё.

Скидки на интенсивы, курсы, программыдо 25%

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

Иллюстрацию сделала для зина BBE Катя Цыганкова.
4
Расписание курсов по UX/UI-дизайну в мае

11 мая
«Текст: от статей до интерфейса» — научимся писать статьи, инструкции, рассылки и тексты для интерфейса. Будет полезно как практикующим копирайтерам, так и дизайнерам, которые хотят научиться самостоятельно наполнять сайт текстом.
Сергей Король

16 мая
«Дизайн-мышление: от исследования к концепции продукта» — поймем, как находить интересные инсайты, общаясь с пользователями, как на их базе проектировать решение и презентовать его своей команде.
Алина Ермакова

16 мая
«UX/UI: от стратегии к прототипу» — научимся выстраивать стратегию продукта, определять его сегмент и формулировать решения. В течение курса сделаем командный проект — интерактивный прототип и посадочную страницу.
Ярослав Шуваев
👍4
This media is not supported in your browser
VIEW IN TELEGRAM
Проблема: вы вставляете скрин целого лендинга или сайта, но в Figma качество становится сильно хуже.

Решение: установить плагин Insert Big Image. Откройте файл, куда нужно вставить скрин, нажмите правую кнопку мыши, затем Plugins и выберите Insert Big Image. Появится окно, где нужно нажать Choose Image Files и выбрать картинку.

Подсказка: чтобы делать скрин всей страницы, воспользуйтесь плагинами Scrnli или GoFullPage для Chrome.
28
Бесплатный вебинар «Бизнес-процессы и кризисное управление» от преподавателя ВВЕ и бизнес-консультанта Евгении Дацко

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

Регистрация
12 мая в 19:00

Евгения основала Artery.Agency, до этого руководила дизайн-департаментом в «РБК», где объединяла разрозненные дизайн-отделы в одну команду, повышая качество их работы. Оптимизировала процессы в «Учи.ру», 12storeez, Сo-Operation, Sulliwan Studio, Poisson Spot.
10
READ ME! — интерактивная статья от Readymag о верстке лонгридов в вебе

Платформа Медиум провела исследование и выяснила, что только 2 из 5 читателей доходят до конца текста. Авторы статьи, Цветелина Митева и Виталий Волк, предположили, что это связано не только с клиповым мышлением.

Проблема может заключаться в том, что контент на сайте просто сложно прочесть из-за плохой верстки. Статья рассказывает о базовых ошибках и как их исправить. В конце — 9 подсказок по улучшению читабельности длинных текстов.
16👍1
Бесплатный интенсив от Коли Иванова, эксперта по продуктам в Райффайзен Банке и преподавателя на годовой программе «UX/UI: дизайн цифровых продуктов»

Это первое мероприятие в рамках проекта «Воробушки» — двухдневный онлайн-интенсив, где начинающие дизайнеры узнают о базовых правилах и сделают свои первые работы.

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

Интенсив рассчитан на начинающих дизайнеров, которые уже умеют работать в Figma, но еще не углубились в изучение дизайн-базы.

Эфир пройдет 18 и 19 мая в 19:00 в Zoom. Ссылку пришлем в чат в день старта.
👍438🔥2
Кому пригодится дизайн-мышление, что это такое, и как оно поможет изменить свою жизнь?

Поговорили с Алиной Ермаковой, UX Research Lead в SberDevices и преподавателем на курсе «Дизайн-мышление: от исследования к концепции продукта».

Что такое дизайн-мышление?

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

Дизайн-мышление — только для дизайнеров?

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

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

Кому полезно освоить такой подход?

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

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

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

Что значит «пользоваться методологией» дизайн-мышления?

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

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

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

Чему ты хочешь научить студентов на своем курсе?

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

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

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

Присоединяйтесь к онлайн-курсу Алины по дизайн-мышлению, старт — 16 мая.
👍71
Обновления Figma после Config 2022
Вкратце расскажем, что нового в редакторе. Видео с выступлением СЕО Figma уже есть на YouTube.

Темная тема
Быстрый способ сменить тему интерфейса: нажать правую кнопку мыши > Quick actions > ввести «Dark mode» и выбрать тему в выпадающем списке.

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

Figma опубликовала видео-туториал по Auto layout и презентацию с инструкциями в Figma Community.

Обновленные компоненты
Больше не надо создавать отдельный вариант на каждое состояние компонента. Достаточно выбрать содержимое компонента, которые нужно сделать редактируемым, и превратить в Property. Text property в разделе Content позволяет менять текст, а Boolean property в разделе Layers — убирать/добавлять выбранный объект внутри компонента.

NB! Чтобы эти функции заработали, компонент должен быть настроен через Auto layout.

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

Минус, что такие настройки доступны далеко не у всех шрифтов, а если и доступны, то в английской раскладке.

​​✦ Анимация «пружина»
Новый вид анимации во вкладке Smart animate, который хорошо подойдет для всплывающих уведомлений. Подробная инструкция в блоге Figma.

Обновленная обводка
Обводку каждой сотороны фигуры теперь можно настраивать по отдельности. Работает для квадратов и прямоугольников.

Избранные файлы
Чтобы не терять файлы, можно добавить их в «Избранное», нажав на звезду рядом с названием. Они появятся в левой колонке в разделе Favourite files.

Обновленное приложение для десктопа
Вкладки с проектами теперь работают как в браузере: их можно закрепить через Pin tab или перетащить в отдельное окно.

→ Какие обновления стали для вас полезными, а какие кажутся лишними и ненужными? Поделитесь в комментариях.
👍254🔥2
This media is not supported in your browser
VIEW IN TELEGRAM
Добавили на Behance новые кейсы студентов курса «UI-анимация»

→ Если вы тоже хотите освоить Principle, Origami и продвинутую анимацию в Figma, присоединяйтесь к курсу «UI-анимация» со скидкой 25%. Старт — 1 июня.
19