Тонкий Кот

Всем привет. Дизайнер со скриптами на связи. Последний ролик был больше полугода назад. Все дело в том, что я после работы разрабом в MTS Digital ушел в другую сферу: разработку сайтов и приложений с помощью нейросетей. Так называемый вайбкодинг. Преимущество в том, что с помощью нейронок вы можете создавать сайты за считанные минуты (в том числе по фигма-макетам). Но на простых сайтах преимущества не ограничиваются. Нейросети позволяют создавать полноценные продукты с фронтендом и бэкендом без навыков программирования. Вот уже полгода я пилю контент по этой теме, и она только развивается. На новом канале уже куча образовательных и развлекательных видео. Залетайте, пока сфера только раскачивается: 📺 YouTube ТГ: https://t.me/vibecodings Рекомендую посмотреть: 1. 24 часа пытаюсь заработать на вайбкодинге с нуля без портфолио 2. Выполняю реальный заказ на вайбкодинг на фрилансе 3. Анимация видео по скроллу, как у Apple (классика моего канала по тильде) 4. Автоматическое тестирование сайта (нейронка сама кликает по кнопкам в браузере) 5. Создание шикарного дизайна с помощью нейронки Figma Make

Недавно мне попался сайт-генератор очень классного эффекта, который накладывает на любое фото и видео эффект размытия (матового стекла) по краям. Данный эффект используется в Apple Vision, выглядит очень прикольно, но по какой-то причине практически никем не был замечен, а ведь воссоздать его в вебе очень просто. В сегодняшнем ролике я покажу, как реализовать его на Tilda, а бонусом расскажу, как объединить его с другим классным эффектом от Apple. Видео доступно на YouTube: Матовое стекло ПО КРАЯМ фото и видео в Tilda, как у APPLE

Хочу поделиться с вами классным эффектом, позволяющим создавать интерактивные 3D сцены на сайте из обычной фотографии. Скрипт прикрепил снизу. Дам пару личных советов. 1. Экспериментируйте с размытием карты глубины. Размытие поможет убрать артефакты. 2. Эффект бомбически смотрится, когда на фото присутствует близкий к камере передний план Видео уже на канале. В поиске youtube вводи: 3D сцена из ФОТОГРАФИИ для любого САЙТА | Fake3D для Tilda (пошаговая инструкция)

В тильде не так давно появился личный кабинет для интернет-магазина. И я решил обновить имеющиеся на ютубе гайды по созданию магазинов. Я прекрасно понимаю, что такое видео направлено на новичков и владельцев малого бизнеса, коих здесь меньшинство. Несмотря на то, что я решил брать более обширные темы, чтобы захватить больше целевой аудитории и впоследствии заработать больше денег, скрипты и модификации как были костяком моего канала, так и останутся. В пятницу выйдет ролик по созданию интерактивного 3D из обычной фотографии, мы ещё тестируем и допиливаем скрипт. К обычным видео по модификациям добавятся общеразвивающие ролики по дизайну, созданию сайтов и приложений, расчитанные на бОльшую аудиторию. Надеюсь на вашу поддержку🤜🤛 Ролик про создание интернет-магазина, подключению ЛК и настройку платежей уже на канале

Пара нюансов касаемо эффекта жидкого стекла. В генераторе есть возможность выбрать две вариации эффекта: 1. Lightweight — легковесный эффект, можно использовать почти без ограничений. 2. Heavyweight — шикарный, сочный, но тяжёлый для рендера эффект. Используйте осторожно, тестируйте производительность на разных устройствах, в особенно, на мобильных

Как создать эффект Liquid Glass от Apple на Tilda Симпатичный эффект, который вызвал бурю обсуждений. Пользуйтесь аккуратно, следите за контрастом фона и текста, не повторяйте ошибок Apple) Ссылка на генератор эффекта: https://tonky-kot.ru/cool-stuff/liquid-glass-generator Инструкция уже лежит на ютуб канале "Дизайнер со скриптами"

Вы купили классный домен, а он оказался с подвохом? 👀 Согласитесь, обидно будет узнать, что раньше с вашего домена распространялся пиратский контент, реклама азартных игр или даже прон. Тем не менее, это звучит, как ситуация, которая может произойти с каждым. Если у вашего новенького домена окажется загубленная история, плохая репутация, значит можно забыть о беззаботном органическом продвижении. В статье рассказывается, как проверить домен на вшивость, а также, что делать, если ты уже приобрёл "испорченный" домен, и не хочешь с ним расставаться https://habr.com/ru/companies/ruvds/articles/883926/ upd. Только что выяснилось, что на один из моих старых доменов посажена прокладка казино👌 По всей видимости, эти нехорошие жулики отслеживают и скупают домены, за которые владельцы вовремя не заплатили

https://codepen.io/ksenia-k/pen/MWMObrY Симуляция жидкости с текстом — шикарный эффект, который точно вызовет у твоего пользователя вау-эмоцию🆒 По сути это обычная симуляция жидкости, с которой многие из вас знакомы, однако она дополнена возможностью установить в центре композиции любой свой текст, который будет с жидкостью красиво взаимодействовать. В комментариях оставлю краткую инструкцию по изменению текста, цвета, параметров шрифта #Жёлтый Подробнее про уровни сложности Инструкция по установке Tonky Kot

