Komarovaeeee

Задача

К нам обратился заказчик с задачей создать функциональный интернет-магазин на Тильде для бренда натуральной SPA-косметики «Цветы и море». На этапе дизайн-концепции мы развили мысль о море, песке и цветах до такой степени, что сгенерировали для своих задач 400+ изображений, выделив на это 30+ часов. Как у нас получалось и не получалось, что мы делали и как именно экспериментировали, рассказываем дальше.

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

Сбор информации по проекту: формируем общее видение с заказчиком перед стартом

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

• Какая стоит задача, что заказчик видит на финише?

• Будет ли виденье заказчика работать для ЦА?

• Что конкретно важно для целевой аудитории?

• Как проект будет жить после релиза?

• Что нужно учесть при разработке и о чем позаботиться заранее, чтобы сайту не нужны были доработки через неделю после запуска?

• И многое другое

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

Проектирование — продумываем структуру страниц и закладываем необходимые решения в интерфейс сайта

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

Далее мы сделали карту сайта и определились со структурой страниц на основании проведенного исследования. Мы выделили преимущества, рассказали о бренде, описали условия для сотрудничества, показали бренды, с кем сотрудничает «Цветы и море». Сняли нагрузку с менеджеров, сделав список частых вопросов и ответов на них.

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

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

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

Проектирование прототипа далось нам без особых сложностей — полный мэтч с клиентом позволил оперативно сделать интерактивный прототип и перейти к поиску дизайн-концепции и отрисовки макета.

Дизайн: получили тестовую продукцию, отсматриваем визуал заказчика, штудируем премиум-стоки, тестируем нейронки.

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

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

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

В какой-то момент мы уперлись в то, что контент заказчика оказался достаточно «шумным» для фоновых изображений, терялись тексты и важные акцентные элементы интерфейса. Контент подходил только для визуализации каталога товаров + была вероятность дублирования визуала из-за ограниченного количества изображений. Еще мы начали ломать голову над тем, как проиллюстрировать разделы каталога. Ну и в целом контент заказчика был заточен больше под соцсети — видео и фото были предоставлены нам в вертикальном формате.

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

Нейронки. Вступительное слово и поехали.

О чем пойдет статья дальше? Важно — это не мануал в привычном в виде с обзором каждой кнопки. Это статья о том, как в реальной коммерческой разработке можно смело экспериментировать и внедрять в работу различные Ai-инструменты и получать довольно качественный результат, параллельно решая распространенную проблему в дизайне – отсутствие визуального контента от заказчика.

Передаем слово нашему дизайнеру — Сергею, который поделится с вами всеми своими наработками в процессе генерации контента для «Цветы и море».

Почему выбрали Stable Diffusion, а не Midjourney

Прочитав несколько обзоров и сравнений генеративных нейросетей, предварительно решили, что нам больше подходит именно Stable Diffusion, так как он оказался достаточно гибким и функциональным для наших задач. Я бы его назвал настоящим комбайном, в котором ограничений практически нет, но чтобы научиться пользоваться всеми возможностями этого инструмента, придется очень сильно погрузиться в технические аспекты.

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

Почему мы выбрали Stable Diffusion?

1. Редактирование созданных изображений — можно легко менять конкретные элементы на изображении с помощью функции Inpaiting, а с помощью outpaiting возможно наращивание фона в контексте изображения. Эта функция очень нам пригодилась для страниц разделов товаров, далее расскажу подробнее.

2. Распределение веса по конкретной характеристике в промте — за счет этого можно гибко настроить промт и получить наиболее точный результат.

3. Установка конкретных моделей, которые нужны тебе. У Stable Diffusion большое сообщество, в сети можно найти крупные каталоги с базой различных моделей и обученных дополнений Lora, которые устанавливаются поверх базовых моделей. Большинство из них находятся в свободном доступе.

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

