Закулисье дизайна: UI, UX, Продуктовый дизайн, AI (ИИ)
177 subscribers
333 photos
40 videos
145 links
Честное закулисье дизайн-процесса без прикрас – с фейлами, трудностями, успехами.

UI/UX, продуктовый дизайн
https://baybulatov.framer.website

9 лет коммерческого опыта в дизайне продуктов с нуля до продакшна и поддержки

Автор: Рустам, @baybulatovdesign
Download Telegram
Я все никак не мог дошлифовать мелочи проекта, чтобы вам показать эту работу.
Исправился – показываю.

Это, наверно, самая сложная иллюстративная работа в моей практике, причем иллюстрации – мой не первостепенный навык.

Самому ОЧЕНЬ нравится! Это прям редкость.

Потратил 53 часа.

#портфолио
🔥8❤2
По арту выше случился один #фейл, в котором я потерял 17 500 ₽.

Этот заказ ко мне пришел от моего основного заказчика Игоря, он сделегировал создание арта для SeedLaunch на меня.

История:
он мне как-то на полпути сказал, что мы уже вышли за пределы бюджета 300$, который он озвучил SeedLaunch – я не стал ускоряться в плане экономии времени на проекте, т.к. работа итак уже была проделана детально и хорошо, и ускоряться, чтобы сильно не выходить за бюджет = потерять в качестве.

Потратил 53 часа! 53, Карл! Я никогда так долго не сидел над одной иллюстрацией.
При моей мин. ставке в 16$ это 848$ ~ 50 000 ₽.
Игорь мне потом со своего кармана заплатил сверху 500$, т.к. за результат отвечал он.

Я все-таки в результате предложить поделить риски, т.к. я тоже виноват, когда совсем неправильно назвал ориентировочные сроки.

Итог – за арт я получил 550$, вместо 840$ ~ 32 000 ₽.
😢3❤1👍1😁1😱1
Спасибо, Pinterest, теперь хочу интерфейсный проект в стиле брутализм.

Но когда я до этого дойду – непонятно, приоритеты другие.
❤3😁2
Вчера ученица сказала, что пригодились мои знания по Вариантам в Фигме и по UI-киту.

Приятно 😊

Люблю, когда то, что я передаю в каком-либо виде – используется. Чувствую социальную ценность 🔥
❤2🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Нафантазировал тут анимацию для 1го экрана по проекту, над которым работаю. Вот теперь думаю, как все это дело адекватно подстраивать под разные экраны и как передавать всю анимацию разработчику, которая будет завязана на скролле пользователя. Т.е. пользователь скроллом будет контролировать кадры анимации.

Т.е. мне в итоге надо будет передать для каждого разрешения (десктоп, планшет, мобайл):
– масштабы объектов,
– начальные и конечные координаты по горизонтали и вертикали в процентном соотношении разрешения экрана для позиций каждого из объектов,
– возможно что-то еще.

А потом я еще освою SVG-анимацию и сделаю следующее:
– растения будут колыхаться,
– пальцы будут тыкать кнопки на джойстике.
🔥3❤2
Сегодняшнее #вдохновение иллюстрациями.

Собрал те стили, которых прежде не видел, либо не обращал раньше внимания.
🔥2❤1
Наиострейшее желание уйти в свои проекты – окунуться в Иллюстрации, WebFlow (конструктор сайтов), Processing и изучение UX.

Но приходится пока чистой коммерцией заниматься, а там задачи пока какие-то скучные.

Видимо, надо скоро организовать перерыв от заказов и заняться только своим Хочу, а не Надо.
Я без этого, видимо, никак не могу.
❤2😢1
Media is too big
VIEW IN TELEGRAM
Наконец-то освоил Lottie-анимацию!
И заодно After Effects вспомнил.

Lottie-анимация, если простым языком – анимация в виде кода, которая мало весит (этот джойстик в .json весит всего 88 КБ) и не теряет в качестве при масштабировании. Используется, как правило, на сайтах.

На видео – бекстейдж того, как я делал такую анимацию для проекта shaolin.soccer.

Посмотреть результат ↗️

Видео-инструкция об инструментах при создании lottie-анимаций
🔥3❤1👍1
Знаю, что у меня аудитория примерно следующая:
10% – дизайнеры,
90% – другие специалисты,
но хочется иногда поделиться узкоспециализированной информацией, чтобы те 10% могли получать бОльшую полезность от меня.

Поэтому буду иногда так делать, но помечать тегом #дизайнерам, чтобы те, кто не шарит глубинно – мог пропускать пост, не тратя время на его чтение. Решать в любом случае вам – читать или нет :)
❤1👍1🔥1
#дизайнерам

Как правильно подготовить слои для создания lottie-анимации при перегонке из Фигмы в AE через плагин AEUX:

1. Все union's надо объединять в единый контур, Outline Stroke через CTRL+SHIFT+O.
2. Все фреймы конвертируются в Composition. Мне при анимации Path это усложняло все, т.к. для анимации приходилось бы идти внутрь композиции и абстрагировано от всего объекта что-то менять внутри.
3. Группы тоже лучше разбить, т.к. их сложно редактировать в AE.
4. Дать наименования всем слоям.
5. Убрать все алики (auto-layouts).
6. Если использовать маски, то лучше положить также во фреймы, иначе при использовании групп позиция слоя может слететь при экспорте.
❤1🔥1👏1
Вчерашний ответ от одного человека, к кому в команду доверенных исполнителей попал:

Хотел пригласить тебя в проект от Сбера - там большую команду собирали, но сроки были сегодня до 17 подачи, не успели(

Не то чтобы #фейл, но отнесу событие к этой категории
❤1😢1
Недавно поймал на мысли, что в будущем, возможно, вообще уйду от классических интерфейсов.

Хочется что-то артовое, более сложное.
❤1👍1🔥1🤔1
Зацените какой кайф!🔥

Показывает динамику длины слов в строках стихотворения Антона Чехова «‎Чайка»!

Можно на Processing попробовать написать.

#вдохновение
❤1🔥1👏1
Закулисье дизайна: UI, UX, Продуктовый дизайн, AI (ИИ)
Зацените какой кайф!🔥 Показывает динамику длины слов в строках стихотворения Антона Чехова «‎Чайка»! Можно на Processing попробовать написать. #вдохновение
Приступил к реализации идеи выше.

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

От себя добавил использование квадратов, чисто для эксперимента.

Следующая задача – загрузить строчку текста в #Processing и преобразовать его в массив с числовыми значениями каждого слова, где каждое слово будет превращаться в окружность и выстраиваться в ряд.
🔥2
Объяснять, как все это делается?
Anonymous Poll
75%
Давай
25%
Не, спасибо
0%
Не знаю