sergey fedorov · product designer
487 subscribers
313 photos
24 videos
19 files
262 links
Бросаю дизайн с 2014 Продуктовый дизайнер, базовчанин

Про продукты, дизайн-системы, компоненты, иконки, портфолио, рефы, 3D

Портфолио:
https://fedoroj.framer.website
dribbble.com/fedoroj

Автор: @fedoroj
Чат: @productdesignchat
Download Telegram
Впервые поучаствовал в пользовательском интервью как дезигнер

Задавали вопросы про опыт, поиск менторов для старших дизайнеров, наставничество для миддлов и выше, короче вопросы для edtech продукта по менторству дизайнеров. Некоторые вопросы вгоняли в депрессию (про дальнейшие стремления и тд). Вышло на 30 минут, и даже заплатили 500 деняк за участие. Причем меня сами нашли, i never asked for this

Для себя словил реалити-чек о том как проводятся интервью, опросы и корридорные тестирования. Потому что ресёрч – моя уязвимая часть, еще не сталкивался с этим по опыту

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

пикчу сгенерил в diffusionbee, обработка в gimp и figma

#опыт
Принципы отрисовки новых иконок в шрифтовую пару на Авито

Хорошая статья для тех кто создает интерфейсные иконки с нуля:

🔗 https://vc.ru/design/629084-principy-otrisovki-novyh-ikonok-v-shriftovuyu-paru-na-avito

Когда начинал редизайнить маркетплейс пару лет назад, Я в спешной спешке рисовал только middle-размер (24px) с толщиной 1.8px для шрифтов Inter и Roboto. Получилось около 250 штук. Все создавал в фигме, как бы не визжали некоторые дизайнеры, что «все иконки нада рисавать в ыллюстратаре!!1 ряяя!!🥴🥴». Как бы тру, при наличии бессмертия, 100 часов в сутках и зарплате 300кк$/наносек

И сравнительно недавно уперся в проблему – middle-size не универсален и не подходит для размера шрифта 14px и меньше. Да, можно уменьшить иконку с 24 до 20px и обозвать small, но придется играться с начертанием шрифта а не категорией иконки (считай компонентом), что не есть хорошо 🫢. Речь про дефолтное начертание regular, из-за упомянутой проблемы где-то приходится менять его на medium, чтобы все было консистентно

В одном из пунктов статьи как раз предлагается давно висевшее в воздухе решение – рисовать отдельно категорию small с размером 20px и толщиной близкой к 1px. И так далее, по иерархии. Да и не только в статье, такое разделение есть в дизайн-системе VK и некоторых других. Тут очевидно все упирается во время и ресурс. Я один в поле воин и сам себе команда дизайн-системы. Младшие дизайнерята почти что не умеют рисовать UI-иконки, за исключением больших маркетинговых

#icon #ui
Please open Telegram to view this post
VIEW IN TELEGRAM
10 причин, по которым мы начали проектировать иконки в Figma

В дополнение к предыдущему посту. Статья от команды Font Awesome, которая решила перейти с иллюстратора в фигму, обозначив преимущества:

Оригинал: https://blog.fontawesome.com/figma-for-icon-design/

Перевод: https://ux.pub/editorial/10-prichin-po-kotorym-my-nachali-proiektirovat-ikonki-v-figma-1cg8

Староверы, если вас не убедила статья даже такого иконочного монстра, тогда предлагаю проектировать UI там же, где рисуете иконки
ㅤㅤㅤㅤ⛔️⛔️⛔️

#icon #ui #figma
Please open Telegram to view this post
VIEW IN TELEGRAM
deck gallery