5. Наличие seed у генерируемого изображения. Что это и зачем? Seed — уникальный код или идентификатор изображения, который дает нам возможность вносить в запрос изменения точечно, сохраняя основную композицию, обстановку или объект на изображении. Далее расскажем как пользовались данной фичей.

Технические нюансы, установка, первые результаты.

Первая сложность, с которой столкнулись — сборок для систем на базе Mac практически нет и их не так просто найти, в основном сборки идут под Windows. Я нашел два подробных мануала для развертывания для Mac на github. Вот первый и второй, если делать все по инструкции, заработает без танцев с бубном. Если же что-то не получится, пишите в комментариях, постараюсь помочь.

Установив Stable Diffusion, нужно было установить модель, на основе которой буду генерировать контент. После небольшого ресерча решил поработать с моделью Deliberate_v5 от популярного разработчика моделей Христ. Добавлю, чтобы корректно работали функции outpainting и inpainting, дополнительно сразу скачайте модель с приставкой Deliberate_v5-inpainting. Установка модели довольно проста: просто копируем в папку models, где был установлен Stable Diffusion.

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

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

Приступил к составлению промтов из разряда «bath bomb or bath fizzie», «бомбочка для ванны или шипучка для ванны», дело двинулось. Далее стал задавать новые условия: белый/светлый фон, количество, тень и ее резкость, формат изображений, остановился на разрешении 1024х512. Также попробовал распределять вес ключей для более тонкой настройки — «bath bomb or bath fizzie, (A few pieces:1.5), white surface».

Добавлю, что при разрешении 1024х512 и методе txt2img генерация одного изображения занимала 45 секунд на процессоре m2 pro, при более высоких разрешениях доходило до 3-4 минут. В Stable Diffusion есть возможность выставить количество изображений для генерации пакетов изображений, что очень удобно. Выставляем 10 или 20 вариантов генераций, спустя 10-20 минут все готово. Остается выбрать понравившиеся результаты и seed и далее работать уже с ними. Прикрепляю первые результаты.

С каждым новым изображением я лучше понимал алгоритм и логику работы со Stable Diffusion, результат становился все интереснее, но от косяков в виде мутаций, артефактов и различных деформаций пока не мог избавиться.

Расширял промты и добавлял новые условия: «сухоцветы лаванды», «основание из дерева», «мягкие тени», «идеально круглая форма». Потом с помощью Midjourney составил промт, загрузил референс и полученный промт попробовали использовать для Sd, но ничего не вышло — видимо, алгоритмы и промтинг у Stable Diffusion и Midjourney работают совершенно по- разному.

Пример промта, который нам выдал Midjourney:

А ниже то, что получилось с промтами от Midjourney. В моменте казалось, что вырисовывается что-то симпатичное, но под наши задачи, увы, не подходило.

Снова переработал промт, прописал более конкретные условия и добавил негативный промт

Продолжал эксперименты с промтами и весом ключей и в какой-то момент получил результат, который нас устроил в качестве версии 1.0.

Работал в режиме txt2img, промт:

Негативный промт, чтобы исключить цвета, которые нам не подходили по стилю:

Заданные настройки в интерфейсе SD:

На тот момент у нас уже был готов дизайн-макет, известна цветовая палитра, подобраны шрифты. Мы «примерили» полученное изображение и наконец поняли, что попали, результат нас устроил на 9 из 10. Нам захотелось улучшить результат, продолжили работать на качество и детали.

Как улучшить получившийся результат в Stable Diffusion?

Каждое изображение имеет свой уникальный идентификатор — seed. Я использовал seed данного изображения и стал менять промт. Что это дало? Результат теперь получался не рандомным, а очень схожим с оригиналом. Мы могли развивать данное изображение — менять не только промт, но и другие настройки.

Когда я увеличил разрешение изображения с 952х448 до 1560х771, произошел известный баг в Stable Diffusion — дублирование сущностей. И так как мы работали с бомбами для ванной, а не с человеческими головами или руками, нам это пошло только на пользу, увеличив количество элементов с 4-6 до 8-12. Кстати, в сети довольно много мануалов о том, как бороться с дублированием контента в Stable Diffusion при генерации.

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

