„Adobe XD“ yra galingas įrankis, leidžiantis kurti UI/UX dizainą programinei įrangai, programoms, svetainėms ir kt. Tai taip pat apima maketų, prototipų ir pasirinktinių sąsajos UI komponentų kūrimą. Naudodami „Adobe XD“ galite kurti tiek paprastus, tiek sudėtingus dizainus.

Čia apibūdinsime, kaip į naują „Adobe XD“ projektą pridėti paprastą grafiką, įskaitant figūras, vaizdus ir tekstą. Po to bus pateiktas vadovas, kaip paversti figūrų grupę į komponentus ir kaip pakartotinai panaudoti šiuos komponentus puslapyje. Galiausiai, straipsnyje taip pat bus aptarta, kaip eksportuoti grafiką. Įšokime tiesiai.

Adobe XD projekto kūrimas

Kai kuriate naują „Adobe XD“ projektą, turėtumėte pasirinkti savo projekto išdėstymo dydį. Jame pateikiami keli šablonai, kuriuos galite pasirinkti pagal kai kuriuos populiarius įrenginius.

Keli to pavyzdžiai yra „iPhone X/XS/11 Pro“ (375 x 812 piks.), „iPad“ (768 x 1024 piks.) arba „Web 1920“ (1920 x 1080 piks.). Arba taip pat turite galimybę pasirinkti pasirinktinį plotį ir aukštį savo projektui.

instagram viewer

Sukūrę naują projektą, „Adobe XD“ atidarys tuščią puslapį. Čia galite pradėti pridėti vaizdų, formų, teksto ar kitų dizaino elementų. Priklausomai nuo to, kurią „Adobe XD“ versiją turite, galbūt galėsite ištirti kai kurias naujas funkcijas kuriuos siūlo „Adobe XD“.

Aukščiausio lygio dizaino elementas yra pats drobės puslapis. Jei jį paryškinate, galite naudoti dešiniąją sritį, kad tiesiogiai pakeistumėte kai kurias jo savybes, pvz., drobės plotį arba aukštį.

Kaip pridėti paveikslėlių

Yra keletas būdų, kaip pridėti vaizdų į savo „Adobe XD“ projektą.

  • Pirmoji parinktis yra spustelėti mėsainis meniu piktogramą kairiojo stulpelio viršuje. Spustelėkite Importuotiir atidarykite failą, kurį norite pridėti.
  • Kita galimybė – failų naršyklėje pereiti prie savo vaizdo ir nuvilkti failą tiesiai į „Adobe XD“.
  • Trečia galimybė yra nukopijuoti ir įklijuoti vaizdą, jei jis atidarytas kitoje programinėje įrangoje, pvz., „Microsoft Word“.

Kaip pakeisti vaizdo dydį ir vietą

Galite pakeisti padėtį ir pakeisti vaizdo dydį arba tiesiai ant drobės, arba keičiant jos savybes.

  1. Paryškinkite vaizdą. Kai paryškinsite dizaino elementą drobėje, dešinėje pusėje galėsite matyti jo savybes.
  2. Pakeiskite vaizdo plotį ir aukštį. Jas atstovauja W ir H laukai.
  3. Taip pat galite pakeisti X ir Y koordinates, kur prasideda viršutinis kairysis vaizdo kampelis.
  4. Norėdami perkelti vaizdą, spustelėkite ir vilkite vaizdą ant drobės.
  5. Norėdami pakeisti dydį, vilkite taškus, esančius vaizdo kraštuose.

Kaip sureguliuoti vaizdo kraštus

Galite pakoreguoti vaizdo kampus, kad pakeistumėte jo formą.

  1. Paryškinkite vaizdą.
  2. Pamatysite kai kuriuos taškus, esančius aplink paveikslėlį. Be to, vaizdo kampuose yra keletas taškų.
  3. Spustelėkite ir vilkite tašką, esantį vaizdo viduje. Tai pamažu pakeis vaizdą į kitą formą.

Kaip pridėti kitų efektų prie vaizdo

Galite toliau manipuliuoti vaizdu pridėdami efektus. Tai apima neskaidrumą, kraštines, suliejimo efektus ir kt.

  1. Paryškinkite vaizdą ir pakeiskite Otempas dešiniojoje srityje.
  2. Vis dar būdami dešiniojoje srityje pakeiskite spalvą Bįsakymas. Čia taip pat galite pakeisti storio, brūkšninis stilius, ir kampinis stilius sienos.
  3. Pridėkite vaizdo suliejimo efektą ir pakeiskite Objekto suliejimo kiekis padidinti arba sumažinti suliejimo intensyvumą.

Kaip pridėti figūrų

