Kako ustvariti grafiko z Adobe XD: Vodnik za začetnike

Adobe XD je zmogljivo orodje, ki vam omogoča ustvarjanje UI/UX zasnov za programsko opremo, aplikacije, spletna mesta in drugo. To vključuje tudi ustvarjanje modelov, prototipov in komponent uporabniškega vmesnika po meri za vmesnik. Z Adobe XD lahko ustvarite tako preproste kot zapletene modele.

Tukaj bomo orisali, kako novemu projektu Adobe XD dodati preprosto grafiko, vključno z oblikami, slikami in besedilom. Temu bo sledil vodnik o tem, kako pretvoriti skupino oblik v komponente in kako te komponente ponovno uporabiti na strani. Na koncu bo članek obravnaval tudi, kako izvoziti svojo grafiko. Kar skočimo noter.

Ustvarjanje projekta Adobe XD

Ko ustvarite nov projekt Adobe XD, morate izbrati velikost postavitve za svoj projekt. Ponuja nekaj predlog, med katerimi lahko izbirate glede na nekatere priljubljene naprave.

Nekaj ​​​​primerov tega vključuje iPhone X/XS/11 Pro (375 krat 812 slikovnih pik), iPad (768 krat 1024 slikovnih pik) ali Web 1920 (1920 krat 1080 slikovnih pik). Druga možnost je, da izberete širino in višino po meri za vaš projekt.

Ko ustvarite nov projekt, bo Adobe XD odprl prazno stran. Tukaj lahko začnete dodajati slike, oblike, besedilo ali druge elemente oblikovanja. Odvisno od tega, katero različico Adobe XD imate, boste morda lahko raziščite nekatere nove funkcije ki jih ponuja Adobe XD.

Element oblikovanja najvišje ravni je sama stran platna. Če ga označite, lahko uporabite desno podokno, da neposredno spremenite nekatere njegove lastnosti, na primer širino ali višino platna.

Kako dodati slike

V svoj projekt Adobe XD lahko dodate slike na več načinov.

• Prva možnost je, da kliknete na hamburger ikona menija na vrhu levega stolpca. Kliknite na Uvoziin odprite datoteko, ki jo želite dodati.
• Druga možnost je, da se v raziskovalcu datotek pomaknete do svoje slike in povlečete datoteko neposredno v Adobe XD.
• Tretja možnost je kopiranje in lepljenje slike, če jo imate odprto v drugi programski opremi, kot je Microsoft Word.

Kako spremeniti velikost in položaj slike

Lahko prestavite in spremenite velikost slike bodisi neposredno na platnu bodisi s spreminjanjem njegovih lastnosti.

1. Označite sliko. Ko označite element oblikovanja na platnu, boste lahko videli njegove lastnosti v desnem podoknu.
2. Spremenite širino in višino slike. Te predstavljajo W in H polja.
3. Lahko tudi spremenite X in Y koordinate mesta, kjer se začne zgornji levi del slike.
4. Če želite sliko premikati, kliknite in povlecite sliko naokoli na platnu.
5. Če želite spremeniti velikost, povlecite točke, ki se nahajajo na robovih slike.

Kako prilagoditi robove slike

Vogale slike lahko prilagodite, da spremenite njeno obliko.

1. Označite sliko.
2. Videli boste nekaj točk, ki se nahajajo okoli slike. Poleg tega je v kotih slike tudi nekaj točk.
3. Kliknite in povlecite točko znotraj slike. To bo sliko počasi preoblikovalo v drugačno obliko.

Kako sliki dodati druge učinke

S sliko lahko dodatno manipulirate z dodajanjem učinkov. To vključuje motnost, meje, učinke zamegljenosti in drugo.

1. Označite sliko in spremenite Omirnost v desnem podoknu.
2. Medtem ko je še vedno v desnem podoknu, spremenite barvo Bnaročilo. Tukaj lahko tudi spremenite debelina, stil pomišljaja, in kotni slog meje.
3. Sliki dodajte učinek zamegljenosti in spremenite Količina zamegljenosti predmeta za povečanje ali zmanjšanje intenzivnosti zamegljenosti.

Kako dodati oblike

Oblike lahko dodate v Adobe XD prek levega podokna.

1. V levem podoknu lahko ustvarite več osnovnih oblik, vključno s pravokotnikom, krogom, trikotnikom in črto. Izberite obliko, ki jo želite narisati.
2. Kliknite katero koli točko na platnu in povlecite kazalec, da začnete ustvarjati obliko.

Kako dodati oblike po meri

Za ustvarjanje lastne oblike lahko uporabite orodje za obliko po meri.

1. V levem podoknu izberite pisalo ikona.
2. Kliknite kjer koli na platnu, da dodate svojo prvo točko ali "vogal" za obliko. Za vsako točko oblike kliknite na platno na območju, kjer bi želeli biti.
3. Ko končate z ustvarjanjem oblike, pritisnite Esc tipko na tipkovnici.

Kako spremeniti barvo oblike

Z desnim podoknom lahko spremenite barvo oblike.

1. Poudarite obliko.
2. V desnem podoknu spremenite Fbolan.
3. Poleg tega lahko dodate obrobe, učinke zameglitve in spremenite motnost oblike na enak način kot slike.

Kako dodati besedilo

Lahko tudi dodajanje in urejanje besedila na enak način kot dodajate oblike.

1. Kliknite na Besedilo ikono v levem podoknu.
2. Kliknite kjer koli na platnu, da dodate novo besedilno polje. V besedilno polje vnesite želeno besedilo.
3. Uporabite desno podokno za urejanje velikost, družina pisav, in poravnavo polja.

Kako ustvariti komponente

Komponenta je skupina oblikovalskih elementov, ki jih je mogoče ponovno uporabiti. Če želite ustvariti in uporabiti komponento, morate najprej imeti skupino oblik ali drugih oblikovnih predmetov.

1. Označite skupino oblik na platnu. Z desno tipko miške kliknite skupino in izberite Naredite komponento.
2. Na dnu levega podokna kliknite na Sredstva. Odprl se bo nov meni s seznamom vseh sredstev, ki jih imate, vključno s komponento, ki ste jo pravkar dodali.
3. Kliknite in povlecite komponento s seznama komponent na platno. S tem boste ustvarili popolnoma enako skupino elementov.

Kako izvoziti predmete

Izvozite lahko posamezne elemente in celotno stran.

1. Če želite izvoziti en sam element, označite element, ki ga želite izvoziti.
2. Kliknite na hamburger ikona menija na vrhu levega stolpca.
3. Izberite Izvozi, nato kliknite na Izbrano.
4. Če želite izvoziti celotno stran (ali vse strani), izberite Vse umetniške plošče namesto tega.
5. Določite lahko obliko datoteke (PNG, JPG, SVG ali PDF), za kaj bo izvoženi element (na primer splet ali iOS) in kam želite shraniti datoteko.

Naučite se Adobe XD

To so samo osnove. Nekatere druge funkcije vključujejo možnost dodajanja hiperpovezav, simbolov, integracij aplikacij in kompletov uporabniškega vmesnika. Adobe XD občasno ponudi tudi nove funkcije, ki pomagajo izboljšati in poenostaviti ustvarjanje vaših modelov in oblikovanja uporabniškega vmesnika po meri.

Na spletu je na voljo več tečajev, ki vam pomagajo dvigniti vaše nove oblikovalske veščine na višjo raven.

Ti tečaji Adobe vas bodo spremenili v mojstra Creative Cloud

Preberite Naprej

O avtorju