Claude Design уничтожает рынок дорогих лендингов

Ребят, я уже час записываю вот это видео. Я вам хочу сказать, что те результаты, до которых я в этом видео дошёл, я сам не ожидал, что будет так круто. Обязательно досмотрите до конца. Это вам просто голову разорвёт. Добрый день. Меня зовут Николай Хлебинский. Вы находитесь на канале Экшн План. Сегодня обсуждаем революцию в мире искусственного интеллекта. Если вдруг вы вынашиваете идею какого-то проекта или не знаете, чем в принципе заняться, но хочется с искусственным интеллектом поиграться, да ещё и денег заработать, или, наоборот, активно работаете над каким-то проектом, но не понимаете, как с помощью искусственного интеллекта кратно повысить его эффективность, тогда это видео для вас. В этом видео я хочу поделиться набором практик и лайфхаков, которые просто разорвали мне голову. Они будут все сосредоточены в области создания очень крутых продающих веб-сайтов и лендингов. Так что вы сможете стартовать быстро проверить гипотезу для какого-то проекта, о котором вы очень давно думаете, сделать ндоOS и протестировать гипотезы быстро и практически бесплатно для проектов, над которыми вы работаете прямо сейчас. Но если вы не знаете, чем заняться, вы приобретёте до конца этого видео навык создания очень крутых профессиональных сайтов, которые можно просто взять и начать делать на заказ.

Я подготовил техническое задание на создание сайта через чат GPT. Сейчас я вам покажу, как такие технические задания делать, как их готовить. У меня для этого есть отдельный промпт. Так вот, если вы пробовали раньше создавать сайты через искусственный интеллект, через любое, то вы получали результат, который выглядит, ну, вроде как симпатично, но это не то, что вы хотели бы видеть на своих проектах. Давайте посмотрим, что можно сделать обычно с техническим заданием, хорошо подготовленным с помощью последней модели Antropic Clod opus 4. 7. Я подготовил техническое задание на создание сайта. Оно находится в файле. txt. Пожалуйста, подготовь план создания сайта и реализуй его. Запустили создание сайта. Давайте подождём пару минут и посмотрим, что будет. Вот такой у нас получился сайт. Первый экран по типографике выглядит прикольно, но, как вы видите, простовато. Следующие блоки тоже очень отдают стилем, в котором и работает по умолчанию. Я уже привык такие штуки видеть. Вот здесь вот, как видите, вёрстка поехала, то есть сделано не то, что хотелось бы получить. Ну, в общем, сайт выглядит простовато. Здесь вот тоже вёрстка поехала. Э, короче, это какая-то вот базовая страничка, которую, ну, можно, наверное, использовать для внутренних ресурсов, но это некрасивый какой-то маркетинговый материал интересный. Цель этого видео показать вам вот это. Как сделать за минуты вот такого вида сайты, вот такого вида лендинги, где всё красиво, где всё нестандартно, где всё мигает, прыгает, летает и выглядит, ну, я бы сказал, что дорого. Что нам для

этого понадобится? Первое, нам понадобится вот такая вот программа, которая называется VS Code, Visual Studio Code. Это так называемая IDE Integrated Developer Environment, то есть программа, в которой пишется код, создаются программные продукты и в том числе сайты. Ничего страшного, если вы ничего не знаете про программирование, код писать нам не придётся сегодня вообще. Программа - это бесплатная. Чтобы получить её, нужно зайти на сайт вот такой вот visual. com. И здесь она скачивается для Виндоуса, для Мака, для Линукса. для любой операционной системы. Это мой выбор. Программа бесплатная, очень удобная, и вам тоже я её с удовольствием рекомендую. Внутри этой программы нам потребуется доступ к LLM, к искусственному интеллекту, к большой языковой модели. Для этого идём вот сюда вот в раздел Extension, находим плагин клодкода, устанавливаем его и вводим свой ключик. Вот эта история уже платная. Для того, чтобы пользоваться клодом, а конкретно клод-кодом, нам потребуется платный тариф. У клода есть бесплатная версия, где вы можете початиться, так же как и с любыми популярными языковыми моделями ими. Но вот эта вот штука, которая называется клод-код, который будет писать нам сайты, она находится только в платном тарифе, начиная вот с этого семнадцатидолларового тарифа. В целом можно подключить и другую LLM, в том числе и бесплатную. Для VS-кода есть очень много плагинов, экстеншнов. которые всё, что угодно вам подключить могут. Клод - это мой выбор, потому что я считаю, что на текущий момент, вот на момент записи этого видео, это самая лучшая модель для создания сайтов. Есть очень хорошие, в том числе китайские бесплатные openсоourсные, которые тоже можно использовать. Моя задача вам сегодня показать, что можно сделать. Это видео носит характер образовательный, поэтому я буду использовать самую лучшую модель, а вы какую захотите. Дальше нам