Промежуточный результат

Финальный результат, который нас устроил

Докрутив предыдущий промт на основе прошлого seed, получил наш финальный результат, который отлично вписался на главном экране сайта.

Режим txt2img, промт:

Негативный промт достаточно универсален и подойдет во многих случаях, так как больше нацелен на борьбу с деформациями и мутациями:

Заданные настройки в интерфейсе SD:

Генерация контента для групп товаров

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

Вот такой интересный результат у нас получился:

Наращивание фона

Последнее, что оставалось — получить из формата 1:1 горизонтальные широкоформатные изображения для hero-секций страниц разделов. Функционал Stable Diffusion позволяет это сделать — нужно использовать outpainting (нейросеть может нарастить фон изображения в любую выбранную сторону исходя из контекста изображения) в режиме img2img. В сети и на ютубе много подробных мануалов, здесь не буду расписывать подробно.

Далее с помощью функции inpaint почистил изображения от артефактов. Оставалось сделать цветкор и дополнительно сделать апскейл.

Результат:

Что думаем насчет всего этого волшебства?

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

Итоговый результат

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

Расскажите о своем опыте работы со Stable Diffusion и другими нейросетями — поделитесь в комментариях.

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

Сегодня провела разбор сайтов в прямом эфире на официальном канале Tilda Publishing и хочу поделиться своими ощущениями. Опыт интересный, который я запомню на долгие годы. Наверное сегодня что-то произошло внутри, чего еще не осознаю в полной мере. Это был не просто прямой эфир, сегодня я выпустила из себя многолетний животный страх

Сразу уточню, опыт выступлений у меня уже был, но немного в других форматах — я была на нескольких интервью у коллег по цеху, участвовала в дизайн-движе на ютубе, плюс в течение 3 лет у меня регулярные переговоры с заказчиками с аргументацией решений и отработкой возражений. То есть я чувствую себя в своей тарелке, понимаю о чем говорю, имею опыт в сфере веба

Но нет, ничего ты не знаешь

Немного порефлексируя после эфира, я осознала, что страх жил внутри меня 23 года (сейчас мне 30). Он заложился в тот момент, когда в школе в первом классе на общей линейке я запнулась и не смогла рассказать стих, который мне поручили. И мне потом об этом напомнил близкий человек дома, посмеялся надо мной.

Это воспоминание всплыло сегодня после эфира как гром среди ясного неба, наверное случился какой-то психологический момент, в объяснении которого я не сильна, к сожалению. К слову, я вообще этого не помнила, а тут пришло вот, да еще так ярко

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

Вернемся к стриму — сама подготовка была очень волнительной, примерно за 2 дня меня начало накрывать, я выпала из рабочего графика и отложила работу. Это странно, ведь я знала о своем выступлении заранее и была абсолютно спокойна. Если описать страх, то он был близок к животному, я себя не узнавала. Пыталась себя успокоить, смотрела тематические видосы, но становилось мне как будто бы только хуже.

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

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

В момент, когда оставалось 5 минут до эфира меня распирало от адреналина или что там вырабатывается? Была в ужасе.

И тут магия.

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

Началась прямая трансляция.

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

Всего прислали более 60 сайтов, конечно все разобрать не вышло, так как время ограничено. Разбор первого сайта вышел очень подробным, получилось дольше остальных, наверняка затянуто. Хотя на разборе присутствовали авторы работ, дизайнеры, собственники бизнеса и представители компаний, и я получала обратную связь, что мой фидбек очень полезный. Спасибо большое!

Ну и дальше пошли сайты — где-то поднимала тему смыслов в текстах, где-то говорила про цвет и типографику, немного затронула маркетинг. В каких-то сайтах разбор был с упором на работу с визуалом и вёрсткой на Тильде

В конце эфира получила много приятных отзывов и приятное теплое ощущение по всему телу. Справилась и победила себя.

Важные выводы после выступления

