Hogyan készítsünk görgethető elemet a Figmában

A tartalom görgethetővé tétele a Figmában magában foglalja az oldalsó lapon történő navigálást. Sajnos nem jelenik meg automatikusan a fő felhasználói felületen. A görgethető tartalom akkor hasznos, ha a tervezés keretein belül sok információt szeretne bemutatni. Néhány példa a céloldalak, az alkalmazásfelületek vagy az előugró ablakok.

Ez a cikk elmagyarázza, hogyan teheti görgethetővé Figma-terveit.

Görgethető szöveg illesztése egy alakzatba

Kezdjük egy görgethető szöveg létrehozásával egy egyszerű alakzaton belül. Ez a legáltalánosabb példa a görgethető szövegre, és később hozzáadhat más tulajdonságokat, például színt, betűtípusokat és körvonalakat.

Íme, hogyan történik:

1. Hozzon létre egy alapformát. Ebben a példában azt javasoljuk, hogy készítsen egy függőleges téglalapot. Ezt megteheti a bal oldalsávon található téglalap eszköz kiválasztásával vagy az „R” paranccsal. Tartsa balra, kattintson egy vászonpontra, és rajzolja meg az alakzatot.
   
2. A jobb oldalsávon, a tervezés fül alatt jelölje be a „kliptartalom” opciót.
   
3. Szövegdoboz létrehozásához válassza ki a szövegeszközt, és helyezze azt a görgethető keretbe. Írja be vagy másolja be az Ön által használt tartalmat.
   
4. Válassza ki a keretet, és lépjen a prototípus fülre a felület jobb oldalán. Ezután válassza ki a „túlcsordulási görgetés” opciót és a kívánt stílust. Itt a „függőleges görgetés” lehetőséget választjuk.
   

Miután rákattint a túlcsordulási görgetés lehetőségre a prototípus lapon, több stílus létezik. A függőlegest választjuk, mivel példaként egy függőleges téglalapot használunk. Ezzel felülről lefelé végigolvashatja a szöveget. Néhány más stílus a következőket tartalmazza:

• Vízszintes görgetés – A felhasználók néhány példában balról jobbra görgethetik szövegüket. Ez a lehetőség akkor előnyös, ha tereprendezési formátumban hoz létre terveket.
• Nincs görgetés – Ha rögzíteni szeretné a tartalmat, válassza a görgetés nélküli lehetőséget.
• Mindkét irány – Hozzon létre egy tervet sok tartalommal, és görgessen függőlegesen és vízszintesen egyaránt.

Görgethető funkciókat kell használnia a tervezésen belül, hogy minimálisra csökkentse az olvasó által a tartalommal való interakció során felmerülő erőfeszítéseket (kattintásokat). Csúsztathatják vagy használhatják az egér görgőjét, ahelyett, hogy kattintanak vagy koppinthatnak a rengeteg szövegen.

Görgethető komponensek tervezése

A terméktől függően meg kell terveznie a tartalomkeretet és magát a tartalmat. A folyamat magában foglalja a színek, a betűtípusok és potenciálisan egyéb összetevők hozzáadását az általános kialakításhoz. Ezen elemek megváltoztatása egyszerű, de a megfelelő esztétika kiválasztása alapos átgondolást igényel.

A görgethető terv betűtípusának megváltoztatása

Az első dolog, amit meg kell tennie, hogy módosítsa a betűtípust a görgethető kialakításon. A Figma stílusok széles skáláját kínálja, amelyek közül választhat. Íme a legegyszerűbb módszer:

1. Válassza ki a módosítani kívánt tartalmat a görgethető keretben.
   
2. Keresse meg a bal felső sarokban található legördülő menüt, és válassza ki azt.
   
3. Görgessen végig a betűtípusok között, amíg meg nem találja a használni kívánt betűtípust.
   

Ha az Ön által tervezett márka bizonyos tipográfiával rendelkezik, akkor valószínűleg ugyanazt fogja választani, hogy az összhangban legyen a márka imázsával. Ha több mozgástérrel rendelkezik, kísérletezzen különböző példákkal, mielőtt kiválasztja a megfelelőt.

Néhány megfontolás:

• Tervezési szándék – A tipográfia kiválasztásának meg kell egyeznie a tervezési szándékkal. Ha sok információt szeretne egyértelműen átadni, törekedjen kevésbé dekoratív, de elegáns betűtípusokra.
• Egyéb összetevők – Az Ön betűtípusa olyan vizuális elem, mint bármely más a tervben. Meg kell egyeznie a kerettel és az egyéb alkatrészekkel.
• Általános esztétika és márkaépítés – A márka általános hangulatának is befolyásolnia kell a választott betűtípust. Például egy virágküldő szolgáltatás nem fogja ugyanazt a betűtípust használni, mint egy SAAS céloldal.