„Adobe XD“ galite pridėti figūrų kairiojoje srityje.

  1. Kairiojoje srityje galite pasirinkti sukurti kelias pagrindines formas, įskaitant stačiakampį, apskritimą, trikampį ir liniją. Pasirinkite formą, kurią norite piešti.
  2. Spustelėkite bet kurį drobės tašką ir vilkite žymeklį, kad pradėtumėte kurti figūrą.

Kaip pridėti pasirinktines figūras

Norėdami sukurti savo formą, galite naudoti tinkintą formos įrankį.

  1. Kairiojoje srityje pasirinkite rašiklis piktogramą.
  2. Spustelėkite bet kurią drobės vietą, kad pridėtumėte pirmąjį formos tašką arba „kampą“. Kiekviename formos taške spustelėkite drobę toje srityje, kurioje norite, kad ji būtų.
  3. Kai baigsite kurti figūrą, paspauskite Esc klavišą klaviatūroje.

Kaip pakeisti figūros spalvą

Formos spalvą galite pakeisti naudodami dešiniąją sritį.

  1. Paryškinkite formą.
  2. Dešinėje srityje pakeiskite Fnesveikas.
  3. Be to, taip pat galite pridėti kraštinių, suliejimo efektų ir keisti formos neskaidrumą taip pat, kaip ir vaizdai.

Kaip pridėti tekstą

Tu taip pat gali pridėti ir redaguoti tekstą taip pat, kaip pridedate figūras.

  1. Spustelėkite ant Tekstas piktogramą kairiojoje srityje.
  2. Spustelėkite bet kurią drobės vietą, kad pridėtumėte naują teksto laukelį. Į teksto laukelį įveskite norimą tekstą.
  3. Norėdami redaguoti, naudokite dešiniąją sritį dydis, šrifto šeima, ir lygiavimas laukai.

Kaip sukurti komponentus

Komponentas yra dizaino elementų grupė, kurią galima naudoti pakartotinai. Norėdami sukurti ir naudoti komponentą, pirmiausia turite turėti formų ar kitų dizaino objektų grupę.

  1. Pažymėkite formų grupę drobėje. Dešiniuoju pelės mygtuku spustelėkite grupę ir pasirinkite Padaryti komponentą.
  2. Kairiosios srities apačioje spustelėkite Turtas. Bus atidarytas naujas meniu, kuriame bus išvardyti visi jūsų turimi ištekliai, įskaitant ką tik pridėtą komponentą.
  3. Spustelėkite ir vilkite komponentą iš komponentų sąrašo į drobę. Taip bus sukurta lygiai tokia pati elementų grupė.

Kaip eksportuoti prekes

Galite eksportuoti atskirus elementus ir visą puslapį.

  1. Jei norite eksportuoti vieną elementą, pažymėkite norimą eksportuoti elementą.
  2. Spustelėkite ant mėsainis meniu piktogramą kairiojo stulpelio viršuje.
  3. Pasirinkite Eksportuoti, tada spustelėkite Pasirinkta.
  4. Jei norite eksportuoti visą puslapį (arba visus puslapius), pasirinkite Visos dailės lentos vietoj to.
  5. Galite nurodyti failo formatą (PNG, JPG, SVG arba PDF), kam bus skirtas eksportuotas elementas (pvz., žiniatinkliui ar iOS) ir kur norite išsaugoti failą.

Įgykite Adobe XD įgūdžių

Tai tik pagrindiniai dalykai. Kai kurios kitos funkcijos apima galimybę pridėti hipersaitų, simbolių, programų integracijų ir vartotojo sąsajos rinkinių. „Adobe XD“ taip pat retkarčiais pateikia naujų funkcijų, padedančių pagerinti ir supaprastinti maketų ir tinkintų vartotojo sąsajos dizainų kūrimą.

Internete yra keletas kursų, kurie padės pakelti naujus dizaino įgūdžius į kitą lygį.

Šie „Adobe“ kursai pavers jus kūrybišku debesų meistru

Skaitykite toliau

DalintisTviteryjeDalintisEl. paštas

Susijusios temos

  • Kūrybiškas
  • Adobe
  • Grafinis dizainas

Apie autorių

Sharlene von Drehnen (12 straipsnių paskelbta)

Sharlene yra MUO technologijų rašytoja ir visą darbo dieną dirba programinės įrangos kūrimo srityje. Ji turi IT bakalauro laipsnį ir ankstesnę patirtį kokybės užtikrinimo ir universitetų kuravimo srityse. Sharlene mėgsta žaisti ir groti pianinu.

Daugiau iš Sharlene Von Drehnen

Prenumeruokite mūsų naujienlaiškį

Prisijunkite prie mūsų naujienlaiškio, kad gautumėte techninių patarimų, apžvalgų, nemokamų el. knygų ir išskirtinių pasiūlymų!

Norėdami užsiprenumeruoti, spustelėkite čia