с вами нужно будет пойти в чат GPT. Здесь мы сгенерируем для клода ТЗ. Что нам для этого понадобится? Значит, во-первых, нам понадобится для этого вот такой вот километровый промт, который я подготовил для этой записи. Как обычно, как только это видео набирает 1. 000 лайков или 1. 000 комментариев, в зависимости от того, что произойдёт раньше, все промты, все материалы из этого ролика будут выложены у меня в Telegram-канале. Ссылочка в описании под этим видео. Подписывайтесь, все материалы будут там. Кроме того, вместе с длинным промптом я добавляю в Chat GPT текстовый документ. В этом текстовом документе находится транскрибация моего рассказа о проекте. Я хочу сделать сайт для очень важного для меня проекта. Уже более полутора лет я лидирую Mastermind. Это закрытый клуб для предпринимателей с оборотом от 100 млн руб. в год, внутри которого мы собираемся раз в квартал на 4 дня и за закрытыми дверьми в режиме персонального совета директоров погружаемся по очереди в бизнескейс каждого участника группы на несколько часов и ищем ответ на один простой вопрос: что в ближайший квартал мне нужно делать кардинально по-другому, чтобы изменить динамику своего бизнеса? Дело в том, что если посмотреть на последние 12 месяцев, по-настоящему ключевых решений, которые, ну вот реально повлияли на бизнес, у каждого из нас было не так уж и много. Если бы мы знали ответ на вопрос, что мне надо делать не так, как я это делаю сейчас, и этот ответ на этот вопрос был бы нам очевиден, мы бы уже бы давно эти решения приняли и действия сделали. Но это не так. Вопрос - это очень сложный, самому на него ответить тяжело. Для этого у нас есть вот такой вот мастрмайнind стратегический, который называется Совет директоров. И мы ответ на этот вопрос для каждого бизнеса ищем в группе. В чат GPT я прикладываю транскрибацию того, как я рассказываю про этот продукт. Когда кто-то про него меня спрашивает, я, ну, наверное, минут 30-40 объясняю детали, нюансы, методологию, почему это работает, какие у нас есть кейсы, примеры и так далее. И вот этот вот рассказ я просто один записал и перевёл его в текст сюда в чат GPT прикладываю. Запускаем этот промт в работу. Он задаст сейчас несколько вопросов. Э вот то, что он понял из эго файла текстового, из моей расшифровки. И теперь он хочет вот, чтобы я на вопросы поотвечал, что именно должно быть на сайте, что именно не должно быть, исходя из того, какие я ставлю задачи перед сайтом. Вопросов довольно много. Дальше он пошёл своё делать резюме описание, так как он его понял. Ну, в общем, есть вот такая вот длительная работа. Мы её немножечко ускорим. Всё, ответы на вопросы я подготовил. Попросил чат GPT подготовить для меня техническое задание для создания сайта. Он его сделал, оно очень длинное. Читать и разбирать его толком я не буду. Для цели этого видео я полностью чат GPT доверюсь и пойду на следующий шаг. В

следующем шаге мы заходим в наш VS-код, к которому уже подключен клод от компании Antropic. Эта программа для каждого проекта нуждается в папке. Я такую папку уже создал и просто в неё сейчас перейду. Вот так вот она выглядит. Давайте коротко вам расскажу, что у меня в этой папке есть, потому что она не та, что создаётся по умолчанию. Я сюда много чего добавил, и это много. Это очень важная часть того, что дальше будет происходить. Просто так этого здесь не будет, но я всем этим с вами в обязательном порядке поделюсь. Первое, что у меня есть в этой папке - это файлик, который называется ClД MD. Так устроена система, что клод при своём запуске, там, где он расположен, там, где он установлен, в первую очередь будет искать этот файл. Этот файл - это системная инструкция, в котором написано, как клод должен себя вести. Я вам расскажу поподробнее про то, э, что есть в этой системной инструкции. Я буду по ходу видео сюда ссылаться и возвращаться. Этим файлом я тоже поделюсь в своём Telegram-канале. Всё в тот же момент, когда это видео соберёт либо 1. 000 комментариев. Поэтому, пожалуйста, нажмите лайк, оставьте любой осмысленный комментарий. Это поможет продвинуть этот ролик и меня смотивирует выпускать больше роликов такого характера. С чего хотелось бы начать в этом файле? того, что здесь написано в первую очередь всегда запускай frontend design skill и UI Pro Max Skill перед тем, как написать любой код в любой сессии без каких-либо исключений. Значит, каждый раз, когда клодкод запускается, он идёт в этот файл, читает все инструкции, которые здесь есть, и пытается их исполнить. И

