Oblikovanje uporabniških vmesnikov pogosto zahteva uporabo oblik in simbolov, da bi ustvarili privlačno in uporabniku prijazno izkušnjo. V tem tutorialu se boš naučil, kako lahko oblike v Adobe XD ustvariš samostojno in simetrično uporabiš, da boš svoje oblikovanje naredil bolj učinkovito. Pogovarjali se bomo o uporabi osnovnih orodij, da bi hitro ustvarili različne ikone in simbole, ki jih lahko znova in znova uporabljaš v svojih projektih.
Najpomembnejši vpogledi
- Simboli in oblike lahko ustvarite ali uvozite neposredno v Adobe XD.
- Uporaba orodja Pathfinder omogoča učinkovito povezovanje linij za ustvarjanje kompleksnih oblik.
- Simboli naj bi se uporabljali za objekte, ki jih potrebujemo večkrat, da prihranimo čas in zagotovimo doslednost.
Navodila po korakih
1. Aktivacija mreže in začetek z orodjem za linije
Da bi začel ustvarjati oblike, najprej aktiviraj mrežo tako, da se približaš delovni površini. Mreža pomaga natančno poravnati elemente. Z orodjem za linije lahko dosežeš že veliko. Klikni nanjo in drži tipko Shift, da potegneš ravno linijo.
2. Ustvarjanje puščic z orodjem Pathfinder
Zdaj lahko prilagodiš linije, ki si jih narisal, na isto velikost. Označi vse linije, ki si jih narisal, da uporabiš orodje Pathfinder. Uporabi funkcijo „Dodaj“, da linije združiš v eno samo puščico. Če so koti preostr, aktiviraj možnost za zaobljene kote.
3. Ustvarjanje ikone hamburgerja
Za ikono hamburgerja najprej potegni linijo določene debeline. Nato izberite ponavljajočo mrežo in dodajte še dve liniji, da ustvariš tri črte za ikono ustvariti. Linije nato združi, da ikona ostane stabilna.
4. Uporaba orodja za poti za ustvarjanje kreativnih oblik
Zdaj bomo uporabili orodje za poti, da ustvarimo kreativnejše oblike. Potegni krog in nato dodaj nekaj dodatnih sidrnih točk z orodjem Pathfinder. To omogoča ustvarjanje ukrivljenih oblik, kot v simbolu WLAN. Ne pozabi prilagoditi debeline črte in skupine celotne oblike.
5. Ustvarjanje gumbov in prilagoditev besedila
Da bi ustvaril gumb, potegni pravokotnik in izberi ustrezno barvo ali gradient. Nato dodaj besedilno polje, da gumbu dodaš oznako. Ne pozabi, da spremembe besedila niso globalne za vse gumbe, ko so shranjeni kot simbol.
6. Ustvarjanje in shranjevanje simbolov
Da bi ustvaril simbole, označi elemente, ki jih želiš uporabiti kot simbol, in uporabi bližnjico Command (Nadzorna) + K, da jih preneseš v vrstico simbolov. S tem lahko iste elemente uporabljaš večkrat, ne da bi jih moral ob vsaki uporabi znova ustvarjati.
7. Izkoristi sposobnosti za urejanje simbolov
Če želiš spremeniti simbol v svojem oblikovanju, ne da bi želel, da je sprememba globalna, lahko prekineš grupiranje simbolov ali ga pretvoriš v normalno obliko. To ti omogoča individualno prilagoditev brez vpliva na druge instance simbola.
8. Uporabi praktično funkcijo iskanja
Če imaš v svojem oblikovanju veliko elementov, ti funkcija iskanja v vrstici simbolov omogoča hitro iskanje določenega simbola. Preprosto uporabi filter, da pregledate simbole in jih lažje upravljati.
Zaključek - Adobe XD: Učinkovita uporaba simbolov in oblik
Povzetek: Adobe XD ti nudi orodja za učinkovito ustvarjanje in upravljanje oblik in simbolov. Z tehnikami in bližnjicami, ki so predstavljene, si sposoben optimizirati svoje oblikovalske procese in ustvariti dosledne zasnove.
Pogosto zastavljena vprašanja
Kako ustvarim nov simbol v Adobe XD?Označi željen element in pritisni Command (Nadzorna) + K, da ga shraniš v vrstico simbolov.
Kaj se zgodi, če izbrišem simbol iz vrstice simbolov?Simbol se odstrani iz knjižnice, vendar ostane vidljiv na umetniški plošči.
Ali lahko spremenim velikost že ustvarjenega simbola?Da, če prilagodiš debelino črte, se vse instance simbola samodejno spremenijo.
Kako lahko urejam več instanc simbola, ne da bi jih spremenil globalno?Prekini grupiranje z desnim klikom ali uporabi bližnjico Command (Shift) + G.
Delujejo besedila v simbolih enako kot drugi elementi?Ne, spremembe besedila simbola vplivajo le na specifično instanco in ne na druge.
