Table of contents:
· Video Animations
· Chat List
· Contact List
· Settings Page
· User Info
· User Profile
· Channel Profile
· Group Profile
· Bot Profile
· Private Chat
· Channel
· Bot
· Secret Chat
· Group Chat
· Selections
· Modal Pages
· Messages Types and Chats


Dynamic Palettes:
· Dark Mode (Default)

· Light Gold
· Dark Gold

· Light Mint
· Dark Mint

· Light Pink
· Dark Pink

· Light Green
· Dark Green

привет! меня зовут Илья Гришин и я уже 8 лет рисую супераппы продуктовый дизайнер

(а еще арт-директор, эйчар, хед оф дизайн, дизайн-менеджер, продакт-менеджер, разработчик, моушен потому что мне обязательно нужно надевать все шапки 🫨)

если мы с вами не знакомы, то пара слов обо мне могут звучать как-то так:
— сейчас я строю с командой криптовалютный Кошелёк, что встроен в Telegram;
— активно приглядываю за всем, что есть в TON; помогаю и кручусь, чтобы сделать экосистему полезнее (а не в просто красивой обложке), строя открытую платформу вместе с ребятами в top.co;
— ранее, два года помогал меняться Дзену в Яндексе и отвечал за его ленту;
— шесть лет помогал строить и меняться соцсети ВКонтакте и чуть-чуть объединять VK снаружи и изнутри.

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

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

такой контент примерно тут и будет: некий станок и разные штуки, которыми чуть чаще хотелось бы делиться наружу.

настало время проводить собственные конкурсы.

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

я бы сам поучаствовал, но теперь раздаю призовой фонд до $30,000 в Toncoin!

подробности тут: https://telegra.ph/Wallet-in-Telegram-announces-first-contest-for-designers-05-07

⚡️Более 300 работ было прислано на конкурс.

Кажется, так много не отправлялось даже на конкурсы Telegram. И как все это проверять?

Наконец-то дождался Wallet в блоге, ещё и в таком крутом апдейте!

https://t.tg.goldica.ir/b0dd72633a60ad0070e10de7b12c5322/blog/mini-app-bar-paid-media-and-more#mini-app-bar

Каждый раз, подключая TON Space к какому-нибудь даппу, я немножечко горжусь тем, насколько клёвым получился процесс подключения.

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

Однако, во всём, что я встречал — мне не хватало законченности. Некого итога, мол, вот всё подключено — иди теперь делай свои дела.

Хотелось найти этакий Apple Pay существующий в парадигме быстрой шторки: показать счёт, подтвердить транзакцию и получить итог — уйти в фейл, либо в победный хаптик и приятный звук финала.

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

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

И если разобрать покадрово видео-прототип, то можно заметить как блюрятся аватарки, как меняются цвета. На вебе сделать такое непросто, но возможно. Еще и спеку нужную разработчику отдать. Не по видео же строить?

В ходе прототипа выяснилось нечто технологично прекрасное:
1. Кружочки под аватаркой могут вливаться, словно капли, как делает это аватарка на экране настроек Telegram, вливаясь в Dynamic Island. (Для видео делать было лень, но в главное, что в проде).
2. Галку, да и ещё и с баунсом разработчик сам идеально не отрисует, значит нужно прибегать к Lottie.
3. Выяснилось, что Lottie можно красить на уровне CSS. Да и ещё как можно! Им можно прописать класс в SVG, прописав название класса в After Effects. Я был удивлён, что такая логика абсолютно незадокументирована (либо я её не нашёл).
4. Это значит, что можно сделать единую Lottie и всю физику переложить в этот рендер, а красить с нужным таймингом на уровне CSS.
5. А дальше всего-то прописать аккуратно тайминги, потому что синхронизация таких вещей все равно должна допиливаться уже в браузере.


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

Правда, плавное центрирование с учётом локализаций реализовать не удалось. Если у кого-то будут идеи как такую систему придумать — приходите в комменты!

А я пойду радоваться, что каждый, кто подключает свой кошелёк к Hamster Kombat иногда встречает такую анимацию на пути.

Дисклеймер: Fragment, который отрисован как мини-апп, был отрисован как концепт собранный на коленке. Планов о его существовании не знаю. Потому надо считать эту часть контента вымыслом.

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

Года три назад (ого, как давно-то!), когда я только начинал работать в Яндексе, то в первую свою неделю приехал в Красную Розу знакомиться с командой. Да и вообще узнавать чего там за дела такие происходят, как люди живут и как бы им поскорее помочь?

Ребята тогда активно готовились к запуску Y2 — новой версии поиска. Ничего не понятно, но к счастью очень интересно. Ребята носились как оголтелые, а в особенности готовились к запуску ролика к РК про Y2. В нём тогда участвовали Гена Лохтин и Антон Шеин, они тогда должны были рассказать про отдельную веху в этом апдейте, а Wylsacom — главное медийное лицо этой РК.

Вот только снимать ролик пора, а как демонстрировать новую главную — совершенно неясно. Поддомен не дать, не всё там ещё идеально готово. Прототип Фигмы так к скроллу не подвяжешь, да и ещё надо так, чтоб в Яндекс Браузере запустить.

Тогда вспомнил былое и написал красиво выглядящий прототип из картинок (ещё и без ChatGPT!) часа этак за три, чтоб его не стыдно было в ролике демонстрировать. До сих пор он лежит тут под забавным названием — https://ilyagrshn.com/nomoredesign/

Недавно тут наткнулся на него снова и приятно было взглянуть: приятные глазу анимашки, вёрстка из картинок, даже собранный из костылей скелетон, и отдельная чудесная деталь — мой говнокод. Неважно что внутри, работает же!

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

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

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

Есть дело!
Коли аудитории тут стало побольше. Периодически ко мне приходят разные друзья и знакомые, которые ищут дизайнеров. Ищут дизайнеров самых разных: кому-то запилить веб-морду, кому приложение, кому постер нарисовать. А я им не всегда могу помочь, а я хочу.

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

Чего греха таить: иногда аутсорс и нам в The Open Platform нужен. Так чего бы нам не поработать вместе?

Если вы берётесь временами за задачки на стороне и готовы к тому, что я буду к вам приходить — напишите мне! Лучше, конечно, в комментариях. А то как же я потом вас найду?

Люблю смотреть картинки, смело сразу показывайте их.

P.S. Если стесняетесь — пишите в DM (@grshn). Добавляйте хештег аутсорс к сообщению.

Решил немного стряхнуть пыль с After Effects и зарядить пару видео на конкурс.

Единственное, что мотивирует в них до сих пор участвовать — это новые челленджи.

Мне давно хотелось поковыряться и догнать Telegram в том насколько плавными получаются их видео в блоге. Сам я видео не делаю уже давно, а все вожжи отдал нашему motion-дизайнеру в The Open Platform.

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

И получилось!
Обилие блюров, плавнейших переходов (раньше так плавно я не умел делать никогда) и давно уже назревший апдейт интерфейса шаринга для iOS.

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

Из хорошего: у нас в The Open Platform этому могут ещё и научить дополнительно, если база имеется. А из прекрасного: внутри такой огромный багаж знаний, что научиться хорошему можно не только про крипту.

Так вот, наступило время вакансий! И их у меня аж целых три штуки.

Не из глубоко криптового: ищем сеньора в Tribute. Tribute — это один из ключевых инструментов автора в Telegram, когда нужно начать монетизировать свой контент. Теперь и там нужные ещё одни мощные лапищи.