первая же инструкция ссылается на скилы. Что такое скилы? Скилы - это системные промпты. инструкции для М, по которым, которыми он руководствуется при выполнении задач, которые мы ему поручаем. Здесь у меня установлены уже два скила. Первый скилл называется frontend дизайн skill. Второй называется UI UX Pro Max Skill. Это у публичные общедоступные скилы, которые вы без проблем можете найти. Ссылочки на них я также оставлю в материалах к этому выпуску, который буду в своём Telegram-канале публиковать. Здесь написана довольно длинная инструкция о том, как нужно подходить к дизайну, к рисованию интерфейсов. Это просто необходимо для того, чтобы мы получали не вот эти вот дефолтные, сразу же бросающиеся в глаза своей иишностью интерфейсы и результаты, а чтобы мы получили реально дизайн крутой. Сейчас увидите, как это работает. Просто следите за руками и наблюдайте за тем, что происходит. Кроме того, я положил сюда несколько материалов. Я сделал вот такую вот папочку Asets. Здесь лежит файлик tz. txt. Сюда я скопировал полностью всё, что сгенерировал чат GPT. Кроме того, я положил сюда ту самую транскрибацию. Пускай она будет здесь, чтобы клод имел возможность э посмотреть, о чём вообще этот проект, что я о нём сам думаю. И ещё я сюда приложил презентацию, которую я показываю, когда мы начинаем каждый матер, я показываю вот эту презентацию. Она примерно из псяти слайдов. Некоторые я отсюда удалил в начале каждого мастерманда, чтобы объяснить, как работает этот проект, как устроен наш совет директоров, какие у нас правила, что мы делаем, что мы не делаем, как мы это делаем для того, чтобы работа прошла максимально эффективно. И эту презентацию я сюда тоже приложил, чтобы клод на неё посмотрел, потому что клод может анализировать изображение. И этот навык нам понадобится и в презентации, и кое-где ещё дальше. И там, где я вам это покажу, вам это голову просто разорвёт.

Что мы делаем дальше? Запускаем в VS-коде окошко с клодом через экшн, который я подключил через marркипйс экстеншенов. Это делается всё очень просто. И как только я свой ключик сюда введу, он у меня уже введён, но настройка здесь очень простая, я могу с Клодом общаться точно так же, как я бы это делал в браузере. Я могу просто сказать ему привет, отправиться запрос в элмку, и вот он мне ответит: "Привет". Чем я могу тебе помочь? Я могу любые вопросы задавать, ээ, всё, что угодно делать. Что дальше я ему здесь говорю? Я хочу сделать сайт для своего проекта. Я подготовил для тебя техническое задание. Оно находится в файле. txt. Кроме того, я подготовил для тебя транскрибацию своего описания проекта, сайт, для которого я хочу сделать. И в папочке Presentation лежат слайды моей презентации, которую я показываю, когда про проект рассказываю. Проанализируй все эти материалы и подготовь план для создания сайта. А, кстати говоря, с искусственным интеллектом я общаюсь исключительно голосом. Текстовые задачи я пишу крайне редко. У меня для этого есть отдельный софт, который я написал сам с помощью искусственного интеллекта. Если интересно рассказать, как это сделать так, чтобы эта штука вообще ничего не стоила, работала быстро, удобно, вот так, как вы сейчас это видите, напишите в комментарии, сделаю для этого отдельное видео. Так что здесь надо ещё подсветить важного, что поскольку это вот среда для разработки, здесь есть набор таких историй, которые делают разработку гораздо удобнее. В частности, можно не просто сказать, что вот файлик так называется, а можно прямо подсветить этот файлик. Для этого мы пишем символ собака и начинаем писать название этого файла. Здесь в выпадающем списке этот файл найдётся. И видите, он здесь так синенький подсвечен. Это значит, что моя команда будет ровно на этот файл ссылаться, и здесь не будет никакой двусмысленности, поэтому, ну, как бы это сделает чуть-чуть точнее. Дальше подготовил для тебя транскрибацию описания своего проекта. Сайт, для которого я хочу сделать, давайте скажем, что здесь текстом допишу. Она лежит в файле. Точно также начинаю писать название файла. И вот он здесь у меня появляется. Папку так подсвечивать нельзя, поэтому я ему просто скажу, что в assets с SL presententation лежат слайды моей презентации. Проанализирую все эти материалы, по созданиние сайта. Что ещё

