Kako napraviti element koji se može pomicati u Figmi

Omogućavanje pomicanja vašeg sadržaja u Figmi uključuje navigaciju bočnom karticom. Nažalost, ne pojavljuje se automatski na glavnom korisničkom sučelju. Sadržaj koji se može pomicati koristan je kada želite predstaviti puno informacija unutar okvira svog dizajna. Neki primjeri uključuju odredišne ​​stranice, sučelja aplikacije ili skočne prozore.

Ovaj članak će objasniti kako učiniti da se vaši Figma dizajni mogu pomicati.

Uklapanje teksta koji se može pomicati unutar oblika

Počnimo s izradom teksta koji se može pomicati unutar jednostavnog oblika. Ovo je najčešći primjer teksta koji se može pomicati, a naknadno možete dodati druga svojstva poput boje, fontova i obrisa.

Evo kako se to radi:

1. Napravite osnovni oblik. Za ovaj primjer preporučujemo izradu okomitog pravokutnika. To možete učiniti odabirom alata za pravokutnik na lijevoj bočnoj traci ili korištenjem naredbe “R”. Držite lijevo, kliknite na točku na platnu i nacrtajte oblik.
   
2. Na desnoj bočnoj traci, ispod kartice za dizajn, označite opciju "sadržaj isječka".
   
3. Odaberite alat za tekst da biste stvorili tekstualni okvir i smjestite ga unutar okvira koji se može pomicati. Upišite ili kopirajte i zalijepite sav sadržaj koji koristite.
   
4. Odaberite okvir i idite na karticu prototipa na desnoj strani sučelja. Zatim odaberite opciju "prelivno pomicanje" i stil koji želite. Ovdje ćemo odabrati "okomito pomicanje".
   

Nakon što kliknete na opciju prelijevanja na kartici prototipa, postoji više stilova. Biramo okomiti jer koristimo okomiti pravokutnik kao primjer. To vam omogućuje čitanje teksta od vrha do dna. Neki od ostalih stilova uključuju:

• Horizontalno pomicanje – korisnici mogu učiniti da se njihov tekst pomiče slijeva nadesno u nekim primjerima. Ova opcija je poželjnija ako stvarate dizajne u formatu krajobraza.
• Bez pomicanja – ako želite zaključati svoj sadržaj na mjestu, odaberite opciju bez pomicanja.
• Oba smjera – Stvorite dizajn s puno sadržaja i pomičite se okomito i vodoravno.

Trebali biste koristiti značajke koje se mogu pomicati unutar vašeg dizajna kako biste smanjili napor (klikove) koji vaš čitač koristi tijekom interakcije sa sadržajem. Mogu prelaziti prstom ili koristiti kotačić miša umjesto da klikaju ili dodiruju gomilu teksta.

Kako dizajnirati svoje klizajuće komponente

Ovisno o vašem proizvodu, morat ćete dizajnirati svoj okvir sadržaja i sam sadržaj. Proces uključuje dodavanje boje, fontova i potencijalno drugih komponenti cjelokupnom dizajnu. Promjena ovih elemenata je jednostavna, ali odabir prave estetike zahtijeva pažljivo razmatranje.

Kako promijeniti font vašeg dizajna koji se može pomicati

Prva stvar koju ćete morati učiniti je promijeniti font na vašem dizajnu koji se može pomicati. Figma nudi širok raspon stilova među kojima možete birati. Evo najjednostavnije metode:

1. Odaberite sadržaj u okviru koji se može pomicati koji želite promijeniti.
   
2. Dođite do padajućeg izbornika koji se nalazi u gornjem lijevom kutu i odaberite ga.
   
3. Pomičite se kroz fontove dok ne pronađete onaj koji želite koristiti.
   

Ako marka za koju dizajnirate ima određenu tipografiju, vjerojatno ćete odabrati istu kako bi bila u skladu s imidžom marke. Ako imate više prostora za migoljenje, trebali biste eksperimentirati s različitim primjerima prije nego odaberete onaj pravi.

Neka razmatranja uključuju:

• Namjera dizajna – odabir tipografije trebao bi odgovarati namjeri vašeg dizajna. Ako želite jasno prenijeti mnogo informacija, težite manje dekorativnim, ali elegantnim fontovima.
• Ostale komponente – Vaš font je vizualni element kao i svaki drugi u vašem dizajnu. Trebao bi odgovarati okviru i drugim komponentama koje uključite.
• Cjelokupna estetika i brendiranje – Opći dojam brenda također bi trebao utjecati na vaš odabrani font. Na primjer, usluga dostave cvijeća neće imati isti font kao SAAS odredišna stranica.