Галерея презентаций – питчи, репорты, ивенты (например apple event '23), гайдлайны брендов, слайды и прочее. Пригодится для тех, кто часто делает презы. Ранее упоминал похожий каталог

🔗 https://deck.gallery/

#reference
Please open Telegram to view this post
VIEW IN TELEGRAM
illustrations universe

Каталог продуктовых иллюстраций.
Например:
miro
duolingo
dropbox
notion
discord
twitter
google
и так далее. Можно было бы собирать эти рефы вручную, но все, как обычно, сделали за нас

🔗 https://illustrationsuniverse.com/

#reference
Please open Telegram to view this post
VIEW IN TELEGRAM
Каталог материалов Blendermada

от админов и волонтеров сайта. Под лицензией CC-0. Большинство для движка Cycles. Скачал и заюзал, нехер тратить время на одно и тоже

🔗 https://blendermada.com/materials/

Однажды линк сдохнет, тк авторы переезжают на новый сайт, обновлю, если напомните

#blender #3d
Please open Telegram to view this post
VIEW IN TELEGRAM
sergey fedorov · product designer
Ого, 300+ миллиардов подписчиков. Благодарю что вы со мной 😎
Ого, 404 миллиардов подписчиков. Благодарствую. Работаем дальше 😎

Кстати, достигнул одну из упомянутых цифр в канале (404). Следующая – набрать 666 подсничников 🔥😈
Please open Telegram to view this post
VIEW IN TELEGRAM
webframe

Еще один сервис с наборами скриншотов из веб-приложений. Есть разделение на категории (лендосы, логины, модалки, блоги, faq, ...) и на продукты (airtable, notion, webflow, jira, asana, ...)

https://webframe.xyz/

Из недавних аналогов в канале – Calltoinspiration

#reference
This media is not supported in your browser
VIEW IN TELEGRAM
Оказалось, что независимые радиусы можно настраивать через variables. Просто фигма это никак визуально не обозначила. Вообще

Недожали 🤡

#figma
Обновился на💸macOS Sonoma, из того что заметил:

Misson Control стал быстрее работать (добавление/удаление рабочих столов). Но крестики все равно вылезают с некоторым запозданием, ровно 1 раз, но дальше быстро. Скорее всего защита от дурака

Переключение языка клавишей fn с глобусом вроде бы ускорилось и даже попап вылезавший в центре исчез. Но теперь вместо него появляется тултип прямо у курсора текста. Попробовал быстро переключать fn печатая по 1 символу на ру и англ языке. Лагает, ёпта 👁. Остаюсь на хоткеях Cmd+Space

Добавили видеообои. Много. Сначала такой «Waaaow!11!😲», на рабочем столе будет крутиться красивая видяшка. Оказалось, что нет (почти). Видео крутится только на заставке и заблокированном экране, при разблокировке видео продолжает играть 2-3 секунды и замедленно останавливается, красиво 📸

Виджеты на рабочий стол. С пивком потянет. Пока что самый годный для меня – индикаторы заряда всех подключенных устройств (2й в углу скриншота). А то мыш-мэджик 2 бывает дохнет в неподходящий момент и уведомление об этом тоже почему то сдохло, хотя я ничего не трогал 😲

Новый способ скрытия программ. Ранее работал и до сих пор работает способ свайпать по трекбару 4 пальцами в стороны. Теперь можно просто кликнуть по пустой области рабочего стола (если окно проги не в фулл режиме, например, телеграм)

Скрытие папок на рабочем столе одним кликом. Да, я до сих пор не очистил рабочий стол, раскидав файлы по Finder'у по совету коллеги разраба. Аппле таким как я сделал чекбокс «Показать объекты – На рабочем столе» в настройках «Рабочий стол и Dock». Галочку нужно убрать и тогда стол станет девственно чистым, как на скриншоте. Папки скроются визуально но не удалятся. Поправьте меня, могу ошибаться, возможно это не новая фича и я не заметил ее в настройках прошлой ОС Ventura

Короче говоря, ничего не потеряете если не обновитесь с вентуры

@SF
Please open Telegram to view this post
VIEW IN TELEGRAM
скоро 5 лет кста 😨

пикча от @ultraproduct
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
Числовые токены

Как вам идея – засунуть всевозможные повторяющиеся числа дизайнера в коллекцию global→numbers у дизайн-системы? То есть помимо palette с разными оттенками (100, 200, 300...900) будет отдельная папка с числами начиная с нуля/none и заканчивая шириной десктопа (1920, например). Как оказалось – их не очень много получается

Потом эти токены можно подключать как alias к разным размерам в коллекции «sizes» – спейсинги, закругления, толщина обводки (пока не работает, ждем), размеры иконок, размеры десктопа/мобайла и тд

#designsystem #figma
Inter 4.0

Расмус обновил шрифт после 2-х лет доработок. Чтоб более наглядно было – взгляните на хвостики букв c и е

https://rsms.me/inter/

Только я вот не дождался этой обновы и принял с командой решение отказаться от его использования в продукте. Перешли на Onest. На досуге выпущу пост-размышление об этом

Если ваш продукт на инглише/латинице – кайфуйте от интера, ежже😏

#font
Please open Telegram to view this post
VIEW IN TELEGRAM
Новая обнова телеги. Вполне норм рекомендации до тех пор пока ботофермы и большие каналы не засрут этот раздел 🐸

upd: на те что и так подписан все равно остаются в реках

upd2: @SkeeTls написал, что если меньше 100 подсничников — вкладки с реками нет вовсе
Please open Telegram to view this post
VIEW IN TELEGRAM
Пока писал новый пост – вышла небольшая обновка local variables у фигмы:

1. Stroke Weight – наконец-то можно создавать толщину обводки в виде переменных. Во всех 4 направлениях (bottom, top, right, left). Эту фичу я ждал тк уже был готов раздел stroke в дизайн-системе

2. Layer Opacity – настраивать прозрачность

3. Effects – во всех теперь можно применять числовые переменные + цвета. В частности – X, Y, Blur, Spread, Color у Drop/Inner Shadow. И blur у Layer/Background blur

4. Layout grid – можно настраивать Size, Count, Width, Offset, Gutter у Grid/Columns/Rows. Цвета настраивать нельзя

И чё та там с nested instance variant properties, пока не разобрался 🧠

А когда шрифтовые переменные появятся? 🫥

#figma
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
sergey fedorov · product designer
Ну и год Итогов не будет. Всех с нг🎄
🎄с нг подсничники 🎄

Сейчас мне немного не до ведения канала. Куча дел навалилось. Итог на этот раз будет – Я нашел новую работу 🥳. Мечтал, откликнулся, но не думал что это получится сделать до начала 2024. О работе расскажу как ниб позже

Кста в 24 году будут самые большие выборы в мире, для нескольких миллиардов людей в нескольких странах. И каждый должен будет для себя сделать в том числе личный выбор, как в матрице. Я свой (карьерный) выбор сделал – попасть в еще более хорошую компанию чем прежде 🍷
Please open Telegram to view this post
VIEW IN TELEGRAM