мне удобнее делать? Не рекомендую вам с этого начинать. Это включить вот здесь вот режим, который называется Bypass Permissions. Что это означает? По умолчанию установлен вот этот вот режим с иконкой такой руки, которая говорит: "Стой, остановись! " И написано ask before edits. Это означает, что клод будет спрашивать у вас разрешение на любые значимые изменения. А вот это вот режим, в котором он никогда ничего спрашивать не будет и будет всё делать по умолчанию. Здесь же есть настройка, которая называется Efort. Она у меня установлена в extra high. Давайте, наверное, её пере переведём вот сюда вот просто в high. Это объём рассуждений, которые он будет делать. И это влияет и на результат, и на количество сожжённых токенов. Конечно, если бы мы делали сейчас какой-то боевой важный проект, я бы, может быть, даже поставил на максимальный уровень. Но для цели демонстрации нам вот этого более чем хватит, я вас уверяю. Вы только подождите, увидите результат. Вы даже представить себе не можете, что нас там ждёт в конце. Всё, значит, вот этот режим выставляю, чтобы он ничего не спрашивал. Токенов чуть-чуть сэкономим. Поехали. Что здесь важно увидеть? Что сразу же с нулевой секундой он пошёл смотреть на Front-Eend Design Skill и на UI UX Pro Max Skill, потому что он прочитал файл Clot MD, потому что это то, с чего этот файл начинается. И он строго выполнил инструкцию, пошёл э изучать всё, что здесь происходит. Дальше, э, он пошёл искать, э, во-первых, презентацию, на которую ему я указал. Вот он папочку нашёл и сейчас начал изучать слайды. Вот, вот мы здесь видим, что он прочитал слайд один, слайд, слайд 3, изучал изучил все материалы. Кроме того, он ищет папочку, которая называется бренд assets. У меня такой папочки нет. На эту папку есть ссылка в файле. Вот здесь вот про неё написано. Всегда проверяй наличие папки Бand Assets до того, как создавать какой-либо дизайн. У моего проекта нет никакой бренд-системы, нет логотипа, шрифтов, цветов, фирменного стиля. Если у вас это есть, тогда вы создаёте папочку вот с таким названием, кладёте туда всё, что есть, и клод будет использовать все элементы вашего фирменного стиля для того, чтобы сделать ваш дизайн максимально внутри вашего брендбука. Что дальше произошло? Он всё посмотрел, э-э, значит, проанализировал весь ТЗ, структуру, технический план, ээ, что он предлагает, прежде чем кодить. Э палиitра Тёмный. Э, я не хочу сейчас ничего решать. Я хочу, чтобы мы первую версию получили абсолютно на усмотрение искусственного интеллекта. Я не написал ни одной строчки кода, не читал техническое задание. Мы вот вы всё видите, мы разрабатываем с вами в реальном времени. Поэтому я просто говорю ему: "Пожалуйста, прими все решения самостоятельно, исходя из эффективности и результатов, которые я хочу получить". Сделай крутой дизайн сайта. Приступай. Всё, работа началась. По сути, я дал ему команду: "Сделай крутой дизайн сайта". Понимаете, в чём дело? Мы же не можем сказать искусственному интеллекту: "Просто сделай крутой сайт". Будет сделано непонятно что. Но если мы пройдём через вот эти вот этапы, подключим вот эти скилы, системные инструкции, которые я выдаю, то результат вас, ну, мягко говоря, удивит. Сейчас посмотрите, что здесь происходит. На это потребуется некоторое время. Пока клод думает, я хочу показать вам ещё один инструмент. Вот эта штука

называется clotддизаign. Это инструмент, который появился совсем недавно. Ему буквально 1-д недели на момент записи. Дизайн оброс таким количеством лайфхаков, я вам ещё даже половины не показал. Антропик это увидели и решили выпустить отдельный программный продукт, который очень похож на то, как устроены инструменты для вайп-кодинга, такие как repли, такие как lavable и прочие. Мы здесь с вами тоже сейчас поиграемся, сделаем дизайн. Я назову здесь новый проект Mastermind. создам новый проект и в этот проект загружу всё то же самое практически я загружу сюда текстовое техническое задание, которое подготовил чат GPT, а также свою транскрибацию. Картинки сюда загружать будет долго руками. Я этого делать не хочу с своими слайдами, с презентацией, но я вам

покажу сейчас ещё один лайфхак, который мы с вами сделаем. Поскольку мы хотим, как правило, дизайн разнообразный, и это такая вкусовщина, которая для каждого человека очень индивидуально, здорово работают истории референсные. Если вам нравится какой-то дизайн, мы можем искусственному интеллекту сказать, чтобы он взял его за основу и на него ссылался при создании брендсистемы. Например, мы можем зайти вот на такой сайт drible. com с тремя буквами Б. Здесь есть раздел Lending page. Вы можете искать здесь что угодно по стилям, по направлениям бизнеса, по вёрстке, по шрифтам, по дизайнерам, в общем, по всему, что вам только может понравиться. Я выберу на угад какой-то один ресурс, который мне почему-то вот прямо сейчас импонирует. Ну давайте, например, будет вот этот. Что я дальше с ним сделаю, с этим дизайном? Э, дальше я сделаю его скриншот. Вот так вставлю этот скриншот сюда же в чат. Вот он у нас здесь появился. И теперь такое задание отдам клод дизайну.

