Diplomová práce zkoumá, jak může imerzivní webový zážitek proměnit nákupní rozhraní v e-commerce. Místo klasického „přidat do košíku“ jsem navrhla a naprogramovala interaktivní kiosk Aquivio, dotykové rozhraní pro míchání vlastní ochucené vody na míru.

Projekt je postavený jako fungující prototyp v Reactu a Vite pro portrétový dotykový displej (1080 × 1920). Celé rozhraní stojí na vlastním design systému s tokens.css jako jediným zdrojem pravdy, díky čemuž drží vizuální jazyk konzistentní napříč všemi obrazovkami.
Uživatel projde celou cestou: od domovské obrazovky s animovaným aurora pozadím a frosted-glass prvky, přes konfigurátor s tekutými „metaball“ bublinami a výběrem infuzí, až po review, platbu a samotnou fázi nalévání s animacemi. Součástí je i AI Guidance kvíz, který nápoj doporučí podle nálady a potřeb.



Tahle práce pro mě byla průlomová. Jako designérka jsem se vždycky pohybovala někde mezi vizí a tím, co je technicky reálné. Díky práci s Claude Code jsem ale dokázala převést návrh do funkčního prototypu jedna ku jedné, bez kompromisů a bez toho, abych se musela spoléhat na někoho dalšího. Design jsem mohla v reálném čase testovat přímo v prohlížeči, hned vidět, co funguje a co ne, a postupně ho ladit a zlepšovat. Z designu se tak nestal statický obrázek, ale živá věc, kterou jsem mohla osahat a vyvíjet dál.
Všechny animace a efekty jsou napsané čistě, bez externích UI knihoven. Důraz byl na plynulost, výkon na kiosku a práci s detailem, která má z nákupu udělat zážitek, ne transakci.