Ощущение того, что ты принёс пользу и, возможно, авторы работ, которые я рассматривала, что-то для себя смогли почерпнуть и где-то поправить — это дико круто.

Второе — я пересмотрела свой взгляд на спикеров и тех, кто публично выступает в любом формате (онлайн, офлайн, как угодно). Никогда не задумывалась о том, как это может быть сложно. Особенно если у тебя есть психологические зажимы или травмы. Гораздо проще увидеть, что человек стесняется или покраснел и похихикать на этот счет. Сама такая была иногда, что уж

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

Заканчивая свою эмоциональную статью, хочу провести разбор работ тех сайтов, которые не успела сегодня в прямом эфире. Посмотрим, как всё пройдёт. Будет классный отклик — буду проводить бесплатные разборы на регулярной основе для дизайнеров, предпринимателей и всех, кто работает с Тильдой. Подписывайтесь на мой tg-канал — анонс разборов будет заранее 🤍

Почему Тильду так любят разработчики и бизнес?

Тильда конструктор сайтов no code – работать с ним сможет практически любой, без помощи программистов. Малый бизнес любит его за то, что можно сделать симпатичный сайт или интернет-магазин самостоятельно. Большой бизнес любит его за то, что можно сохранить деньги и подключать специалистов только к решению сложных задач.

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

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

Дизайнеры используют Zero Block в Тильде для создания уникального дизайна под конкретную задачу. Изначально конструктор создавали для одностраничных сайтов. Однако в 2017 году на платформе появилась возможность для полноценных интернет-магазинов.

На примере одного из них мы расскажем о преимуществах конструктора Тильда далее.

Почему Тильда может быть полезна бизнесу с любым стартовым капиталом?

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

Для интернет-магазинов на платформе Тильда встроен функционал Ecommerce. Он взаимодействует с различными платежными системами: оплата картой, смартфоном или электронным кошельком. Передачу данных можно привязать к Google Drive или CRM. Об этом мы подробно расскажем ниже.

Для интернет-магазина можно использовать 12 сервисов для сбора данных, а для анализа трафика можно подключить Google Analytics и Яндекс. Метрику.

На Тильде можно создать один проект бесплатно, однако его функционал будет ограничен. Если вы предприниматель, и планируете самостоятельно обновлять свой интернет-магазин, подумайте о платном доступе. Тарифы для этого неизменны – до 1250 рублей в месяц.

В Тильде есть разные тарифы. Для интернет-магазинов подойдут тарифы personal и business, так как на бесплатном тарифе очень ограничен функционал — не получится подключить платежную систему, варианты доставки, редактирование каталога.

Вы также не сможете использовать довольно много готовых блоков Тильды. Если в планах создать один интернет-магазин, вам будет достаточного персонального тарифа, оплатить который можно как сразу на год с выгодой, либо помесячно чуть дороже. Бизнес-тариф понадобится, если у вас есть/планируется несколько проектов на Тильде.

Какой полезный функционал есть для интернет-магазина?

Внутри системы есть встроенная CRM Тильды, где бизнес может отследить заявки на свои товары и услуги. При этом без помощи сторонних специалистов можно подключить внешние сервисы, например, AMO CRM, Zoho CRM и Битрикс 24.

При необходимости через последний можно выстроить интеграцию с 1С. Кроме того, для интеграции также доступен сервис «Мой Склад». К системе можно подключить сервисы рассылок и необходимые приложения.

Опции для обработки заявок клиентов:

• email — данные клиента поступят с формы на вашу почту

• google sheets — данные с формы появятся в Google Таблице

• telegram — данные с формы придут в ваш ТГ

• trello — добавят заявки на доску

Crm:

• tilda crm — отправит данные с формы в лист заявок

• amocrm — добавит сделки в AmoCRM

• bitrix24 — добавит контакты в Bitrix24

• hubspot — добавит заявки в CRM

• megaplan — отправит данные с формы в лист заявок

• monday — добавит заявки на доску