Я хочу сделать сайт для проекта, который для меня очень важен. Техническое задание находится в файле. txt. Моё описание проекта находится во втором текстовом файле mmranscript. txt. Кроме того, я предложил для тебя скриншот. Я хочу, чтобы ты опирался при построении дизайна именно на этот скриншот и игнорировал все остальные указания на дизайн, который находится в техническом задании. Пожалуйста, возьми этот скриншот за основу при проектировании дизайнсистемы. У меня там в ТЗ есть некоторые указания на стиль. И чтобы не было никаких пересечений, я ему специально сказал: "Обрати внимание на этот скриншот". Вы можете взять много скриншотов, вы можете взять те, которые вам понравились, из места, которые вам понравились. Вот такого вот технического задания будет достаточно. Всё, запускаем его в работу. Посмотрим, что сейчас получится. Вы для себя забирайте, что нам необходима. Системная инструкция clod. md, нам необходимы скилы frontend дизайн и UI UX Pro Max публично, общедоступно. Это всё бесплатно. И мы можем использовать референсы, сделав просто скриншот любого сайта. или какого-то другого материала, который вам нравится визуально. После того, как клод дизайн, его можно использовать только в браузере, деспного приложения для него нет на текущий момент. Как только он проанализирует материалы, он задаёт вопросы уточняющие. И здесь вот прикольно они сделали, что на эти вопросы надо отвечать кнопками. Это очень удобно. Я считаю, что это очень крутая находка. И остальным инструментам для вайпкодинга этого сильно не хватает. Язык сайта только русский. Как назвать клуб на сайте? Совет директоров. Направление цветовой палитры. Э, выберите акцент. Не знаю, пускай будет вот такой. Э, так, среда коллективного стратегического мышления. Первый экран. Вообще здесь есть такая вот кнопочка. Давайте, знаете, как сделаем? Здесь есть такая кнопочка decide for me. Она переводится дословно как прими решение за меня. Вот мы здесь везде сейчас скажем, чтобы искусственный интеллект принял решение за меня. Вот это прикольно. Ползунок, насколько строгим должен быть тон по шкале от нуля до 100? Вопрос, конечно, грандиозный. Вот так. Куда уходить заявки? Что-то критичное. Это нам всё пока не интересно. Всё, поехали. Отдаём эту историю в работу. Искусственный интеллект самостоятельно полностью принимает решение о том, что будет дальше. Он создал план. Сейчас он

по этому плану пойдёт работать. А мы переключаемся в VS-код. Мы видим, что здесь уже создался файлик, который называется index. html. Этот файлик уже длинный, в нём уже за 1. 000 строк. Я не написал ни одной строчки кода. Читать этот код мы не будем, редактировать его мы не будем. Знания HTML, программирование, CSS, JavaScript, ничего это не нужно. Что ещё интересное здесь произошло? Обратите внимание, что вместе с работой здесь появилась папочка, которая называется Temporary Screenshots. Временные скриншоты. Откуда она появилась? В моём файле. Есть инструкции, которые описывают порядок работы со скриншотами. Эклод должен делать скриншоты сайта, которые он пишет. Видите, вот здесь вот добавились файлики. Он сам написал серверную часть, инструменты, которые снимает скриншоты, сам анализирует картинки. Давайте посмотрим, что на скриншотах сделано. Вот здесь вот видно, что сайт разделён на блоки, что первый блок уже заполнен. А вот здесь на втором скриншоте видно, что блоки заполнены уже все. Специально показываю мелко, специально показываю быстро, чтобы ничего не спойлерить. Сейчас дождёмся, пока результат появится готовый, и я вам его полностью покажу. Так, ну что, ээ

