29.07.2025
Navigacija je ključna unutar svakog digitalnog sučelja. Pametne komponente omogućuju nam stvaranje prilagođenih interaktivnih navigacijskih komponenti koje savršeno funkcioniraju s ostatkom vašeg prototipa. U ovom vodiču obradit ćemo koncepte ugnježđivanja komponenti, dodavanja događaja elementima u komponenti pomoću varijabli događaja i propuštanja tih događaja kroz vaše komponente. Jedna od glavnih prednosti korištenja ugniježđenih komponenti je ta što pruža potpunu kontrolu nad njihovim stanjima, kao što su jedinstvena stanja lebdenja elemenata unutar druge komponente.
Počevši od atomske razine
Framer vam omogućuje stvaranje potpuno interaktivnih i animiranih komponenti, pa čak i ugnježđivanje komponenti unutar drugih komponenti. Izrađujemo komponentu navigacijske trake za web stranicu koja će sadržavati dvije različite vrste ugniježđenih komponenti, s njihovim vlastitim jedinstvenim interakcijama. Naš projekt će sadržavati navigacijsku traku koja sadrži različite ugniježđene komponente, naime pet Nav stavki i jednu komponentu Košarice za kupnju. Dizajn naših ugniježđenih komponenti, stavke navigacijskog popisa i košarice za kupnju, utjecat će na način na koji dizajniramo našu navigacijsku traku. Iz tog razloga, optimalni tijek rada uključuje početak s ‘najdubljom’ ugniježđenom komponentom i izgradnju od tamo.
Ugnježđivanje komponenti
Nakon što su naše dvije komponente spremne, možemo početi stvarati komponentu u koju ćemo ih ugnježđivati. Nacrtajte navigacijsku traku, odaberite je na platnu i kliknite alat Komponenta u alatnoj traci. Da biste ugnježđivali drugu komponentu u našu novu komponentu, jednostavno povucite bilo koju drugu komponentu na platno komponente i postavite je unutar dizajnirane navigacijske trake.
Pokretanje interakcija s navigacijske trake
Natrag na glavnom platnu, željeli bismo moći dodirnuti ‘Odjeća’ i preći na potpuno novi zaslon. Ako biste komponentu pomoću Prototyping Connectora povezali s novim zaslonom, mogli bismo postaviti interakciju. Međutim, to bi se pokrenulo ako dodirnemo bilo gdje unutar naše komponente. To nije ono što želimo učiniti, jer želimo pokrenuti ovaj prijelaz samo s određenog elementa. Tu dolaze do izražaja varijable događaja, koje su posebne vrste varijabli koje nisu vezane za svojstva (poput neprozirnosti ili ispune), već za događaje.