• zohocrm — добавит заявки в CRM

• salesforce — добавит заявки в CRM

Добавить контакты в список рассылки помогут getresponse, mailerlite, sendgrid, sendinblue, sendpulse и unisender.

• email через SendGrid – данные формы будут приходить на вашу почту через SendGrid

• slack – отправит данные с формы в Slack

• webhook – отправит данные в свой скрипт

• zapier – уведомит о новых заявках

• личный кабинет – поможет с регистрацией пользователя

• notion – добавит заявки в таблицу

• facebook Conversions API – отправит события о заявках и покупках

Интеграция с 1С у Тильды появилась только недавно. Долгое время необходимо было подключать сервисы, которые могли обеспечить такую интеграцию.

Однако даже сейчас справиться своими силами сложно. Придется прибегать к помощи специалистов. Кроме того, на Тильде можно создать информативный каталог товаров.

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

Маленький лайфхак – если вы решили добавлять товары через каталог вручную, то советуем сделать готовую карточку товаров и далее ее дублировать, менять детали. Так получится гораздо быстрее справиться с рутинной работой. Ну а в идеале конечно пользоваться форматами csv и xml.

В каталоге онлайн магазина можно создавать разделы. С ними удобно и оперативно работать. Можно группировать и сортировать товары, редактировать разделы и многое другое — все это легко сделать заказчику или специалисту в его команде самостоятельно.

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

Для каких сайт-магазинов подойдет Тильда?

Конструктор поможет проектам с неочевидным коммерческим эффектом — с помощью платформы вы легко протестируете любую идею.

Создать интернет-магазин на Тильде легко для небольшого ассортимента – до пяти тысяч товаров без отдельной страницы для каждого или до 500 позиций с отдельной страницей для каждого – максимальное количество страниц на сайте.

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

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

Вам нужны системы учета 1С и Мой Склад. Для 1С все же потребуются разработчики. Мой Склад, по сути, дубль 1С, но позволяет фиксировать складские остатки и заказы.

У вас нет сложных расчетов для доставки.В системе представлен базовый модуль доставки. Но скорее это можно назвать опцией – вы можете указать только фиксированный прайс на доставку товара. И если у вас, например, есть интернет-магазин детской одежды, который доставляет товары по Санкт-Петербургу за 500 рублей за заказ, проблем быть не должно.

А вот, если есть необходимость доставлять товары из Санкт-Петербурга, к примеру, в Улан-Удэ, придется делать дубли страниц для регионов или подключать для оплаты другой сервис с модулем расчета стоимости доставки. Это не так сложно, но разработчик вам точно потребуется.

Чтобы сделать интернет-магазин на Тильде с большим ассортиментом – +100 товаров с доставкой в разные города, с объемом работ на одном энтузиазме здесь не справиться. Потребуется помощь специалистов на Тильде.

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

Когда разработку интернет-магазина лучше отдать специалистам?

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

Даже если вы все же решите затем обратиться к программистам, легко поймете, о чем они говорят. А может быть и сможете сделать интернет-магазин на Тильде для себя самостоятельно. В этом случае вы потратите около 500 рублей на тариф и некоторую сумму для оплаты доменного имени.

Вы можете сделать интернет-магазин на Тильде самостоятельно, если:

• У вас небольшой ассортимент товаров – до 100 позиций. Неважно, занимаетесь ли вы разработкой интернет-магазина одежды или цифровых товаров на конструкторе Тильда.

• Магазин вам нужен очень быстро, вносить изменения на сайт и в каталоги могли бы менеджеры без опыта работы в СMS-системах.

• Вам не нужны сложные фильтры товаров по разным характеристикам и модуль доставки с учетом работы разных логистических компаний и их прайса.

Однако важно понимать, что такой сайт будет ограничен по функционалу и скорее всего не будет отражать ваше видение полностью. Вы также можете потерять самое важное – время. Иногда это куда более важный ресурс в бизнесе.

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

Тем более это удачное решение, если вы планируете развивать бизнес со временем.