Для чего мы используем speech to text? #Внутряночка У нас потоковая студия, и каждый день мне приходится общаться с большим количеством потенциальных клиентов. Речь про созвоны, где мы знакомимся, обсуждаем детали задачи, и я пытаюсь продать наши услуги. Когда людей много, запомнить всех невозможно, поэтому мы очень быстро поняли, что наравне с брифом необходимо вести аудиозапись звонка, чтобы не упустить важных деталей. Но что потом делать с этой записью? Переслушивать — долго, даже на 2х. Так мы и пришли к тому, чтобы прогонять каждый звонок через нейронку, принимающую аудиозапись и выплёвывающую на выходе файл с текстовой расшифровкой, разбитой по ролям. После встречи эта расшифровка отправляется клиенту, а также закидывается в ChatGPT или DeepSeek, чтобы они выделили основные задачи, проблемы и боли клиента, которые мы можем закрыть. Результат мы используем для создания коммерческого предложения. Таким образом мы закрыли сразу 3 проблемы: 1. Мы всегда помним детали задачи клиента. 2. Отправляя клиенту расшифровку звонка по ролям или хотя бы саммари встречи, мы выгодно выделяем себя на фоне конкурентов. 3. Нам удалось практически полностью автоматизировать создание КП, сохранив их индивидуальность для каждого клиента. Для быстрой расшифровки и создания КП мы поставили локально Whisper WebUI. Когда нужно дорого-богато, с разбивкой по ролям, с оформлением в docx, с нашим логотипом, мы используем teamlogs.ru

Вы знали, что скругление элементов не ограничивается простым сглаживанием углов? С border-radius, на самом деле, можно вытворять очень интересные вещи Чтобы сделать такие кастомные скругления у тильдовских элементов, нужно: 1. Присвоить нужным элементам класс custom-radius 2. Сгенерировать скругления на сайте https://9elements.github.io/fancy-border-radius/ 3. Вставить в блок T123 данный код, и заменить в нём значение border-radius на то, что вы получили из генератора <style> .custom-radius .tn-atom { border-radius: 75% 25% 81% 19% / 27% 63% 37% 73% !important; overflow: hidden !important; } </style>

Наконец, дошли руки потестить flair.ai Попробовал фичу с генерацией продуктовых фото на основе png'шек на холсте. Прикольно, но впечатляет не сильно, ибо мы уже видели "вписывание" предметов в общую картину в фотошопе. А вот возможность обучить модель на изображениях своего товара, а затем сгенерировать на их основе крутые, студийные фото — ИМБА. На скриншотах видно, что для обучения нейронки я использовал фото низкого качества. Попытался сымитировать реальные условия работы) Получившиеся в результате фото можно прям щас брать и использовать на сайте, в рекламе, в карточках товаров. Однозначно, забираю сервис к себе в копилку. Будем использовать, когда у клиента недостаточно качественного контента. Тем более, что функционал бесплатен, хоть и с ограничениями по скорости обучения и количеству генераций

Вау-эффект, который удивил даже меня Вчера фронтендер предложил использовать в проекте Zustand — стейт менеджер (если кому-то это о чём-то говорит), о котором я ранее не слышал. Я решил погуглить, почитать про него и наткнулся на официальный сайт. https://zustand-demo.pmnd.rs/ Меня просто убили эти милашные иллюстрации, параллакс и симуляция глубины резкости. Это настолько прикольно, что я даже сохранил себе, как идею, которую когда-нибудь хотел бы реализовать. Поковыряюсь, пресёрчу. Возможно, попробую сделать что-нибудь похожее для тильды

https://codepen.io/swan4er/pen/raNxpza 3D сцена с небоскрёбами — сделана с помощью three.js. Движение камеры завязано на перемещение мыши, что может завлечь пользователя. При необходимости можно изменить цвета зданий, настройки тумана (в комментариях скрины, что и где можно менять). Думаю, где можно применить этот эффект. На ум приходит пока самое очевидное — недвижимость, аренда офисов и прочее. У вас какие есть мысли?) #Зелёный Подробнее про уровни сложности Инструкция по установке Tonky Kot

Мелочь, о которой не задумываешься, но которая однажды тебя выручит😸 Недавно потребовалось указать ссылку на конкретный блок чужого сайта, однако, у блоков не было идентификаторов, чтобы создать якорную ссылку аля domain.com/#anchor Что делать в такой ситуации? К ссылке можно добавить #:~:text= с текстом, который надо выделить на странице. Сработает, как поиск по странице Ctrl+F: выделит и проскроллит юзера до указанного текста. Единственное, работает не во всех мобилках (айфон в пролёте). На десктопах — всё четко во всех браузерах и ОС. Рабочий вариант: https://tonky-kot.ru#:~:text=Как мы работаем