Tento vizuál stylizovaného řezu saunou jsem vytvořila v Rive s cílem simulovat jednoduchý interaktivní konfigurátor. Design kombinuje statickou kresbu se světelnou atmosférou a dvěma interaktivními prvky – volbou typu skla a světlem. Na projekt jsem si vybrala sauny od značky What a hut.
Pro lepší strukturu a kontrolu nad animacemi jsem rozdělila jednotlivé části do samostatných kompozic (tzv. „slices“) v rámci jedné scény:
Levá část – saunová kamna a lavice
Střední část – další lavice
Pravá část – sprchový kout
Každý segment byl vytvořen z vektorových tvarů a seskupen logicky, aby se s ním dalo jednoduše manipulovat v animacích i při změnách stavu.
Pro přepínání stavů jsem vytvořila následující inputs (vstupy) v rámci State Machine:
glassType– typu „trigger“, spouští přechod mezi „Blurred“ a „Transparent“lightOn– typu „boolean“, přepíná světelnou vrstvu mezi zapnuto/vypnuto
Každý interaktivní prvek má nastavený listener (naslouchání události), který reaguje na kliknutí:
- Ikona skla má listener, který aktivuje trigger
glassType - Ikona světla má listener, který přepíná stav boolean proměnné
lightOn
Díky listenerům se změny ve stavech okamžitě propisují do vizuálu – mlhavé sklo se například zobrazí přes jednoduchou poloprůhlednou vrstvu, která se animuje opacity přechodem.
Práce z procesu:
Během procesu k finálnímu výsledku mi vyšly zase celkem hezky jiné pokusy jako jsou:
Modelování modulárního domečku
AI generování sauny, aby se dostala k realistickému pohledu