В дальнейшем вы сможете изменить свой интернет-магазин, добавлять туда опции сложной доставки, карточки товара и многое другое. Наши разработчики и UX/UI-дизайнеры точно знают свое дело, они соберут полноценный сайт гораздо быстрее любого предпринимателя-любителя.

Оставить заявку на создание сайта можно здесь.

Как можно использовать тильду для интернет-магазинов: практический кейс

Интернет-магазин российской компании «Полимер», которая занимается продажей полимерных труб и фитингов для наружных систем водоснабжения, газоснабжения и водоотведения в Южном федеральном округе.

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

Сайт компании – удачный пример интернет-магазина с корзиной и подкатегориями. Посмотреть сайт можно здесь.

Мы разработали сайт по продаже полимерных труб на Тильде. Дизайн отрисовали с нуля в графическом редакторе Figma, шаблонных решений Тильды использовано не было. Работали с zero-блоками (нулевые блоки для специалистов-дизайнеров, где все отрисовывается и адаптируется с нуля).

Разработка интернет-магазина заняла 30 рабочих дней. Бюджет – 150 тысяч рублей.

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

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

Далее на основе этой информации проектируется будущий прототип онлайн каталога. Только после окончательного согласования логики и структуры отрисовывается дизайн и переносится на платформу Тильда.

Общее впечатление от сайта

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

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

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

Как выглядит структура сайта

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

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

Интернет-магазин продолжает подкатегория с ответами на самые популярные вопросы о том, как выбрать необходимый тип труб, определить вид доставки и другое. В подвале продублировано меню и указаны полные контакты компании, а также продублирован каталог товаров. Благодаря подробной информации вы можете сравнить все плюсы и минусы товаров.

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

Какие разделы на сайте можно сделать с помощью Тильды?

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

Мы разделили всю продукцию на сайте «Полимера» на разделы, сделали отдельные страницы с товарами и возможностью добавления продукции в избранное и в корзину.

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

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

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

Краткое описание, возможность добавить товар в корзину и избранное. Можно добавить данные о доставке, оплате или любой другой информации. На Тильда также можно выводить сопутствующие товары ниже основной информации о нем. Здесь можно выводить как определенные разделы онлайн каталога, товары со скидкой, так и все товары. Все зависит от конкретной задачи заказчика.

Корзина в интернет-магазине – здесь собраны все товары, которые посетителю необходимо заказать. На сайте Полимер нет онлайн-оплаты, заказы оформляются в виде заявок, менеджер компании связывается с клиентом, направляет счет на оплату и так далее.

В корзине мы настроили необходимые поля: имя, почта и так далее, возможность вставки файлов для реквизитов компании клиента. После заполнения всех данных оформляется заказ.

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

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

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

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

Наполнением каталога в интернет-магазине, объектов и новостей в дальнейшем занимается заказчик. “Самостоятельное плавание” стало возможным благодаря понятной админке: клиент может создавать новые карточки товаров, работать с разделами, фильтрами и корзиной.

Как Тильда помогает оценить эффективность сайта?

На Тильде есть встроенная статистика, где вы можете анализировать интернет-магазин и отслеживать эффективность сайта по показателям за определенный период — по дням или ежемесячно.

Есть возможность анализировать товары как по топ заказанных товаров, так и топ товаров по количеству просмотров. Также можно отслеживать топ городов, где чаще покупают товар, а также эффективность каналов по выручке.

На сайт активно льется рекламный трафик, а также интернет-магазин дальше продвигается по SEO. Через сайт уже активно совершаются продажи, а значит, целевое действие интернет-магазина совершается.

Благодаря использованию конструктора Тильда получилось протестировать некоторые идеи. После оценки их эффективности при необходимости мы внесем изменения в интернет-магазин.

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

Чтобы получить такой же крутой результат, который поможет вашему бизнесу занять конкурентную нишу и окупит все вложения в самое короткое время, обращайтесь за консультацией к нашим специалистам!