Axure RP tip: Jak na AJAX
Jak simulovat AJAXové záložky v generovaném prototypu.
Pokud navrhujete pomocí Axure nějaký prototyp, dříve nebo později určitě použijete návrhový vzor známý jako záložky (taby) - více zde, zde nebo zde.
Demo ajaxových záložek.
Postupů, jak vytvořit záložky v Axure je celá řada. Níže je zmíněn postup s dynamickými panely a záložkami jako “selection group” (tato funkce je dostupná až v Axure RP verze 6).
Základ vypadá to takhle: přepínací záložky a jeden dynamický panel se všemi stavy obsahu.
Záložky jsou seskupené do skupiny (selection group), což funguje obdobně jako radio-group.
Při využití tohoto postupu je třeba vždy zavolat zvýraznění požadované záložky po načtení stránky. V našem případě vezmeme třeba hned první záložku.
Dynamický panel, který se stará o zobrazování obsahu jednotlivých záložek, obsahuje i speciální “state” navíc - v ukázce pojmenován jako “Loading”. Obsahem “Loadingu” může bý buď nějaký text typu “Načítám….”, nebo třeba klasický načítací animovaný GIF (ano, Axure umí zobrazit animované GIFy v exportovaném prototypu - viz demo níže).
Při kliknutí na záložku pak místo obyčejné změny stavu dynamického panelu zavoláme nejdřív zobrazení “Loadingu” a až po chvíli zobrazíme požadovaný “state” záložky.
Podobně jako se záložkami můžete pracovat i s dalšími dynamickými bloky vašeho prototypu.



Výhodou lightboxu jako samostatné stránky je zejména větší přehled o všech unikátních stránkách (hodí se například pro grafika - nezapomene to nakreslit).
Předpokládejme, že všechny lightboxy na stránce by měly vypadat vizuálně podobně (konzistence). Tím mám na mysli barvu pozadí, pozici zavíracího tlačítka apod.
Reálný lightbox v HTML a Javascriptu funguje jako layer, který se zobrazí bez znovunačtení stránky. Zavření lightboxu tedy pouze tento layer skrývá.