Prototipare rapida cu ajutorul componentelor in Figma

Configurare noua (How To)

Situatie

Avem unsidebar cu 5 optiuni (Home, Products, Mail, Calendar, Contacts) respectiv cele 5 pagini aferente lor. Fara componente, fiecare pagina trebuie sa fie legata individual la toate celelalte 4 pagini. In plus, designerul trebuie sa modifice manual starea activa a sidebar-ului pe fiecare frame de destinatie (ex: daca treci de pe Home pe Products, trebuie sa creezi un frame nou unde Products este activ). Astfel, rezulta un prototip lent, peste 20 de linkuri doar pentru navigarea primara si modificari de design greoaie.

Am atasat mai jos un exemplu. Am facut pentru 2 screen-uri, dar trebuie facut manual pentru toate cele 6. Este foarte laborios.

Solutie

Rezolvarea este foarte simpla, o luam pe pasi:

Pasul 1: Luam deoparte sidebar-ul si facem auto-layout

Pasul 2: Apasam Ctrl + Alt + K pentru a crea componenta. Ar trebui sa apara un “diamant”

Pasul 3: Linkam fiecare rubrica la pagina corespunzatoare (5 link-uri, atat)

Pasul 4: Copiem componenta si o punem pe fiecare pagina, iar link-urile se vor crea automat

Acum putem schimba usor orice buton, putem face link la o alta pagina, daca vrem sa schimbam scopul unui buton etc.,prin umare, mult mai multa flexibitate.

Tip solutie

Permanent

Voteaza

(4 din 8 persoane apreciaza acest articol)

Despre Autor

Leave A Comment?