Doprava zdarma nad 2 000 Kč Odesíláme do 24h Vrácení do 14 dnů

Nový web FALLENS AIRSOFT: design, checkout a nové funkce

Nový web · FALLENS AIRSOFT
NECHTĚL JSEM JEN HEZČÍ E-SHOP.
Chtěl jsem lepší FALLENS.

FALLENS AIRSOFT má nový web. Jenže slovo „redesign“ tentokrát trochu kecá. Nezměnil jsem totiž jen barvy, bannery nebo tlačítka. Postupně jsem překopal vzhled, navigaci, nákupní proces, obsahové funkce i řadu věcí, které zákazník na první pohled vůbec nevidí.

FALLENS-AIRSOFT.CZ
FALLENS
OBJEVIT VÝBAVU →
MEGA MENU
ONE PAGE
CONTENT
DESIGN × UX × TECHNOLOGY
Ve zkratce
Nový FALLENS není jen jiné theme. Je to vlastní prostředí postavené kolem rychlejšího nákupu, lepší navigace, vlastního obsahu a funkcí, které jsme na e-shopu skutečně chtěli mít.

Co všechno se vlastně změnilo?

Některé změny jsou vidět okamžitě. Jiné poznáš až ve chvíli, kdy web skutečně používáš. A další jsou schované hluboko pod kapotou.

Nákup bez překážek
One-page checkout
Adresa, doprava, platba, souhrn i finální objednání jsou na jediné stránce.
Navigace
Mega menu s obrázky
Kategorie, skupiny, odkazy a vizuální orientace v rostoucím sortimentu.
První dojem
HTML hero slider
Fotografie a skutečný HTML obsah fungují dohromady, ne jako text zapečený v obrázku.
Obsah
Slovníček pojmů
Technické pojmy vysvětlené tak, aby dávaly smysl začátečníkovi i zkušenějšímu hráči.
Blog
Kategorie a série
Články už nemusí být jen chronologická hromada. Mohou tvořit skutečné tematické celky.
Drobnosti, které pomáhají
QR platby & badges
Méně opisování při platbě a více důležitých informací rovnou na produktové kartě.

Nestačilo mi koupit jiné theme

FALLENS AIRSOFT běží na nopCommerce. Je to robustní e-commerce platforma, která toho umí opravdu hodně. Jenže univerzální e-shop musí být právě univerzální. A čím déle FALLENS provozuji, tím více jsem narážel na věci, které bych jako zákazník chtěl jinak.

Tak jsem je začal dělat jinak.

Nechtěl jsem vzít hotovou šablonu, změnit její barvu na zelenou, vložit logo a prohlásit redesign za dokončený. Chtěl jsem postavit prostředí, které má vlastní charakter a zároveň se v něm dobře nakupuje.

Jednoduchý test identity
I kdyby z webu zmizelo logo, mělo by být pořád poznat: tohle je FALLENS AIRSOFT.
Černá Bílá Zelená Velká typografie Technický charakter Minimum balastu

Design nesmí překážet nákupu

Můžeme mít nádherný web, animace, bannery a efekty. Jenže pokud člověk přijde koupit pytel 0,28g BBs a my ho donutíme absolvovat menší poznávací zájezd po našem UX, něco jsme udělali špatně.

Otázka, ke které jsem se pořád vracel
„Pomáhá tahle věc zákazníkovi, nebo ji tam máme jen proto, že vypadá dobře?“

Checkout na jedné stránce

Jedna z největších změn přichází až na konci nákupu. Původní objednávkový proces byl rozdělený do několika kroků. Adresa. Pokračovat. Doprava. Pokračovat. Platba. Pokračovat. Kontrola…

Funguje to. Ale také je rok 2026 a lidstvo už snad zvládne vidět adresu, dopravu a platbu současně. Proto jsem checkout předělal tak, aby zákazník viděl celý důležitý proces na jediné obrazovce.

