У вас в голове или на экране уже есть картинка того, как должен выглядеть сайт. Скриншот чужой страницы, которая нравится. Набросок на салфетке. Фото витрины или меню. Обычно всё это остаётся мечтой, потому что перерисовать картинку в настоящий сайт, это отдельная профессия. Так вот, больше не отдельная. Вы прикладываете изображение, добавляете пару слов и получаете рабочий сайт, похожий на то, что показали.
Ниже разберу, как это сделать на нашей платформе за несколько минут, и покажу два живых сценария: скриншот понравившегося сайта и фото меню.
Коротко: как это работает у нас
Суть в одном действии. В форме создания сайта есть кнопка для файлов. Вы прикрепляете картинку, пишете, что с ней делать, и запускаете генерацию. Система «смотрит» на изображение и собирает сайт: повторяет структуру и стиль, если это макет, или ставит фото как контент, если это ваш товар.
Важно понимать одну вещь. Платформа не срисовывает пиксели. Она понимает, что на картинке: где шапка, где блок с ценами, какая цветовая гамма, какое настроение. И переносит эту логику в ваш сайт, уже с рабочими формами и базой данных.
Что можно приложить
Картинка картинке рознь. Вот что реально годится:
- Скриншот сайта, который вам нравится. Хоть конкурента, хоть просто красивой страницы из интернета.
- Набросок от руки или в фигме. Даже кривой эскиз «шапка, три услуги, форма внизу» уже задаёт структуру.
- Фото товаров, меню, прайса. Платформа возьмёт их как содержимое каталога.
- Логотип и фирменные цвета. Чтобы сайт был в вашем стиле, а не в стандартном.
Форматы обычные: JPG, PNG, а ещё PDF и текстовые файлы, если у вас, скажем, готовое меню лежит документом.
Пошагово
Разберём по шагам, без пропусков.
Шаг 1. Откройте форму создания сайта. Кнопка «Создать сайт» в кабинете. Там поле для названия-адреса и большое поле для описания.
Шаг 2. Прикрепите картинку. Ниже описания есть блок «Файлы (логотип, тексты, примеры)». Нажимаете, выбираете изображение с компьютера или телефона. Можно несколько сразу.
Шаг 3. Опишите словами, что делать с картинкой. Это ключевой момент, многие про него забывают. Картинка задаёт «как», а текст объясняет «что». Например: «Сделай лендинг для барбершопа в стиле этого скриншота, но под мужские стрижки и бороду». Или: «Вот фото нашего меню, собери по нему каталог блюд с ценами».
Шаг 4. Запустите генерацию. Пара минут, и сайт готов: дизайн, тексты, отдельная база, адрес и сертификат. Прогресс виден по шагам.
Шаг 5. Поправьте, если что-то не так. Не угадала с оттенком синего? Напишите «сделай кнопки темнее». Хотите поменять фото местами, двигайте в визуальном редакторе мышкой.
Всё. Никакого экспорта в HTML и настройки хостинга. Этих слов вы не увидите.
Пример 1. Скриншот понравившегося сайта
Ситуация знакомая. Вы листали интернет, наткнулись на сайт студии, у которой всё как надо: чистая шапка, крупный заголовок, аккуратные карточки услуг. И подумали: хочу так же, но про себя.
Что делаете:
- Скриншотите ту страницу (целиком или заметный кусок).
- В форме прикрепляете скриншот.
- Пишете: «Сделай сайт для моей студии массажа в таком же стиле и структуре, как на картинке. Услуги: классический, спортивный, антицеллюлитный. Добавь форму записи и отзывы».
На выходе получаете свой сайт с той же логикой блоков и близким настроением, но с вашими услугами, текстами и формой. Не копия один в один (это и не нужно, да и чужой контент вам ни к чему), а сайт, который «пахнет» тем же уровнем.
Маленький совет из практики: чем чётче скриншот, тем точнее результат. Замыленное фото экрана с бликом система, конечно, поймёт, но лучше сделать нормальный скрин.
Пример 2. Фото меню в каталог
А теперь про бизнес, где картинка это и есть контент. Кофейня, пекарня, магазинчик.
У владельца обычно нет ни сайта, ни времени вбивать позиции руками. Зато есть меню: бумажное на стойке или фото в телефоне.
Что делаете:
- Фотографируете меню (или несколько страниц прайса).
- Прикрепляете фото в форму.
- Пишете: «Собери сайт кофейни. Вот наше меню на фото, сделай по нему каталог напитков и десертов с ценами, добавь блок „о нас“ и карту с адресом».
Система читает позиции с фото, раскладывает их по разделам, проставляет цены и собирает каталог. Дальше вы правите словами: «убери раф, добавь новинку сезона». Через полчаса у кофейни есть живой сайт, куда можно вести из соцсетей.
Чем это отличается от конструктора
В конструкторе картинка вам не поможет. Там вы всё равно смотрите на образец в одной вкладке и вручную повторяете его в другой: тот же блок, тот же отступ, тот же шрифт. Часами.
Здесь картинка это задание, а не справочный материал. Вы её отдаёте, а сборку делает система. Разница примерно как между «перерисуй по образцу сам» и «покажи образец мастеру».
Пара честных оговорок
Чтобы без завышенных ожиданий.
Первое. Если на скриншоте адски сложный интерфейс с анимациями и хитрой логикой, точь-в-точь его не будет. Структуру и стиль система повторит, микроскопические детали вряд ли.
Второе. С фото текст читается тем лучше, чем он чётче. Мятый чек с размытыми цифрами лучше перепечатать в описание, чем надеяться, что всё распознается идеально.
И третье, скорее плюс. Даже если приложить нечего, сайт всё равно соберётся по одному текстовому описанию. Картинка ускоряет и уточняет, но не обязательна.
Частые вопросы
Обязательно прикладывать картинку?
Нет. Сайт делается и по одному текстовому описанию. Изображение просто помогает попасть в нужный стиль точнее.
Можно приложить скриншот чужого сайта?
Да, как ориентир по стилю и структуре. Система сделает похожий по духу сайт с вашим содержимым, а не ворованную копию.
Распознает ли платформа текст с фото меню?
Да, позиции и цены с читаемого фото она разбирает и раскладывает по каталогу. Мутные снимки лучше продублировать текстом.
Сколько картинок можно приложить?
Несколько сразу: например, логотип, скриншот-образец и пару фото товаров.
Что делать, если результат не совсем такой?
Править словами в чате («шапку темнее», «убери этот блок») или мышкой в визуальном редакторе. Каждая версия сохраняется, можно откатиться.
Вывод
Сайт по картинке это самый короткий путь от «хочу вот так» до готовой страницы. Вы отдаёте образец, платформа берёт на себя перенос его в рабочий сайт, а вам остаётся только уточнить детали.
Возьмите любой скриншот, который вам нравится, или сфотографируйте своё меню, и посмотрите, что получится за пять минут.