cлод дизайн завершил работу. Он сделал это значительно быстрее, чем V-Cд, потому что он не заморачивается с этими системными инструкциями. Ну, вернее, не какие-то у него свои, которые нам недоступны. Мы их редактировать и просматривать не можем. Он не делает скриншоты, как я вам только что показал. Сейчас вот он проверяет, что сайт работает нормально. У него есть такой встроенный режим проверки, но мы на него уже можем смотреть. Давайте, показываю вам, что получилось в первой нашей итерации. 3 2 1 Вот такой вот у нас получился результат. Ну что, выглядит довольно миленько. Смотрите, что здесь есть заголовок: прикольные шрифты, вёрстка, блоки под наклоном с нахлёстом друг на друга. Это довольно сложная вёрстка. Скажите, выглядит ли это, как будто бы это сделала Иишка только что за несколько минут или всё-таки это выглядит как классно продуманный сайт с реально дорогим дизайном? Я вам так скажу, полгода назад, ну, где-то тире год назад, вот это стоило бы миллионы. Сегодня я получил это бесплатно. Ну да, клод платный стоит 17 долларов в месяц. Я сжёг на несколько долларов токенов, но почти то же самое вы сможете получить. на бесплатных моделях. И то же самое, если будет несколько доработок. Смотрите, какая форма красивая. Здесь же всё продумано. И это делается, ну, очень легко. Я на естественном языке объясняю искусственному интеллекту, что я хочу, рассказал про свой проект. Он сам сделал ТЗ, сам сделал прикольный сайт. Здесь же уже сразу готова вот тёмнаясиняя э тема. Вот. Э, прикольно, что в этом инструменте есть, э, какие-то вот ещё пресетные штуки, между которыми я могу попереключаться. То, что он подготовил здесь некоторые метафоры, э, матрицы компетенции, документ по декларации. В общем, это всё части методологии нашей работы. Здесь же, что ещё прикольно, что я могу отредактировать любой элемент. Допустим, я хочу сказать, вот не ставка на квартал, хотя это часть мы делаем ставки, да, того, чем мы будем заниматься. Эээ, образ результата, подпись участика. Ну, допустим, вот эта цифра 62 мне не нравится. Я хочу заменить её на 65. Это делается вот так просто. Не надо отдавать отдельный промт, сжечь дополнительные токены. Я просто нажимают, выделяю блок, который я хочу подкорректировать. Здесь есть все его характеристики: шрифт, цвет, прозрачность, отступы и так далее. Текст я могу сам поменять. Инструмент классный, он сразу же доступен. Я могу вот здесь вот нажать Share и получить на него публичную ссылку, так, чтобы отправить её кому-то, другу, коллеге, показать, пообсудить результаты и так далее. Мне кажется, это просто отвал

башки. Ещё один лайфхак, который вам хочу показать, который, ну, просто вас повергнет в шок, если вы ещё не там, как просто какой крутой дизайн мы теперь можем делать. Заходим вот сюда. Сайт называется 21st. de Ф. Здесь собраны для самых разных задач компоненты, которые мы можем переиспользовать. Анимационные, интерактивные, которые сделают ваш дизайн, ну, просто на уровне супердорогих сайтов. Например, мне нравится вот такой вот элемент с фоном. Я хочу, чтобы у меня на сайте был такой же. Здесь специально для этого есть вот такая кнопочка, которая называется copy prompt. Я копирую этот промт. Он скопировался в буфер обмена. Я иду в clддизаign. То же самое. Я могу пойти в э VS-код. И говорю здесь я нашёл вот такой прикольный дизайн анимационный для фона. Пожалуйста, сделай мне такой же. Вот инструкция для него ниже. И копирую сюда вот эти вот 373 строчки, которые я взял оттуда. Всё. Отправляю это на ээ работу искусственному интеллекту. Через некоторое время всё будет готово

а я переключаюсь на Visual Studio Code. Что здесь произошло? Всё, он говорит, готово. Сайт собран. Посмотрите, сколько скриншотов он сделал, целую пачку. Он собрал файл лендинг. Он собрал сервер, который работает и доступен у меня по вот такому адресу в браузеру. Это значит, я могу какую-то серверную логику здесь тоже накрутить. отправку формы или ещё что-нибудь. Коротко описывает, какие дизайн-решения он сделал, и просит меня загрузить фотку мою, чтобы положить её на сайт, подключить форму, придумать, как это сделать. Ну и дальше ещё какие-то доработки открыть. Ну что, идём смотреть, что получилось. 1 2 3 Открываем. Вот такой сайт получился. Совет директоров. Логотип придумал сам. закрытое членство, строгий отбор, NDA, внешний совет, закрытая среда коллективного стратегического мышления. Группа собственников бизнеса, работающая как ваш внешний совет директоров, помогает находить решение, которые меняет динамику бизнеса. 10 млрд, это, кстати, факт, я кому-то рассказывал в транскрибации, это есть 10 миллиардов совокупный оборот, даже больше 10 млрд бизнесов, собственники которых собрались в зале. Это наш минимальный порог, 100 млн. 16 дней у нас четыре сессии в году по 4 дня. 16 дней стратегического мышления. Мы пишем, э, декларации по итогам страссий. И, ну, блин, это очень красиво. Посмотрите, что текст поднимается, появляется анимационно. Здесь рассказывается всё, что происходит. Результат работы группы - это ставка на действия ключевые на квартал, которые не случатся сами собой. Такая работа возможна только в группе. Здесь изложена моя логика про то, как мы через рефлексию переходим к мышлению из реактивного поведения. Как влияет качество среды, в котором мы собираемся? У нас в обязательном порядке подписывается NDA всеми, кто присутствует на процессе. У нас исключён конфликт интересов. У нас, э, нельзя с телефоном быть во время работы. Жёсткие правила. Каждый участник группы может заблокировать любого кандидата на участие. Вот здесь какой-то рассказ про меня. Короче, очень круто всё это выглядит. Напишите в комментариях, что вы думаете, как вам такой дизайн сайта. Я, честно говоря, в шоке. Я это видел, конечно. Я этим пользуюсь уже большое количество, ээ, хотел сказать, лет. Никакой лет, это появилось вот недели, месяцы, может быть, у нас на кончиках пальцев просто текстовыми промптами доступен вот это. Вы же видели, я рассказал про свой продукт, да, и у меня есть про него рассказ. Ну, так и вы можете про свои проекты рассказать. А дальше я сказал: "Вот тебе промт, промт я выложу лайки, комментарии с вас. Вот тебе промт, сделай ТЗ". ТЗ запихнул сюда, сказал: "Вот тебе ТЗ". Поэтому ТЗ сделай классно, всё реши за меня сам. И вот такой вот результат я получил. Клод

