FFDDFD Design Conf 2022
30 сентября Тинькофф проведёт бесплатную конференцию о дизайне в продуктовой компании.
Дизайнеры соберутся в Москве, в Collector Gallery по адресу: Михайловский проезд, 5. Это обширное индустриальное пространство на месте бывшего хранилища воды.
Будет онлайн-трансляция из главного зала.
Темы
- Дизайн-менеджмент: почему не всем нужно становиться дизайн-лидами
- Карьера: почему дизайнеры не могут найти работу
- Процессы: о консистентности в дизайне Aliexpress
- 3D: Как в Тинькофф автоматизировали работу с 3D-иллюстрациями
- Брендинг инхаус: Зачем большим компаниям бренд-дизайнеры
Получить билет или ссылку на трансляцию:
Зарегистрироваться →
Регистрация открыта до 25 сентября.
@slashdesigner #полезная_реклама #для_профи #анонсы
30 сентября Тинькофф проведёт бесплатную конференцию о дизайне в продуктовой компании.
Дизайнеры соберутся в Москве, в Collector Gallery по адресу: Михайловский проезд, 5. Это обширное индустриальное пространство на месте бывшего хранилища воды.
Будет онлайн-трансляция из главного зала.
Темы
- Дизайн-менеджмент: почему не всем нужно становиться дизайн-лидами
- Карьера: почему дизайнеры не могут найти работу
- Процессы: о консистентности в дизайне Aliexpress
- 3D: Как в Тинькофф автоматизировали работу с 3D-иллюстрациями
- Брендинг инхаус: Зачем большим компаниям бренд-дизайнеры
Получить билет или ссылку на трансляцию:
Зарегистрироваться →
Регистрация открыта до 25 сентября.
@slashdesigner #полезная_реклама #для_профи #анонсы
Adobe покупает Figma 💔
Сегодня CEO Figma Дилан Филд объявил о том, что подписал сдьяволом Adobe соглашение о продаже Figma.
Adobe в рамках соглашения приобретает компанию за 20 миллиардов долларов. Ожидается, что транзакция завершится в 2023 году. До этого момента Figma будет функционировать независимо от Adobe. Условия сделки ещё могут поменяться.
Пост в двух словах: Figma как продукт может и не пострадает, но в долгосрочной перспективе платить Adobe мы все будем больше, потому что это Adobe, детка.
По моему мнению, Adobe — это абсолютное корпоративное зло, альтернативой которому долгое время были Sketch и Figma. Лицензии очень дорогие, а продукты имеют устаревший UI, крайне медленно развиваются и имеют ужасную програмную оптимизацию. Платная подписка на полный пакет Creative Cloud для одного пользователя стоит 54$ в месяц, а для команд — 84$.
Figma — это большая компания со своей культурой, во главе которой по-прежнему остаётся Дилан, и это вселяет определённые надежды, что продукт не будет испорчен быстро. Во всяком случае, пока Дилан и Figma имеют автономию. Как руководитель он вряд ли будет делать что-то, что явно вредит Фигме как бизнесу, который он развивал последние 10 лет. Я доверяю Дилану, потому что он сделал тот самый редактор, который мы так любим. Но абсолютно не доверяю корпоративной культуре Adobe. И рано или поздно мы почувствуем дух Adobe в Figma, теперь это неизбежно.
По кому это может ударить?
Главный вопрос, который интересует маленьких фрилансеров, не желающих платить за Фигму — останутся ли бесплатные аккаунты. По заверениям Дилана, они не планируют менять тарифные планы. Но есть важное дополнение, что Figma останется бесплатной в образовательных целях. Учитывая, как Adobe любит деньги, мы можем легко оказаться в Фигме без привычных нам фич, которые могут оказаться за рамками определения «образовательные цели». Например, можно легко отрубить возможность экспорта ассетов или ввести лимит на количество фреймов в файле. Не буду плодить слухи, это только примеры того, что можно сделать, оставив аккаунт номинально бесплатным.
Другая большая группа людей, которая может пострадать от такого приобретения — это россияне. Как известно, из-за войны в Украине Adobe приостановила продажи новых лицензий россиянам. Действуют только ранее оформленные. Если Figma станет одним из продуктов Adobe, очень вероятно, что они будут использовать основной адобовский платёжный шлюз и политику дистрибуции. Сейчас со стороны Figma никаких ограничений на использование продуктов для россиян нет, а у Adobe, насколько заявлено, есть.
Кто от этого выиграет?
Стратегически выиграет Adobe, потому что серьёзных альтернатив парочке Figma + Experience Design на текущий момент на рынке нет. Однако, такое не может продолжаться долго и новые свежие продукты смогут составить конкуренцию.
Пользователи с платными аккаунтами Figma категории Professional и выше получат гораздо лучшую интеграцию между Figma и динозаврами Adobe: Photoshop, Illustrator, Premiere Pro, Lightroom, InDesign и After Effects. Очень вероятно, что растровые слои в Фигме можно будет на лету открыть в Photoshop для фото-манипуляций или перекинуть на анимацию в Афтер без всяких костылей вроде Figma2AE. Для дизайнеров может быть также важно, что в рамках Creative Cloud им будут доступны хорошие кириллические шрифты.
Очень вероятно, что Figma будет доступна в рамках Adobe Creative Cloud и те, кто уже сидят на этой подписке, перестанут отдельно платить за Фигму.
Вывод: на ближайшем горизонте ничего не изменится и даже станет лучше. Мы получим интеграцию Фигмы в экосистему Adobe. В долгосрочной перспективе мы будем вынуждены пользоваться продуктами Adobe и платить за Фигму больше.
@slashdesigner #для_профи #Figma #Adobe
Сегодня CEO Figma Дилан Филд объявил о том, что подписал с
Adobe в рамках соглашения приобретает компанию за 20 миллиардов долларов. Ожидается, что транзакция завершится в 2023 году. До этого момента Figma будет функционировать независимо от Adobe. Условия сделки ещё могут поменяться.
Пост в двух словах: Figma как продукт может и не пострадает, но в долгосрочной перспективе платить Adobe мы все будем больше, потому что это Adobe, детка.
По моему мнению, Adobe — это абсолютное корпоративное зло, альтернативой которому долгое время были Sketch и Figma. Лицензии очень дорогие, а продукты имеют устаревший UI, крайне медленно развиваются и имеют ужасную програмную оптимизацию. Платная подписка на полный пакет Creative Cloud для одного пользователя стоит 54$ в месяц, а для команд — 84$.
Figma — это большая компания со своей культурой, во главе которой по-прежнему остаётся Дилан, и это вселяет определённые надежды, что продукт не будет испорчен быстро. Во всяком случае, пока Дилан и Figma имеют автономию. Как руководитель он вряд ли будет делать что-то, что явно вредит Фигме как бизнесу, который он развивал последние 10 лет. Я доверяю Дилану, потому что он сделал тот самый редактор, который мы так любим. Но абсолютно не доверяю корпоративной культуре Adobe. И рано или поздно мы почувствуем дух Adobe в Figma, теперь это неизбежно.
По кому это может ударить?
Главный вопрос, который интересует маленьких фрилансеров, не желающих платить за Фигму — останутся ли бесплатные аккаунты. По заверениям Дилана, они не планируют менять тарифные планы. Но есть важное дополнение, что Figma останется бесплатной в образовательных целях. Учитывая, как Adobe любит деньги, мы можем легко оказаться в Фигме без привычных нам фич, которые могут оказаться за рамками определения «образовательные цели». Например, можно легко отрубить возможность экспорта ассетов или ввести лимит на количество фреймов в файле. Не буду плодить слухи, это только примеры того, что можно сделать, оставив аккаунт номинально бесплатным.
Другая большая группа людей, которая может пострадать от такого приобретения — это россияне. Как известно, из-за войны в Украине Adobe приостановила продажи новых лицензий россиянам. Действуют только ранее оформленные. Если Figma станет одним из продуктов Adobe, очень вероятно, что они будут использовать основной адобовский платёжный шлюз и политику дистрибуции. Сейчас со стороны Figma никаких ограничений на использование продуктов для россиян нет, а у Adobe, насколько заявлено, есть.
Кто от этого выиграет?
Стратегически выиграет Adobe, потому что серьёзных альтернатив парочке Figma + Experience Design на текущий момент на рынке нет. Однако, такое не может продолжаться долго и новые свежие продукты смогут составить конкуренцию.
Пользователи с платными аккаунтами Figma категории Professional и выше получат гораздо лучшую интеграцию между Figma и динозаврами Adobe: Photoshop, Illustrator, Premiere Pro, Lightroom, InDesign и After Effects. Очень вероятно, что растровые слои в Фигме можно будет на лету открыть в Photoshop для фото-манипуляций или перекинуть на анимацию в Афтер без всяких костылей вроде Figma2AE. Для дизайнеров может быть также важно, что в рамках Creative Cloud им будут доступны хорошие кириллические шрифты.
Очень вероятно, что Figma будет доступна в рамках Adobe Creative Cloud и те, кто уже сидят на этой подписке, перестанут отдельно платить за Фигму.
Вывод: на ближайшем горизонте ничего не изменится и даже станет лучше. Мы получим интеграцию Фигмы в экосистему Adobe. В долгосрочной перспективе мы будем вынуждены пользоваться продуктами Adobe и платить за Фигму больше.
@slashdesigner #для_профи #Figma #Adobe
Figma
A New Collaboration with Adobe | Figma Blog
Today, we’re announcing the exciting news that Figma has entered into an agreement to be acquired by Adobe.
Мобилизация
1. Медуза: Куда бежать из России прямо сейчас.
2. Холод: Гайд по экстренной эмиграции. Зеркало.
3. Список из 100+ локальных эмигрантских чатов: @tele_360chat.
4. Напоминаю, что у /designer есть маленький канал @designopenings с вакансиями за рубежом. Все вакансии актуальны и их качество проверено мной лично.
5. Также есть хороший проект про карьеру на международном рынке: @agilefluent. Помогают с резюме и с получением оффера.
Уезжающим
Куда ты планируешь? Какие вопросы у тебя сейчас? Какая информация о выбранной стране тебе могла бы помочь?
Уехавшим
Куда удалось выехать? Как прошла адаптация? Можешь ли оказывать какую-либо помощь тем, кто едет только сейчас? Давай координироваться и помогать другим.
Не про эмиграцию, но в тему: если тебе пришла повестка, юрист Павел Чиков из Агоры составил FAQ для мобилизуемых. Про отсрочки.
Обращаю внимание на то, что комментарии публичны и следует проявлять осторожность.
@slashdesigner #эмиграция
1. Медуза: Куда бежать из России прямо сейчас.
2. Холод: Гайд по экстренной эмиграции. Зеркало.
3. Список из 100+ локальных эмигрантских чатов: @tele_360chat.
4. Напоминаю, что у /designer есть маленький канал @designopenings с вакансиями за рубежом. Все вакансии актуальны и их качество проверено мной лично.
5. Также есть хороший проект про карьеру на международном рынке: @agilefluent. Помогают с резюме и с получением оффера.
Уезжающим
Куда ты планируешь? Какие вопросы у тебя сейчас? Какая информация о выбранной стране тебе могла бы помочь?
Уехавшим
Куда удалось выехать? Как прошла адаптация? Можешь ли оказывать какую-либо помощь тем, кто едет только сейчас? Давай координироваться и помогать другим.
Не про эмиграцию, но в тему: если тебе пришла повестка, юрист Павел Чиков из Агоры составил FAQ для мобилизуемых. Про отсрочки.
Обращаю внимание на то, что комментарии публичны и следует проявлять осторожность.
@slashdesigner #эмиграция
О важности проверок на доступность
Цветовое кодирование отлично позволяет различать между собой объекты, несущие разный смысл. Но при использовании такого паттерна важно не полагаться на один лишь цвет. Есть большая категория людей, которые не различают цвета. В данном примере синий и оранжевый для них могут выглядеть практически идентично, что усложняет восприятие инфографики.
Самый простой способ проверки — обесцветить макет, наложив вспомогательный слой в режиме Saturation.
В данном случае сделать значки более считываемыми можно было при помощи разницы опасити. Даже при значении 20% значки оставались бы читаемыми на карте, но при этом кардинально отличались бы от аналогичных значков с значением 100%. Альтернативным решением было бы использовать другую иконку.
Всегда помни о доступности и слабовидящих.
Источник инфографики
@slashdesigner #первые_шаги #инфографика #доступность
Цветовое кодирование отлично позволяет различать между собой объекты, несущие разный смысл. Но при использовании такого паттерна важно не полагаться на один лишь цвет. Есть большая категория людей, которые не различают цвета. В данном примере синий и оранжевый для них могут выглядеть практически идентично, что усложняет восприятие инфографики.
Самый простой способ проверки — обесцветить макет, наложив вспомогательный слой в режиме Saturation.
В данном случае сделать значки более считываемыми можно было при помощи разницы опасити. Даже при значении 20% значки оставались бы читаемыми на карте, но при этом кардинально отличались бы от аналогичных значков с значением 100%. Альтернативным решением было бы использовать другую иконку.
Всегда помни о доступности и слабовидящих.
Источник инфографики
@slashdesigner #первые_шаги #инфографика #доступность
Как безопасно накатывать обновления из библиотек в Figma
Проблема: прилетели обновления в файл из библиотеки, нажали Update All, слетел контент и графика в оверрайдах по всему файлу и теперь непонятно, где искать косяки в макетах.
Придумал решение через ветки. Работает только на тарифе Organization.
1. Откатиться через Version History на версию до наката изменений.
2. Создать ветку версии файла до изменений, назвать её как удобно, например Updated. Версия до изменений сохранится в главной ветке.
3. Накатить изменения в ветке Updated, затем сравнить ветки Updated и главную командой Review and merge changes.
4. В окне Branch review в виде удобных карточек отследить, что именно слетело, сделать скриншоты для дальнейшего ручного исправления. Так мы отслеживаем малейшие изменения в структуре файла.
5. Сделать мёрдж ветки Updated в главную. Так мы доносим все изменения из Updated.
6. Если есть, что исправлять: по скриншотам из шага 4 исправляем всё, что слетело.
@slashdesigner #Figma #для_профи
Проблема: прилетели обновления в файл из библиотеки, нажали Update All, слетел контент и графика в оверрайдах по всему файлу и теперь непонятно, где искать косяки в макетах.
Придумал решение через ветки. Работает только на тарифе Organization.
1. Откатиться через Version History на версию до наката изменений.
2. Создать ветку версии файла до изменений, назвать её как удобно, например Updated. Версия до изменений сохранится в главной ветке.
3. Накатить изменения в ветке Updated, затем сравнить ветки Updated и главную командой Review and merge changes.
4. В окне Branch review в виде удобных карточек отследить, что именно слетело, сделать скриншоты для дальнейшего ручного исправления. Так мы отслеживаем малейшие изменения в структуре файла.
5. Сделать мёрдж ветки Updated в главную. Так мы доносим все изменения из Updated.
6. Если есть, что исправлять: по скриншотам из шага 4 исправляем всё, что слетело.
@slashdesigner #Figma #для_профи
Нужен ли более подробный урок про накат апдейтов?
Anonymous Poll
65%
Да, хочется увидеть самому в виде видео, текстом непонятно
13%
Да, текстом, нужны пошаговые скриншоты
8%
Нет, всё понятно
4%
Сама задача не интересна, не работаю с библиотеками
11%
Результаты
Навыки дизайнера презентаций: 10 шагов
Задали вопрос о том, как стать дизайнером презентаций и что важно. Ответ превратился в большой пост. Делюсь.
Погружаться в сферу дизайна из презентаций типично, потому что у этой специализации относительно лёгкий порог входа и большой рынок заказчиков.
Почему-то делать презентации не учат в школе. Даже если ты не собираешься делать их в качестве основной работы, презентовать со слайдами — это важный навык для любого человека, который стремится построить карьеру и доносить свои идеи до других.
Шаг 1. Изучить инструмент. Я разделяю инструменты для дизайна (Figma) и инструменты для показа (Keynote, PowerPoint, Prezi, Canva, Google Slides и тд).
Для базового создания дизайна слайдов я бы использовал только Figma, потому что этот редактор позволяет использовать нормальные сетки, стили и компоненты для повторяемых элементов. Кстати, для през очень удобен формат 1920 х 1080 и сетка c шагом 40. В такой среде слайды могут быть по-настоящему pixel-perfect. Дальше можно экспортировать в PDF и на этом остановиться.
Но можно пойти дальше и готовые слайды перенести в специализированный инструмент для презентаций, будь то PowerPoint или Keynote.
Не стоит изначально делать презы в них, поскольку это отрицательно скажется на визуале.
2. Изучить основы дизайна: особое внимание типографике. Дизайнер презентаций обязан уметь верстать тексты. Композиция может быть очень типичной, например, стоит попробовать начать с вёрстки в две колонки. Умение работать с цветом позволит делать презентации более выразительными.
3. Язык для таких дизайнеров особенно важен. Инфостиль, «Пиши, Сокращай» — метко формулировать мысли, писать внятно и прозрачно.
4. Нарратив. Как выстраивается логика повествования. Например, «от проблемы к решению»: формулируем проблему → описываем варианты решения → выбираем предлагаемый вариант → спасибо/вопросы/контакты. Бывают и другие виды нарративов.
5. Иллюстрации. Умение визуализировать данные в виде красочных графиков будет ценным расширением. Искать визуальные референсы, перерисовывать то, что нравится. Набить руку на 10 примерах и просить компетентной критики, например, в нашем @designchat2.
6. Насмотренность на крутые презы, от тех же Bonnie and Slide (не реклама, просто вспомнились) и от презентаций крупных брендов.
На начальном этапе не стоит увлекаться артом в презентациях, накручивать яркие цвета и пытаться втиснуть как можно больше графики, потому что она смотрится прикольно в других местах. Важно понимать, в чём изначальный посыл презентации и ради чего мы используем выбранные иллюстрации.
Проще начинать с чистого контента, а не с выбранного шаблона. Шаблоны стоит использовать только в качестве референсов по стилю и заимствовать из них нужные подходящие ходы.
Много хороших шаблонов можно найти на сайте онлайн-редактора canva.com/q/presentations/. Сам редактор серьёзным инструментом не считаю.
7. Сделать портфолио из 3 през слайдов на 7-12. Этого будет достаточно для демонстрации твоего текущего уровня. Можно сделать это в формате Тильды или на Squarespace. Делать список ссылок на прототипы в Фигме или загружать PDF в Dropbox или Яндекс Диск не круто.
8. Взять платную консультацию у того, кто ими прицельно занимается. Сам в данный момент приостановил консультации. Или более оптовый вариант: пройти специализированный курс про презентациям, сразу настроит твой фокус.
9. Софт-скилы. Обычно презентацию нужно сделать срочно и быстро. Поэтому, при поиске исполнителя смотрят на то, умеешь ли ты работать в жёстких дедлайнах. В презентациях лучше «грязно и быстро», чем «очень красиво, но уже не надо».
10. Искать работу в агентствах, отделах маркетинга крупных IT-компаний или уже сформировавшихся фриланс-командах с опытными дизайнерами. Не шабашить в одиночку самому без присмотра старших. Дизайн в одиночку = выкинутые годы.
Если среди читателей кто-то занимается презентациями профессионально, пожалуйста, пишите в комментарии, что могли бы порекомендовать начинающему.
@slashdesigner #первые_шаги #презентации
Задали вопрос о том, как стать дизайнером презентаций и что важно. Ответ превратился в большой пост. Делюсь.
Погружаться в сферу дизайна из презентаций типично, потому что у этой специализации относительно лёгкий порог входа и большой рынок заказчиков.
Почему-то делать презентации не учат в школе. Даже если ты не собираешься делать их в качестве основной работы, презентовать со слайдами — это важный навык для любого человека, который стремится построить карьеру и доносить свои идеи до других.
Шаг 1. Изучить инструмент. Я разделяю инструменты для дизайна (Figma) и инструменты для показа (Keynote, PowerPoint, Prezi, Canva, Google Slides и тд).
Для базового создания дизайна слайдов я бы использовал только Figma, потому что этот редактор позволяет использовать нормальные сетки, стили и компоненты для повторяемых элементов. Кстати, для през очень удобен формат 1920 х 1080 и сетка c шагом 40. В такой среде слайды могут быть по-настоящему pixel-perfect. Дальше можно экспортировать в PDF и на этом остановиться.
Но можно пойти дальше и готовые слайды перенести в специализированный инструмент для презентаций, будь то PowerPoint или Keynote.
Не стоит изначально делать презы в них, поскольку это отрицательно скажется на визуале.
2. Изучить основы дизайна: особое внимание типографике. Дизайнер презентаций обязан уметь верстать тексты. Композиция может быть очень типичной, например, стоит попробовать начать с вёрстки в две колонки. Умение работать с цветом позволит делать презентации более выразительными.
3. Язык для таких дизайнеров особенно важен. Инфостиль, «Пиши, Сокращай» — метко формулировать мысли, писать внятно и прозрачно.
4. Нарратив. Как выстраивается логика повествования. Например, «от проблемы к решению»: формулируем проблему → описываем варианты решения → выбираем предлагаемый вариант → спасибо/вопросы/контакты. Бывают и другие виды нарративов.
5. Иллюстрации. Умение визуализировать данные в виде красочных графиков будет ценным расширением. Искать визуальные референсы, перерисовывать то, что нравится. Набить руку на 10 примерах и просить компетентной критики, например, в нашем @designchat2.
6. Насмотренность на крутые презы, от тех же Bonnie and Slide (не реклама, просто вспомнились) и от презентаций крупных брендов.
На начальном этапе не стоит увлекаться артом в презентациях, накручивать яркие цвета и пытаться втиснуть как можно больше графики, потому что она смотрится прикольно в других местах. Важно понимать, в чём изначальный посыл презентации и ради чего мы используем выбранные иллюстрации.
Проще начинать с чистого контента, а не с выбранного шаблона. Шаблоны стоит использовать только в качестве референсов по стилю и заимствовать из них нужные подходящие ходы.
Много хороших шаблонов можно найти на сайте онлайн-редактора canva.com/q/presentations/. Сам редактор серьёзным инструментом не считаю.
7. Сделать портфолио из 3 през слайдов на 7-12. Этого будет достаточно для демонстрации твоего текущего уровня. Можно сделать это в формате Тильды или на Squarespace. Делать список ссылок на прототипы в Фигме или загружать PDF в Dropbox или Яндекс Диск не круто.
8. Взять платную консультацию у того, кто ими прицельно занимается. Сам в данный момент приостановил консультации. Или более оптовый вариант: пройти специализированный курс про презентациям, сразу настроит твой фокус.
9. Софт-скилы. Обычно презентацию нужно сделать срочно и быстро. Поэтому, при поиске исполнителя смотрят на то, умеешь ли ты работать в жёстких дедлайнах. В презентациях лучше «грязно и быстро», чем «очень красиво, но уже не надо».
10. Искать работу в агентствах, отделах маркетинга крупных IT-компаний или уже сформировавшихся фриланс-командах с опытными дизайнерами. Не шабашить в одиночку самому без присмотра старших. Дизайн в одиночку = выкинутые годы.
Если среди читателей кто-то занимается презентациями профессионально, пожалуйста, пишите в комментарии, что могли бы порекомендовать начинающему.
@slashdesigner #первые_шаги #презентации
Виктор Теплов на этой неделе ведёт канал Ozon
Это мой добрый друг и в прошлом дизайнер из моей команды, которого в своё время я пригласил в Ozon. Виктор — настоящий японец в душе и без сомнения, мадзимэ.
Кто-то знает его по каналу Zen Designer и ответам в нашем Чате про дизайн-системы. На этой неделе он ведущий канала @ozondesign.
Уже написал про искусство киригами и про то, как можно из старых упаковок делать что-то новое. Должно быть и дальше интересно.
@slashdesigner #для_профи
Это мой добрый друг и в прошлом дизайнер из моей команды, которого в своё время я пригласил в Ozon. Виктор — настоящий японец в душе и без сомнения, мадзимэ.
Кто-то знает его по каналу Zen Designer и ответам в нашем Чате про дизайн-системы. На этой неделе он ведущий канала @ozondesign.
Уже написал про искусство киригами и про то, как можно из старых упаковок делать что-то новое. Должно быть и дальше интересно.
@slashdesigner #для_профи
Урок о том, как безопасно накатывать обновления на компоненты из библиотек в Figma
Не так давно в Figma появился важный апдейт — возможность сверять вид экземпляра компонента бок-о-бок до и после обновления его мастера из библиотеки.
Это удобный механизм для того, чтобы бороться с потерей контента из оверрайдов. Я продемонстрировал, как можно использовать эту функцию для восстановления слетающего контента на крупных проектах, где используются библиотеки.
slashd.ru/figma/saving-overrides →
Кратко: когда в файле возникает плашка Review Updates, мы можем проваливаться в компонент и листать все его экземпляры, и, не закрывая окна, по ходу исправлять их вручную.
PS — Просили в виде видео, но пока нет возможности записать и озвучить, планирую вернуться к такому формату. Те, кто снимает качественные видеоуроки, вы просто герои.
@slashdesigner #Figma #для_профи
Не так давно в Figma появился важный апдейт — возможность сверять вид экземпляра компонента бок-о-бок до и после обновления его мастера из библиотеки.
Это удобный механизм для того, чтобы бороться с потерей контента из оверрайдов. Я продемонстрировал, как можно использовать эту функцию для восстановления слетающего контента на крупных проектах, где используются библиотеки.
slashd.ru/figma/saving-overrides →
Кратко: когда в файле возникает плашка Review Updates, мы можем проваливаться в компонент и листать все его экземпляры, и, не закрывая окна, по ходу исправлять их вручную.
PS — Просили в виде видео, но пока нет возможности записать и озвучить, планирую вернуться к такому формату. Те, кто снимает качественные видеоуроки, вы просто герои.
@slashdesigner #Figma #для_профи
Как ChatGPT могут использовать продуктовые дизайнеры для обучения?
Начнём новую тему и попробуем поисследовать модный AI-собеседник. Зарегистрироваться в нём можно на сайте chat.openai.com, для этого нужна гугл-почта и подтверждение по номеру мобильного телефона.
Первый способ применения, который приходит в голову — это использовать его как инструмент исследования теории дизайна и гайдов.
Всё, что можно вычитать в книгах или сайтах про дизайн, потенциально может быть им проиндексировано и выдано в виде короткого внятного текстового ответа. По ощущениям переписываешься с человеком, который знает всё. Я вижу его в первую очередь как способ поиска идей и верных акцентов в контенте. Он может помочь отделять важное от неважного в общем потоке интернет-мусора.
Например, вместо того, чтобы читать гайды iOS Human Interface Guidelins и Google Material от корки до корки и анализировать их самостоятельно, можно воспользоваться ChatGPT, который может сформировать готовое мнение по поводу того, что ему удалось из них извлечь.
Я расспросил ChatGPT о гайдах Apple и Google, наводящими вопросами попробовал их сравнить.
Результат получился довольно интересным, хотя иногда разочаровывал отсутствием конкретики. Прочитать наш диалог можно в комментариях этого поста. Привожу без редакции, чтобы можно было понять, как именно нейросеть формулирует ответы.
@slashdesigner #первые_шаги #AI #ChatGPT
Начнём новую тему и попробуем поисследовать модный AI-собеседник. Зарегистрироваться в нём можно на сайте chat.openai.com, для этого нужна гугл-почта и подтверждение по номеру мобильного телефона.
Первый способ применения, который приходит в голову — это использовать его как инструмент исследования теории дизайна и гайдов.
Всё, что можно вычитать в книгах или сайтах про дизайн, потенциально может быть им проиндексировано и выдано в виде короткого внятного текстового ответа. По ощущениям переписываешься с человеком, который знает всё. Я вижу его в первую очередь как способ поиска идей и верных акцентов в контенте. Он может помочь отделять важное от неважного в общем потоке интернет-мусора.
Например, вместо того, чтобы читать гайды iOS Human Interface Guidelins и Google Material от корки до корки и анализировать их самостоятельно, можно воспользоваться ChatGPT, который может сформировать готовое мнение по поводу того, что ему удалось из них извлечь.
Я расспросил ChatGPT о гайдах Apple и Google, наводящими вопросами попробовал их сравнить.
Результат получился довольно интересным, хотя иногда разочаровывал отсутствием конкретики. Прочитать наш диалог можно в комментариях этого поста. Привожу без редакции, чтобы можно было понять, как именно нейросеть формулирует ответы.
@slashdesigner #первые_шаги #AI #ChatGPT
Какие темы стоит раскрывать в /designer в 2023 году? Блок 1, практика дизайна
Final Results
33%
Возможности Figma, новое издание Руководства, справочник команд с примерами, тег #Figma
37%
Визуальный дизайн: #UI и #анимация
23%
Графический дизайн: #основы, #типографика, #вёрстка, #иконки
52%
Дизайн-системы: токены, пайплайн, архитектура, компоненты, внедрение, #дизайн_системы
36%
UI и анимация: рисуем макеты в Figma, шевелим в ProtoPie и After Effects
61%
UX: паттерны, проектирование, лучшие практики и задачи «на подумать»
12%
Моушн-дизайн и монтаж видео: DaVinci, After Effects, Blender, Unreal Engine
21%
Zero-code инструменты: уроки по Tilda, Webflow, Framer для веб-дизайна
20%
3D-моделирование в Blender для дизайнеров
7%
Не участвую, результаты
Какие темы стоит раскрывать в /designer в 2023 году? Часть 2, про майндсет и кругозор
Final Results
45%
Notion для документации: как организовать данные о проекте
44%
Дизайн-менеджмент на личном опыте, #стать_лидом
28%
Обзоры AI-инструментов по тегу #AI: ChatGPT, Mindjourney
40%
iOS и Android для дизайнеров: гайды понятным языком
50%
Продуктовая аналитика через практику
19%
Возродить старую рубрику «Классные люди» про выдающихся дизайнеров
44%
Карьера в крупных компаниях: карта компетенций, поиск работы, портфолио, собесы, повышение
31%
Эмиграция из России и дизайн-комьюнити эмигрантов
22%
IT-новости про дизайн: как про Ягодки, покупку Figma и другие большие поводы, чтобы пообсуждать
6%
Не участвую, результаты
#UX_задача №1. Получить ИИН
Клиент: Госуслуги Казахстана
Джоб-стори: я как иностранный гражданин хочу оформить национальный идентификатор для дочери, чтобы её взяли в садик.
Поскольку не являюсь гражданином, я должен идти в центр обслуживания (ЦОН) лично. Я прихожу в ближайший в своём районе, где раньше сам делал ИИН полгода назад. Меня довольно быстро обслуживают и говорят, что решение будет через несколько дней в виде СМС.
Проходит несколько дней, я получаю смс-отказ с формулировкой «обратитесь в ЦОН».
Я прихожу в ЦОН, мне говорят, что все заявки на ИИНы у них последнее время приходят с отказами и мне надо ехать на край города в специальный миграционный ЦОН. Там я наконец получаю ИИН.
Задача: составить пользовательский путь и гипотезы об улучшении клиентского опыта с учётом разных технических ограничений и без них.
Рекомендую делать это в Figma, FigJam или Miro.
Ограничения:
1. Нет возможности менять приложение и функционал сайта Госуслуг.
2. Нет возможности обслуживать иностранцев во всех ЦОНах, нужен миграционный.
3. Нет доступа к сервису СМС-уведомлений.
4. Слишком дорого оповещать всех иностранцев в стране об изменениях в процессе получения ИИНа по СМС.
Как будет меняться решение в зависимости от разных ограничений?
PS: но в целом Госуслуги в Кз — ван лав. Когда была волна мобилизации, очень быстро среагировали и грамотно распределили желающих получить ИИНы по отделениям банков, открыли дополнительные ЦОНы.
Ответ: www.tg-me.com/slashdesigner/942
@slashdesigner #первые_шаги #UX
Клиент: Госуслуги Казахстана
Джоб-стори: я как иностранный гражданин хочу оформить национальный идентификатор для дочери, чтобы её взяли в садик.
Поскольку не являюсь гражданином, я должен идти в центр обслуживания (ЦОН) лично. Я прихожу в ближайший в своём районе, где раньше сам делал ИИН полгода назад. Меня довольно быстро обслуживают и говорят, что решение будет через несколько дней в виде СМС.
Проходит несколько дней, я получаю смс-отказ с формулировкой «обратитесь в ЦОН».
Я прихожу в ЦОН, мне говорят, что все заявки на ИИНы у них последнее время приходят с отказами и мне надо ехать на край города в специальный миграционный ЦОН. Там я наконец получаю ИИН.
Задача: составить пользовательский путь и гипотезы об улучшении клиентского опыта с учётом разных технических ограничений и без них.
Рекомендую делать это в Figma, FigJam или Miro.
Ограничения:
1. Нет возможности менять приложение и функционал сайта Госуслуг.
2. Нет возможности обслуживать иностранцев во всех ЦОНах, нужен миграционный.
3. Нет доступа к сервису СМС-уведомлений.
4. Слишком дорого оповещать всех иностранцев в стране об изменениях в процессе получения ИИНа по СМС.
Как будет меняться решение в зависимости от разных ограничений?
PS: но в целом Госуслуги в Кз — ван лав. Когда была волна мобилизации, очень быстро среагировали и грамотно распределили желающих получить ИИНы по отделениям банков, открыли дополнительные ЦОНы.
Ответ: www.tg-me.com/slashdesigner/942
@slashdesigner #первые_шаги #UX
Находки веб-дизайна на канале @webdesigndaily
Рекомендую проект Web Design, в котором регулярно можно поразглядывать красивые сайты для развития вкуса.
Что понравилось из канала:
1. thecheckout.klarna.com
The Checkout — ежегодные итоги за 2022-й с точки зрения крупного е-комерса Klarna. Ностальгия по ретро, крупные пиксели и типографика.
2. miro.com/ways-we-work
Стильно оформленные результаты исследования «Ways we Work» от Miro. Контент о восприятии людьми своей работы, коллаборации, отношениях в команде и преимуществах гибридной работы.
3. danieltriendl.com
Портфолио иллюстратора из Австрии Дэниела Триендл с вёрсткой как в Pinterest. Понравилось, как он работает с цветом.
@slashdesigner #сайты #для_профи #полезная_реклама
Рекомендую проект Web Design, в котором регулярно можно поразглядывать красивые сайты для развития вкуса.
Что понравилось из канала:
1. thecheckout.klarna.com
The Checkout — ежегодные итоги за 2022-й с точки зрения крупного е-комерса Klarna. Ностальгия по ретро, крупные пиксели и типографика.
2. miro.com/ways-we-work
Стильно оформленные результаты исследования «Ways we Work» от Miro. Контент о восприятии людьми своей работы, коллаборации, отношениях в команде и преимуществах гибридной работы.
3. danieltriendl.com
Портфолио иллюстратора из Австрии Дэниела Триендл с вёрсткой как в Pinterest. Понравилось, как он работает с цветом.
@slashdesigner #сайты #для_профи #полезная_реклама
/designer
#UX_задача №1. Получить ИИН Клиент: Госуслуги Казахстана Джоб-стори: я как иностранный гражданин хочу оформить национальный идентификатор для дочери, чтобы её взяли в садик. Поскольку не являюсь гражданином, я должен идти в центр обслуживания (ЦОН) лично.…
#UX_задача №1, про ИИН. Решение
В видео я накидал варианты сценария получения ИИН и проговорил ограничения.
https://youtu.be/TAyOqivp234
- Исходная задача
- Кит с UX-флоу
- Фигма-файл с решением
@slashdesigner #первые_шаги #UX
В видео я накидал варианты сценария получения ИИН и проговорил ограничения.
https://youtu.be/TAyOqivp234
- Исходная задача
- Кит с UX-флоу
- Фигма-файл с решением
@slashdesigner #первые_шаги #UX
YouTube
UX-задача №1. Получить ИИН
Перезалив с исправленным более громким звуком. Разбор задачи о получении национального идентификатор в Казахстане. Составляем фактический флоу и накидываем гипотезы по его улучшению и упрощению.
Кит с UX-флоу: https://www.figma.com/community/file/873582342676369539…
Кит с UX-флоу: https://www.figma.com/community/file/873582342676369539…
This media is not supported in your browser
VIEW IN TELEGRAM
Разбор #UI №4. Переключатель темы
Когда-то дизайнер из Словакии Роман Клчо сделал этот шот с объёмным переключателем тёмой темы. Как и большинство работ на Дрибле, UI там это отдельный вид искусства. Это красиво, но непрактично, поскольку довольно трудно в разработке и не особенно осмысленно даже с точки зрения UX. Гораздо проще наследовать настройку темы от операционной системы, а не переключать на уровне приложения. Но если очень хочется, то можно.
Швейцарский разработчик Мортен Джаст (в прошлом тимлид в Google) в качестве эксперимента реализовал этот переключатель на SwiftUI и даже сделал поддержку VoiceOver.
Жаль, что SwiftUI со всем его хипстерским удобством пока не светит крупным продуктам, которые пока вынуждены поддерживать iOS до версии 12, а его можно использовать только начиная с iOS 13. Естественно, никакой обратной совместимости.
У Мортена кстати много экспериментальных крутых штук на его сайте mortenjust.com, а также своя рассылка на Substack. В твиттер-треде он обещал, что выложит код в следующем выпуске.
Разбор деталей реализации:
1. Как компонент реагирует на изменение форм-фактора
2. Как реализован эффект перспективы
3. Тень из размытого прямоугольника
4. Шумы
5. Переход в замедлении
6. VoiceOver
Поражаюсь, какие же они все крутые.
@slashdesigner
#для_профи #анимация #SwiftUI
Когда-то дизайнер из Словакии Роман Клчо сделал этот шот с объёмным переключателем тёмой темы. Как и большинство работ на Дрибле, UI там это отдельный вид искусства. Это красиво, но непрактично, поскольку довольно трудно в разработке и не особенно осмысленно даже с точки зрения UX. Гораздо проще наследовать настройку темы от операционной системы, а не переключать на уровне приложения. Но если очень хочется, то можно.
Швейцарский разработчик Мортен Джаст (в прошлом тимлид в Google) в качестве эксперимента реализовал этот переключатель на SwiftUI и даже сделал поддержку VoiceOver.
Жаль, что SwiftUI со всем его хипстерским удобством пока не светит крупным продуктам, которые пока вынуждены поддерживать iOS до версии 12, а его можно использовать только начиная с iOS 13. Естественно, никакой обратной совместимости.
У Мортена кстати много экспериментальных крутых штук на его сайте mortenjust.com, а также своя рассылка на Substack. В твиттер-треде он обещал, что выложит код в следующем выпуске.
Разбор деталей реализации:
1. Как компонент реагирует на изменение форм-фактора
2. Как реализован эффект перспективы
3. Тень из размытого прямоугольника
4. Шумы
5. Переход в замедлении
6. VoiceOver
Поражаюсь, какие же они все крутые.
@slashdesigner
#для_профи #анимация #SwiftUI