Nový nákupní proces
Kontaktní údaje Doručení Platba Kontrola OBJEDNAT
01
Údaje
Kontakt, fakturace a případná jiná doručovací adresa.
02
Doprava
Dostupné varianty jsou vidět přímo vedle zbytku objednávky.
03
Platba
Zákazník rovnou vidí dostupné možnosti a nemusí na další stránku.
04
Objednat
Souhrn, cena a finální potvrzení jsou pořád na očích.
Výsledek
Vyberu. Zkontroluji. Objednám.
Kliknout na „Objednat“ nebylo na FALLENS AIRSOFT nikdy jednodušší.

Mega menu, které ukazuje, nejen vypisuje

Sortiment mezitím vyrostl natolik, že obyčejné rozbalovací menu začalo připomínat telefonní seznam.

Proto vzniklo nové mega menu s obrázky. Kategorie už nejsou jen textové položky pod sebou. Můžeme pracovat s jejich strukturou, skupinami, odkazy i vizuální orientací.

Kategorie
Airsoftové zbraně
BBs
Zásobníky
Plyny & CO₂
Taktická výstroj
Vyber podle toho, co hledáš
AEG
Elektrické zbraně
GBB
Plynové zbraně
HPA
Vzduchové systémy
Menu nemá pouze obsahovat sortiment. Má mu dát strukturu.

Hero slider: fotografie a skutečný obsah dohromady

Nechtěl jsem klasický banner, kde je všechen text napečený přímo do JPG. Takové bannery vypadají hezky přesně do chvíle, než potřebuješ změnit text, lokalizaci, SEO nebo zjistíš, že mobil má poněkud jiný poměr stran než 27" monitor.

Obrazová část
Atmosféra

Fotografie nebo grafika vytváří první dojem, ukazuje produkt, akci nebo konkrétní část airsoftového světa.

HTML část
Skutečný obsah

Nadpis, text i CTA zůstávají skutečným HTML. Jsou editovatelné, responzivní, čitelné a použitelné pro SEO.

Kategorie nejsou skladiště produktů

Nechci, aby zákazník otevřel kategorii a systém mu suše oznámil:

„Zde je 84 produktů.“
Hodně štěstí.

Proto postupně stavíme kategorie jako skutečné rozcestníky. Využíváme podkategorie, vizuální karty, skupiny, související odkazy, obsah a různé cesty podle toho, co hráč skutečně hledá.

01 · Struktura
Kategorie a podkategorie podle reálného použití.
02 · Skupiny
Logické celky nad běžnou stromovou strukturou katalogu.
03 · Vizuály
Obrázek pomůže s orientací rychleji než další odstavec menu.
04 · Kontext
Obsah a odkazy pomohou hráči pochopit, co skutečně vybrat.

Malé funkce, které šetří zbytečné přemýšlení

Ne každá změna potřebuje vlastní billboard. Některé jsou malé, ale při každém nákupu odstraní kousek zbytečné práce.

Novinka
Product badges

Novinka. Akce. Doporučení. Specifický stav produktu. Informace, které dávají smysl ještě před otevřením detailu.

Design není jen vzhled. Je to i množství přemýšlení, které po člověku vyžaduje.

QR platba
Méně opisování

Při platbě převodem není potřeba ručně opisovat účet, částku a variabilní symbol.

NASKENUJ ZKONTROLUJ POTVRĎ

Airsoftový slovníček

Nový FALLENS ale nemá být pouze obchod. Airsoft je plný výrazů jako AEG, GBB, HPA, hop-up, MOSFET, ETU, tracer, ROF, FPS nebo joule creep.

Pro zkušeného hráče normální slovník. Pro člověka, který právě vybírá první zbraň, lehká forma psychologického teroru.

AEG GBB HPA HOP-UP MOSFET ETU FPS JOULE
Nejen prodávat
Vědět, co kupuji

Jednotlivé pojmy můžeme vysvětlovat samostatně, propojovat je s dalšími hesly, články a relevantními částmi katalogu.