дизайн всё ещё думает над задачке, которую ему выдал. О, кстати, вот он её сделал. Давайте вместе с вами её сейчас посмотрим. Ну, посмотрите, как преобразился сайт. Видите вот эту анимированную штуку на фоне? Насколько эта история добавляет крутости и дороговизны. Блин, это просто невероятно. Обратите внимание, что он добавил эту историю только в этот блок. Если я захочу, я подберу себе какой-то другой графический элемент, любой. Здесь их миллион. Здесь есть и фоны такие красивые, и какие-то вот линии летающие. Они будут за мышкой следовать, и какие-то паттерны и трансформации текста, и видеовставки, и вот такие вот трёхмерные изображения. В общем, всё, что угодно я могу сказать ему: "А ты теперь на второй экран, вот в эту секцию сильному предпринимателю нужно не информацию, а нужно честный взгляд из позиции собственника снаружи". Вот сюда теперь добавь вот эту анимацию, и это будет, ну, просто грандиозно. Так, ну, я

ещё некоторое время посидел, поигрался, сделал всё полностью на свой вкус и хочу продемонстрировать вам финальный результат, который у меня получился. Я использовал все те лайфхаки, которые я вам показывал, и ещё некоторые даже сверху, которые я сейчас тоже покажу. Смотрите, что у меня получилось. Значит, во-первых, для меня искусственный интеллект подобрал домен. Я как только его увидел, сразу зарегистрировал strategicbard. ru. На этом домене у меня крутится сайт для этого стратегического мастермайнда совет директоров, который я лидирую. Можете зайти сами на этот сайт, посмотреть, как он выглядит, как он выглядит с телефона, компьютера. Ссылочку оставлю на этот сайт тоже в описании. Что у нас здесь есть? Ну, во-первых, здесь есть анимированный фон. Видите, здесь такие чки летают. Во-вторых, на втором экране фон тоже анимированный, но анимация другая. И вот здесь вот на третьем экране тоже фон с анимированными такими частичками, красивыми. Дальше у меня здесь вот такая вот анимация мозгов таких. 15 мозгов. э, демонстрируют 15, как бы, как это, 15 мозгов, э, представляют из у себя 15 участников, которые соединены в единую сеть, проецируют решение и видите, они вот так вот реагируют на движение мышкой. Здесь у меня сейчас пишется экран, э, ещё запущена запись, поэтому немножко притормаживает, потому что оперативка вся занята, но выглядит это грандиозно. Мне очень нравится. На мобиле этого не видно. Эту анимацию я создал через клод самостоятельно. Если хотите, запишу отдельное видео, как самому такие анимации создавать любые по вашей фантазии. Это точно так же просто, как и скопировать промт с сайта, который я вам показал чуть раньше. Что у нас тут есть? Ну да, здесь есть вот эти все элементы, которые рассказывают про совет директоров, состоящий из предпринимателей. То есть у нас в сообществе, в нашем сути каждый участник может получить персональный совет директоров из действующих предпринимателей с суммарным оборотом выше 10 млрд руб., которые исходят из позиций инвестора. Вот это в предыдущей версии не было. Где-то в моих рассказах кому-то это было, что мы занимаем позицию инвестора. Мы анализируем кейсы участников друг друга так, как будто бы это мой собственный бизнес. Но мы используем коллективные когнитивные архивы, потому что совокупная компетенция группы - это 10 млрд. И этого достаточно, чтобы практически любой вопрос в бизнесе решить. Здесь рассказывается, как устроена система, э, как выглядит наш подход к мышлению, почему это пространство безопасно для обсуждения, кто у нас в составе, отрасли участников, крупнейшие участники по обороту, как мы отбираем чуть-чуть про меня и так далее. В общем, ребят, если у вас бизнес от 100 млн в год плюс, зайдите, почитайте, если откликнется. Здесь внизу есть форма. Эту форму я также через ишку очень быстро заставил работать. Так что те, кто её заполняет, переходят прямо ко мне сразу же. Если опять же непонятно, как это сделать интересно, напишите в комментарии, сделаю отдельное видео, расскажу. Так