Bár a megfelelő betűtípus kiválasztása némi kísérletezést igényelhet, néhány konkrét betűtípus a legmegbízhatóbb lehetőség:

• Roboto – Ha biztonságosan szeretne játszani, akkor használja a Robotót. Sokoldalú és semleges betűtípusnak tekinthető, számos alkalmazással. Mivel nagyon könnyen érthető, sokan a Robotót választják útmutatásként és céloldalként.
• Poppins – Barátságos, de modern és letisztult megjelenésért válassza a Poppins-t. Ez a betűtípus lekerekítettebb, vonzóvá és könnyen olvashatóvá teszi a szöveget.
• Raleway – Ha kifinomult luxusmárkát tervez, érdemes megfontolni a Raleway-t. Általában vékony, de különböző súlyváltozatokkal és általános elegáns megjelenéssel rendelkezik.
• Lato – Barátságos, megbízható és komoly a megfelelő szavak ennek a betűtípusnak a leírására. A tervezők a Lato-t olyan címsorokhoz és bekezdésszövegekhez használhatják, ahol az olvashatóság és az áttekinthetőség a legfontosabb szempont.

Érdemes megfontolni a választott betűméretet és szövegstílust is. Általában a vastag betűt a címsorok vagy a szegmensek kiemelésére használják, míg a dőlt betűt az idézőjeleknél.

A keret alakjának színének megváltoztatása

A betűtípus megváltoztatása mellett a keret alakzatának színét is meg kell változtatnia. A pontos árnyalat a tervezett márkától vagy az esztétikumától is függ. Szerencsére a Figma felülete megkönnyíti a szín kiválasztását.

A következőképpen módosíthatja a keret színét:

1. Válassza ki a szerkeszteni kívánt keretet.
   
2. A réteg megjelenik a jobb oldalsávon. Navigáljon a „kitöltés” ​​részhez.
   
3. Kitöltés hozzáadásához válassza a „+” jelet.
   
4. Megnyílik egy színválasztó ablak. Válassza ki a kitöltési színt és a színátmenetet. Beírhat egy hexadecimális kódot is, ha ismeri a pontos árnyalatot.
   

A többi dizájnelemhez hasonlóan előfordulhat, hogy kísérleteznie kell különböző színekkel, és hogyan néznek ki a választott betűtípussal.

GYIK

Van görgethető szöveges parancs a Figmában?

Sajnos nincs parancs a szöveg görgethetővé tételére a Figmán belül. A folyamatot azonban néhány kattintással befejezheti a fent említett módszerrel.

Hogyan dönthetem el, hogy melyik túlcsordulási opciót szeretném?

Ez a használt szöveg típusától, az általános kialakítástól és funkciójától függ. A függőleges stílus általában jó nagy szövegek átfutásához.

Melyik eszközfelületen van általában szükség görgethető szöveges kialakításra?

Jó példa erre egy alkalmazás tervezési makettjei. A felhasználók létrehozhatnak egy telefont általános keretként, míg a görgethető szöveg az alkalmazás felülete lehet.

A Figma a legjobb választás görgethető minták készítéséhez?

A Figma az egyik legjobb eszköz a formák széles skálájának elkészítéséhez, beleértve a görgethető terveket is. Még jobb, a Figma ingyenes. Lehetnek azonban bizonyos személyes preferenciái. Próbáljon kísérletezni néhány platformmal, például az Adobe Illustratorral, amíg meg nem találja az Önnek legmegfelelőbb eszközt.

Tedd görgethetővé és felhasználóbaráttá a terveit

A Figmában könnyű bármilyen szöveget létrehozni egy kereten belül. Egyszerűen válassza ki a keretet, majd lépjen a kliptartalom lehetőségre. Ha elkészült, kiválaszthatja a túlcsordulási görgetés beállításait. Hasonlóképpen, nem szabad figyelmen kívül hagynia az egyéb alapvető tervezési elemeket sem, például a keret színét és formáját, valamint a szöveg betűtípusát. A design görgethetővé tétele kiváló választás céloldalakhoz, alkalmazásfelületekhez és felugró ablakokhoz. Egyszerűbbé teszi a szövegek átlapozását a kattintás helyett, ami végső soron javítja a felhasználói élményt.

Könnyen görgethetővé tette a tartalmat a Figmában? Mi a helyzet a megfelelő betűtípus kiválasztásával? Tudassa velünk az alábbi megjegyzések részben.