Otevřít slovníček →

Blog už není jen chronologický seznam článků

Klasický e-shopový blog funguje jednoduše: napíšeš článek, potom další, další… a za pár let máš jednu obrovskou chronologickou hromadu obsahu.

Na FALLENS chceme obsah budovat dlouhodobě. Proto nová struktura blogu umožňuje pracovat nejen s jednotlivými články, ale také s kategoriemi a obsahovými sériemi.

Kategorie
Čtenář může přejít rovnou k oblasti, která ho zajímá.
Série
Více článků může tvořit souvislý průvodce jedním tématem.
Kontext
Obsah se může přirozeně napojit na slovníček i katalog.

Produkt, kategorie, článek a slovníček se nemají ignorovat

Tradiční e-shop má katalog. Vedle něj blog. Někde další informační stránky. A všechny části se často tváří, jako by o sobě nikdy neslyšely.

PRODUKT
KATEGORIE
ČLÁNEK
SLOVNÍČEK
E-shop nemá být databáze náhodných stránek.
Má fungovat jako jeden propojený celek.

A pak jsou tu věci, které skoro nikdo neuvidí

Velká část práce na novém webu není vidět vůbec. A právě tam bývá nejvíc práce. Software má zvláštní smysl pro humor.

Responzivita nopCommerce Konfigurace DPH Lokalizace SEO Structured data Výkon Přístupnost Pluginy Košík Zákaznický účet Vyhledávání
Cílem je paradoxně to, aby o většině těchto věcí zákazník nikdy nepřemýšlel. Prostě fungují.
Z mé vývojářské dílny
Martin Erdt

Nový FALLENS AIRSOFT jsem nevymýšlel přes prostředníka a následně neposílal zadání externímu vývojáři. Jsem zároveň člověk stojící za FALLENS AIRSOFT a dlouholetý softwarový vývojář za MedielSoft.

Design, architektura theme, nové komponenty i řada funkcí, které na e-shopu postupně vznikají, tak pocházejí přímo z mojí vývojářské dílny.

SOFTWARE DEVELOPMENT
MedielSoft
.NET · webové aplikace
vlastní nástroje · e-commerce
medielsoft.cz →
Provoz FALLENS
„Tohle mě štve.“
Problém vidím přímo při reálném používání e-shopu.
Vývoj MedielSoft
„Jak by to mělo fungovat správně?“
A potom můžu otevřít vývojové prostředí a postavit řešení.

Když se propojí software a airsoft

Stejným způsobem ostatně vznikají i další moje projekty. Jedním z nich je například Airsoft Ballistic Calculator, aplikace zaměřená na výpočty trajektorie BBs, rychlosti, kinetické energie, gramáže, zeroingu a konfigurace airsoftových sestav.

SOFTWARE + AIRSOFT = FALLENS

Právě díky tomu můžu některé věci stavět trochu jinak. Ne podle toho, co zrovna umožňuje zakoupená šablona, ale podle toho, co dává smysl hráči, zákazníkovi a zároveň člověku, který celý systém dlouhodobě provozuje.

Je nový FALLENS hotový?

Ani náhodou.

A tentokrát je to dobře. Nové theme vytváří základ, nad kterým můžeme dál stavět.

Lepší kategorie Propojenější obsah Další pojmy Obsahové série Vyhledávání Mobilní UX Méně zbytečných kroků
Nový FALLENS AIRSOFT
Nechtěl jsem hezčí e-shop.
Chtěl jsem lepší FALLENS.

Vlastní značka, vlastní produkty, vlastní obsah a vlastní software. Nový vzhled je jeho nejviditelnější část. Pod ním je ale mnohem víc.

VLASTNÍ ZNAČKA VLASTNÍ PRODUKTY VLASTNÍ OBSAH VLASTNÍ SOFTWARE VLASTNÍ SMĚR
Projít nový FALLENS → Otevřít slovníček
Martin Erdt
MEDIELSOFT × FALLENS AIRSOFT