ну и ещё раз, ребят, вот что мы сегодня получили. Значит, вот это была первая версия, которая просто сделана промптами и транскрибацией моего рассказа. Никаких усилий я к ней не прикладывал. Это всё произошло, наверное, минут за 10-15. Вот это мы с вами делали параллельно. Здесь уже добавилась классная анимация. Вы теперь знаете, как добиться такого же результата очень быстро. Все лайфхаки вам рассказал. Первый - это клод MD с инструкциями. Второе - это скилы, которые называются Frontend Design Skill и UI UX Pro Max. Третье - это часть Clot MD про активы бренда, если они у вас есть, и workflow с скриншотами. Четвёртое - это анимации на 21st Def и референсы любых сайтов скриншотов, которые вам нравятся. Пятое, хотя, наверное, в списке это будет какое у нас нулевое, да? Это через чат GPT генерация по моему промту технического задания для того, чтобы всё это случилось. Ну и дальше вы голосом объясняете или текстом, как вам удобнее, искусственному интеллекту, что и как вы хотите доработать, докрутить. Я заморочился, посидел, и вот такая вот красота у меня получилась. С телефона выглядят тоже очень красиво. Скажите, какой дизайн вот из этих вот трёх вам лично ближе? Я остановился на этом. Он у меня уже опубликован домене, который тоже выбрал искусственный интеллект. Я вот как человек, который работает с digжитал бизнесом уже, наверное, лет 20, но для меня это всё ещё выглядит как какая-то просто магия. Я помню, как я по книжкам учился писать HTML-код, потому что не было ещё. Интернет был диалапный, вот такой вот я динозавр старый. Интернет был по телефону медленный. У нас не было не то что обучающих видео, видео в интернете не было, в принципе. Сегодня я вам, расположенным по всей стране, по всему миру, объясняю, как голосом на естественном языке за минуты, за какие-то единицы долларов искусственному интеллекту объяснить, и он сделает вот такое. Вы только

подумайте, какие возможности нам всё это открывает. Если у вас есть идея проекта, продукта, вы хотите выйти в новый регион, в новую страну, в новый город, вы вот так вот, как я вам сейчас описал, делаете лендинг, сайт, описываете свой продукт, у вас на это уходит минуту, несколько долларов. запускаете трафик, запускаете компании в соцсетях ЯндексДирект, смотрите на спрос, конвертируется или не конвертируется, и, исходя из этого принимаете решение, идти уже в боевой продукт или не идти. Второе, таким же Макаром можно делать не только сайты, но и, естественно, презентации. Можете сохранять всё это в PDF, PowerPoint и делать крутейшие публичные выступления. Третье. Если вы уже работаете над каким-то проектом, скажите, пожалуйста, что останавливает вас от того, чтобы прямо после просмотра этого видео сгенерировать 5, 10, 50 таких лендингов. Вы же можете кучу референсов взять, кучу дизайн стилей, кучу подходов протестировать разных смыслов, заголовках и так далее. сделать кучу вариаций ваших лендингов и трафик, который у вас уже есть, начать разделять для того, чтобы смотреть, что работает лучше и увеличивать конверсию, средний чек, life value и всё остальное, что вас от этого останавливает. Если вы вообще не понимаете, чем заниматься, у вас проекта нет, идей нет, ну так зайдите на Яндекс-карты, найдите вокруг себя бизнесы, у которых сайтов нет никаких, за несколько минут, часов сделайте им вот такие вот прекрасные сайты, залейте их на какой-нибудь бесплатный хостинг и продемонстрируйте их владельцам этого бизнеса с предложением выкупите это за 10, 20-30. 000 руб. Да, наверное, выкупят не все, но кто-то это сделает. И выйти на доход в несколько сотен тысяч рублей вот таким вот способом будет для вас очень и очень просто. Искусственный интеллект для нас открывает возможности, о которых мы раньше и представить себе не могли. Поэтому подписывайтесь, ставьте лайк, колокольчик. Скоро будет ещё очень много таких видео. Увидимся с вами в следующем ролике.