Iako bi odabir ispravnog fonta mogao zahtijevati malo eksperimentiranja, neki konkretni primjeri fontova najpouzdanije su opcije:

• Roboto – Ako želite igrati na sigurno, koristite Roboto. Smatra se svestranim i neutralnim fontom s mnogo primjena. Budući da je tako lako razumjeti, mnogi odabiru Roboto za upute i odredišne ​​stranice.
• Poppins – Za prijateljski, ali moderan i čist dojam odaberite Poppins. Ovaj font je zaobljeniji i čini tekst privlačnim i lakim za čitanje.
• Raleway – Kada dizajnirate za sofisticiranu luksuznu marku, možda biste trebali razmotriti Raleway. Općenito je tanak, ali ima različite varijacije težine i općenito elegantan izgled.
• Lato – Prijateljski, pouzdan i ozbiljan prave su riječi za opisivanje ovog fonta. Dizajneri mogu koristiti Lato za naslove i tekstove odlomaka gdje su čitljivost i jasnoća glavni problemi.

Također biste trebali razmotriti odabranu veličinu fonta i stil teksta. Općenito, podebljano se koristi za naslove ili naglašavanje segmenata, dok se kurziv koristi za navodnike.

Promjena boje oblika okvira

Osim promjene fonta, željet ćete promijeniti i boju oblika okvira. Još jednom, točna nijansa ovisit će o robnoj marki za koju dizajnirate ili o vašoj estetici. Srećom, Figmino sučelje olakšava odabir boje.

Evo kako možete promijeniti boje okvira:

1. Odaberite okvir koji želite urediti.
   
2. Sloj će se pojaviti na desnoj bočnoj traci. Dođite do odjeljka "ispuni".
   
3. Odaberite "+" za dodavanje ispune.
   
4. Otvorit će se prozor za odabir boja. Odaberite boju ispune i gradijent. Također možete upisati heksadecimalni kod ako znate točnu nijansu.
   

Kao i s drugim elementima dizajna, možda ćete morati eksperimentirati s različitim bojama i kako izgledaju s odabranim fontom.

FAQ

Postoji li tekstualna naredba za pomicanje u Figmi?

Nažalost, ne postoji naredba za pomicanje teksta unutar Figme. Međutim, možete dovršiti postupak u samo nekoliko klikova pomoću gore navedene metode.

Kako mogu odlučiti koju opciju prelijevanja želim?

To ovisi o vrsti teksta koji koristite, cjelokupnom dizajnu i njegovoj funkciji. Okomiti stil obično je dobar za preletavanje velikih tekstova.

Koje će sučelje uređaja obično trebati dizajn teksta koji se može pomicati?

Dobar primjer bi bili makete dizajna za aplikaciju. Korisnici mogu izraditi telefon kao opći okvir, dok tekst koji se može pomicati može biti sučelje aplikacije.

Je li Figma najbolji izbor za izradu dizajna koji se mogu pomicati?

Figma je jedan od najboljih alata za izradu širokog spektra obrazaca, uključujući dizajne koji se mogu pomicati. Još bolje, Figma je besplatna. Međutim, možda imate određene osobne preferencije. Pokušajte eksperimentirati s nekoliko platformi, kao što je Adobe Illustrator, dok ne pronađete alat koji vam najviše odgovara.

Učinite svoje dizajne pokretljivim i jednostavnim za korištenje

Izrada bilo kojeg teksta unutar okvira u Figmi je jednostavna. Jednostavno odaberite okvir i zatim prijeđite na opciju sadržaja isječka. Kada završite, možete odabrati opcije pomicanja preko prelijevanja. Isto tako, ne smijete zanemariti druge ključne elemente dizajna, kao što su boja i oblik okvira te font teksta. Mogućnost pomicanja vašeg dizajna odličan je izbor za odredišne ​​stranice, sučelja aplikacija i skočne prozore. Olakšava prelistavanje tekstova umjesto klikanja, što u konačnici poboljšava korisničko iskustvo.

Je li vam bilo lako učiniti da se vaš sadržaj može pomicati u Figmi? Što je s odabirom pravog fonta? Javite nam u odjeljku za komentare ispod.