UI komplektide kasutamine Adobe XD-s
Miscellanea / / November 29, 2021
Veebikujundusest huvitatutele lisatakse kasutajaliidese komplektid Adobe XD on suurepärane viis uue disainiprojekti käivitamiseks. Nende komplektidega saate juurdepääsu mõnele käepärasele ressursile, mida saate muuta ja kasutada oma veebisaidi või rakenduse kujunduses.
Kui olete tarkvara uus kasutaja ja pole kindel, kuidas kasutajaliidese komplekte kasutada Adobe XD, siis olete jõudnud õigesse kohta. Selles artiklis näitan teile, kuidas saate installida tarkvarasse kasutajaliidese komplekte ja seejärel kasutada oma projekti jaoks kaasasolevaid ressursse.
UI komplektide allalaadimine Adobe XD-s
Kõigepealt vaatame, kuidas saate Adobe XD-s kasutajaliidese komplekte otse tarkvarast alla laadida. Alustamiseks järgige lihtsalt neid samme.
Samm 1: Klõpsake tarkvara vasakus ülanurgas hamburgeri menüü nuppu.
2. samm: Kerige menüüs alla valikuni Hangi kasutajaliidese komplektid ja seejärel klõpsake kolmel saadaolevast valikust.
Selle artikli jaoks valin Google'i materjali kasutajaliidese komplekti. Kuid olenevalt projektist saate valida kas Apple iOS-i või Microsoft Windowsi komplektid. See avab ametliku veebilehe, kust saate kasutajaliidese komplektid tasuta alla laadida.
3. samm: Leidke järgmiselt veebilehelt Adobe XD kasutajaliidese komplekt ja laadige see oma süsteemi alla.
4. samm: Nüüd avage allalaaditud fail Adobe XD-s ja teid tervitatakse hunniku joonistahvlitega, mis sisaldavad vastava platvormi kasutajaliidese ressursse.
Saate hoida all klahvi Ctrl ja liigutada kerimisratast, et sisse/välja suumida, et näha kõiki üksikuid joonistusplaate.
Kui soovite selle asemel alla laadida Wireframes, võite klõpsata menüüs Hangi kasutajaliidese komplektid suvandil Wireframes.
Täiendavaid kasutajaliidese komplekte saate otsida ka Adobe veebisaidilt, klõpsates menüüs Hangi kasutajaliidese komplektid valikul Rohkem kasutajaliidese komplekte.
Veebisaidil on mõned suurepärased valikud, sealhulgas see tõeliselt lahe Movie Magic kasutajaliidese komplekt, mis näeb välja nagu hoiatusekraan.
Nüüd, kui teate, kuidas kasutajaliidese komplekte alla laadida, vaatame, kuidas saate neid oma projektides kasutada.
UI komplektide kasutamine Adobe XD-s
UI komplektide kasutamiseks oma projektis järgige lihtsalt neid lihtsaid samme.
Samm 1: Suumige sisse kasutajaliidese element, mida soovite oma projektis kasutada, ja klõpsake selle valimiseks selle pealkirja.
2. samm: Nüüd kopeerige element kiirklahvi Ctrl+C abil.
3. samm: Seejärel avage menüüst uus Adobe XD projekt.
4. samm: Siia kleepige kasutajaliidese element kiirklahvi Ctrl+V abil.
Selle artikli jaoks kasutan Google Materiali kasutajaliidese komplekti Mobile Dark elementi. Element sisaldab juhendeid, mis aitavad teil rohkem paigutada kihid, kuid kui te ei soovi neid kasutada, saate need hõlpsalt eemaldada, järgides järgmist sammu.
5. samm: Juhiste eemaldamiseks klõpsake vasakus ülanurgas lukuikooni ja seejärel nuppu Kustuta. Võite selle sammu vahele jätta, kui soovite kasutada juhendeid rohkemate objektide täpseks paigutamiseks.
6. samm: Nüüd minge tagasi kasutajaliidese komplekti, et valida mõni muu element, mida sellele lehele lisada. Veel kord klõpsake elemendi pealkirja ja kopeerige see kiirklahvi Ctrl+C abil.
Loon selle artikli jaoks põhitoosti, mille jaoks kasutan ühte dialoogidest.
7. samm: Kleepige uus element eelmisele elemendile ja seejärel joondage see vastavalt juhistele.
8. samm: Nüüd iga röstsaia elemendi redigeerimiseks topeltklõpsake tekstikasti ja seejärel sisestage tekst, mida soovite kasutada. Esiteks muudame röstsaia pealkirja.
Järgmisena muutke keha sisu, topeltklõpsates tekstiväljal ja sisestades kõik, mida soovite lisada.
Samal viisil saate muuta ka nuppude tekste. Kui olete teksti redigeerimisega lõpetanud, saate muuta teksti värvi ja läbipaistmatust. Läbipaistmatuse muutmiseks liigutage lihtsalt tööriistariba valiku Läbipaistmatus all olevat liugurit paremale.
Teksti värvi muutmiseks klõpsake suvandi Fill kõrval olevat ristkülikut ja seejärel valige värvivalijast uus värv.
Ja sel viisil ei saa muuta ainult teksti. Samuti saate muuta peaaegu kõigi dialoogiboksis olevate üksuste värvi ja läbipaistmatust, mis on suurepärane, kui otsite ainulaadset värviskeemi.
Kui olete tulemusega rahul, jätkake ja salvestage fail, klõpsates menüüs suvandil Salvesta nimega või kasutades kiirklahvi Shift+Ctrl+S.
Täiustage oma disain kasutajaliidese komplektide abil
Nüüd, kui teate, kuidas Adobe XD-s kasutajaliidese komplekte alla laadida ja kasutada, olen kindel, et hakkate kiiresti välja tooma hämmastavaid kujundusi. Need kasutajaliidese komplektid on kindlasti üsna käepärased ja aitavad teil otse oma projekti juurde jõuda, ilma et peaksite muretsema iga kasutajaliidese elemendi kujundamise pärast.
Järgmisena: Kas olete Adobe XD-s projekti lõpetanud ja ei tea, kuidas seda HTML-i eksportida? Lihtsa samm-sammulise õpetuse saamiseks vaadake järgmist artiklit.