Pancer.BG — от статичен каталог до жива ecommerce система
Технологии · React + SSR · Firebase · Vercel · Redis · UI/UX · SEO/GEO · Content · Automation
Тагове · 15+ години домейн · 800+ продукта · Онлайн ecommerce · www.pancer.bg
От статичен каталог, който създадох преди повече от 15 години, до live ecommerce платформа през 2026 г.
Реален бизнес с домейн над 15 години. Изградих технологичния, продуктовия и визуалния слой — storefront, операции, съдържание и discoverability — с AI като работен партньор без Figma и без прототипи. Днес магазинът е live на www.pancer.bg с 800+ продукта и продължава да се развива.
- 15+ години история на домейна
- 800+ продукта
- Онлайн ecommerce операции
- Каноничен www.pancer.bg
Преглед на проекта
Роля
Технологичен, продуктов и визуален слой — архитектура, UI/UX, ребрандинг, съдържание, медия, SEO/GEO, автоматизации
Тип
Custom ecommerce платформа за реален бизнес + пълна поддръжка
Каталог
800+ продукта · марки · категории · сезонни / нови / оферти
Статус
Онлайн · www.pancer.bg
React + SSR · Firebase · Vercel · Redis · Stripe
Централна система
PANCER.BG
Онлайн ecommerce система
Продукт
Дизайн
Технологии
Растеж / SEO
Бизнес
Контекст и доверие
Предишният етап беше статичен HTML каталог: марки, категории, продуктови страници и поръчки по телефон. За времето си това беше честно и работещо решение. Хората намираха продуктите. Екипът поемаше разговора. Домейнът натрупваше история.
Промяната дойде от нови нужди, не от „лош стар код“. Каталогът растеше. Клиентите очакваха online покупка. Бизнесът имаше нужда от централизирани данни, количка и checkout, ясна SEO архитектура и съдържание, което търсачките и AI системите могат да разберат последователно.
Ограниченията на стария етап не бяха „HTML не се индексира“. Бяха ръчен URL модел, повтарящ се markup, много H1 в catalog pages и липса на structured ecommerce product layer — плюс липсата на централизирана data model логика и validation при запис.
Първата версия на husqvarna.pancer.bg беше работещ статичен каталог, който сам създадох. Това не е rescue на чужд legacy проект. Екипът даде доверие и свобода да се изгради цялостен продуктов и технически слой — с базова посока, не с ред по ред спецификация.
Как работя?
Нужда
Реални проблеми на каталог, операции и customer journey — не „по-красив екран“.
Дизайн
UX/UI, информационна йерархия, бранд и съдържание като една система.
Система
Storefront, централни продуктови данни, checkout и оперативен dashboard.
Проверка
Smoke тестове, data validation и проверки какво реално е live.
Итерация
Post-launch корекции и подобрения върху работеща платформа.
Storefront и клиентски път
Днес публичният каталог обединява 800+ продукта в структура от марки и категории — и продължава да се обновява. Има потоци за сезонни продукти, нови продукти, оферти, ТОП оферта, намаления и брошури. Клиентът може да търси, да филтрира, да листа с paging и Load More, и да се връща назад без да губи scroll контекста.
Клиентският път покрива регистрация и вход с имейл, Google, Facebook и Apple; профил; адреси; любими; отзиви; кошница и checkout. Има и бърза поръчка: след разговор с клиента екипът може да довърши заявката, без клиентът да минава през целия UI сам. При смяна на статус тръгват автоматични имейли и browser notifications.
Цените, доставката и спестяванията се показват динамично от централния каталог. През същия път вече минават реални поръчки — не само тестови сценарии.
Слоеве на системата
Кратки блокове за storefront, клиентски път, операции, discoverability и бранд — без tech dump в hero.
Не просто каталог, а продукт
800+ продукта в марки и категории, с търсене, филтри, paging и Load More — и запазен scroll контекст при back. Информацията идва от централен каталог, не от ръчно копирани HTML страници.
Клиентски път
- Профил, адреси, любими, отзиви
- Кошница и checkout
- Бърза поръчка след разговор с екипа
- Статуси с имейли и browser notifications
Оперативен контролен център
Екипът управлява продукти, поръчки, отзиви, marketing известия и секции на началната страница — с по-малко зависимост от ръчна HTML поддръжка за всяка промяна в онлайн магазина.
Откриваемост
- 960+ страници, готови за търсачки и AI
- Откриваемостта е проверена преди пускане
- Структурирани данни, AI карта и видео страница
- SEO видимостта е запазена при миграцията
Бранд и съдържание като инфраструктура
Ребрандинг, hero кадри, blog covers, продуктови изображения и branding видеа — обработени като част от платформата. Блогът и статиите към категории/продукти са жив актив за discovery, не отделен „маркетинг сайт“.
Dashboard — система, която екипът може да управлява
Зад публичния сайт стои оперативен контролен център. Екипът работи с продукти, поръчки, отзиви, методи на плащане, marketing известия, секции на началната страница и история на плащания. Добавянето или редакцията на марка, категория и продукт е част от ежедневния поток.
Смисълът е директен: съдържанието и операциите имат по-малко зависимост от ръчна HTML поддръжка за всяка промяна в онлайн магазина. Достъпът е разделен ясно — клиентите управляват личния си профил, а екипът работи в административния слой.
Бранд и съдържание
Платформата продава през доверие. Доверието идва и от това, което човекът вижда преди „Добави в кошницата“.
Изградих блог и детайлни статии към категории и продукти. Изработих и обработих ребрандинга, hero изображенията, blog covers, продуктовите изображения, рекламните и branding видеата. Продуктите и статиите са качени и поддържани лично от мен.
AI ускоряваше итерациите около структура и код като работен партньор; визуалният език, подборът на кадър и тонът на съдържанието оставаха моя отговорност.
Визуални материали
Автоматизация и откриваемост
В онлайн магазина клиентът може да ползва bot/wizard асистент за препоръки при поискване — помощ при избор, вързана към каталога. Около магазина върви marketing слой за кампании и съобщения, плюс подаване към search/merchant екосистеми като обща основа за откриваемост.
SEO/GEO/AI-discovery: SSR-видима продуктова информация, структурирани данни, llms.txt, AI sitemap, публична /videos страница и VideoObject. Това не са продажбени метрики — показват, че системата става по-четима за търсачки и AI системи.
- 960+ страници, готови за търсачки и AI
- Откриваемостта е проверена преди пускане
- SEO видимостта е запазена при миграцията
Надеждност и domain миграция
Добавих server-side rendering и сървърно кеширане — включително Redis — така че ключовата продуктова информация да е налична още при първото зареждане. Проектиflow-ът Git → Vercel → Firebase държи промените проследими.
Миграцията към каноничния www.pancer.bg мина през phased launch и 301 redirects в съгласуван пакет, за да се запази 15+ годишната история на домейна. Днес каноничният дом е активен.
SEO видимостта е запазена при преминаването — без установени регресии след миграцията.
Какво означава да поддържаш жива система
Четирите карти не са списък с бъгове. Те показват ownership след launch — в среда с клиенти и поръчки.
Грешни данни за батерия/гориво
Проблем · Девет продукта показваха неточна информация за комплектацията.
Действие · Данните бяха поправени; добавени са допълнителни проверки при поддръжка на каталога.
Защо е важно · Клиентът решава по вярна информация; екипът намалява шанса грешката да се повтори.
Подсилен operational контрол около checkout и поръчките
Проблем · В среда с реални клиенти критичният момент на плащане трябва да остане стабилен.
Действие · По-ясен operational контрол около checkout и поръчките за предвидим поток.
Защо е важно · Клиентът плаща спокойно; екипът разчита на предвидими поръчки.
Натоварване в dashboard
Проблем · При тежка ежедневна работа контролният център се забавяше.
Действие · Оптимизация на заявките и кеширането за ежедневна работа на екипа.
Защо е важно · Операциите по продукти и поръчки остават ползваеми всеки ден.
Стара страница след deploy
Проблем · След пускане част от посетителите все още можеха да виждат предишна версия.
Действие · По-ясни проверки след deploy какво реално е live.
Защо е важно · По-малко фалшиви инциденти; по-ясен статус за екипа и клиента.
Тест, който продължава
Получих доверие да изградя технологичния и визуалния слой на реален бизнес. С AI като работен партньор без Figma и без прототипи превърнах 15-годишен статичен каталог в жива ecommerce система, която екипът може да управлява, а клиентите могат да използват уверено.
Следващият слой вече се строи върху работеща система.
Слоеве на компетентност
Ecommerce архитектура
Storefront върху централни продуктови данни — не page-per-edit HTML.
UX / UI
Информационна йерархия, listing/PDP потоци и ясен клиентски път.
Операции
Dashboard за продукти, поръчки, отзиви и съдържателни секции.
Бранд и съдържание
Визуална система, медия и editorial слой към каталога.
SEO / GEO
SSR-видима информация, structured data и AI-discovery surfaces.
Арт дирекция
madebyvladonacev
UI/UX дизайн
Владо Нацев
Графичен дизайн
Владо Нацев
Разработка (front-end + back-end)
Владо Нацев + AI
Изследване
Владо Нацев
Проектен мениджмънт
Владо Нацев
SEO оптимизация
Владо Нацев
Техническа поддръжка
Владо Нацев
Често задавани въпроси
Какво отличава реален онлайн магазин от статичен продуктов каталог?
Статичният каталог показва продукти и често разчита на разговор по телефон. Реалният онлайн магазин добавя централни продуктови данни, кошница и checkout, клиентски път и оперативен контрол за екипа. Така витрината, филтрите и поръчките работят като една система — не като ръчно поддържани HTML страници. Това е разликата между витрина за разглеждане и инструмент за ежедневни продажби и операции.
Кога има смисъл SSR за ecommerce магазин?
SSR има смисъл, когато ключовата продуктова информация трябва да е налична още при първото зареждане — за клиента, за търсачките и за AI системите, които четат страницата. При голям каталог това прави съдържанието по-предвидимо и по-четимо извън чистия UI. Не е самоцел; служи, когато discoverability и стабилният първи екран са част от бизнес изискванията.
Как се поддържат продуктовите данни след пускане на магазина?
След launch каталогът живее през централен продуктов слой и оперативен dashboard, а не чрез ръчно копиране на страници. Екипът добавя и редактира марки, категории и продукти в ежедневния поток. Целта е по-малко зависимост от developer ticket за всяка промяна във витрината — и по-съгласувана информация между listing, детайл и свързаните канали.
Как се прави по-безопасна domain и SEO миграция?
Безопасната миграция е планиран cutover: phased launch, 301 redirects и ясен каноничен дом, за да се запази историята на домейна. Старите адреси трябва да водят към правилните страници, а индексацията — към новия каноничен адрес. След пускане са нужни проверки какво реално виждат посетителите, за да се намалят фалшиви инциденти и объркване в екипа.
Как Pancer.BG премина от статичен каталог към ecommerce платформа?
Първият етап беше статичен HTML каталог с поръчки по телефон — мой, за друг момент на бизнеса. Новите нужди поискаха централни данни, кошница, checkout, операции и съдържание, четимо в initial HTML. Изградих жива система: storefront с 800+ продукта, клиентски път, dashboard, бранд/съдържание и discoverability слой. Днес магазинът е live на www.pancer.bg с реални поръчки.
Как се намалява рискът от неточни продуктови данни?
Рискът се намалява с централен каталог, валидации при поддръжка и ясни проверки след промени — не с ръчно „на око“ по страници. При Pancer.BG девет продукта показваха неточна информация за батерия/гориво; данните бяха поправени и бяха добавени допълнителни проверки. За клиента това е по-вярна комплектация; за екипа — по-ранен сигнал преди грешката да стигне до витрината.
Как се прави онлайн магазин и ecommerce система само с AI?
Pancer.BG е реален пример: модерна ecommerce система, изградена с AI като работен партньор в дизайна и разработката без Figma и без прототипи — не като „магически“ заместител на човешкия контрол. Целта беше работещ магазин и ясна оперативност, а не демо или презентация. Ако търсите как изглежда онлайн магазин с AI в практиката, този case study е конкретният ориентир.
Свързани проекти
Разгледайте проекти, които споделят духа и подхода на тази статия.
Gumicon — Онлайн магазин за гуми и автоаксесоари
Разгледайте · Уеб дизайн
Софтуер · Photoshop · Illustrator.
Технологии · Уеб дизайн · UX/UI дизайн · Реклама.
onlinemashini.bg — Онлайн магазин за машини и инструменти
Разгледайте · Уеб дизайн
Софтуер · Figma · Photoshop · Illustrator. · VS Code.
Технологии · Онлайн магазин · Дизайн на електронни магазини · Laravel · HTML · CSS · SaaS · Bootstrap · Уеб дизайн · UX/UI дизайн · Отзивчив уеб дизайн.