Hvordan lage en Cloud-ikon i Adobe XD

Hva du skal skape

Med cloud computing i økende grad, vil et enkelt "cloud" ikon alltid komme til nytte. Lær hvordan du lager en i denne videoen fra kurset mitt, ikondesign med Adobe XD.

Hvordan lage en Cloud-ikon i Adobe XD

 

Opprett de grunnleggende formene for Cloud

For å starte, sett opp en 60 x 60 px artboard, og velg det og slå på Nett i verktøylinjen til høyre. Gitteret er satt til 1, så hver eneste piksel vil det være en horisontal og vertikal retningslinje.

Velg Ellipseverktøy og bare venstre-klikk og hold Skifte å tegne en ganske liten sirkel. Så gå til Rediger> Kopier, flytt kopien opp og til høyre, og hold Skifte og oppskalere det.

Dra over dem begge og avmarker fyllingen. Og velg deretter den mindre sirkelen, og gå til Rediger> Kopier en gang til. Holde Skifte og venstre-klikk og dra den til høyre slik at den forblir perfekt i kø. 

Så gå til Rediger> Kopier en gang til. Gjør denne nye sirkelen litt større ved å holde Skifte, venstre-klikk og skalering fra et av hjørnene. 

Velg nå Rektangelverktøy og tegne et horisontalt rektangel. Dra deretter over alt og gå til Objekt> Juster til pikselrutenett. Det hjelper bare med at alt snaps på plass og retter seg på bunnen spesielt.

Dra dette rektangelet ut litt, og dobbeltklikk deretter på formen og velg de to øverste hjørner og dra dem inn hvis de strekker seg utenfor skyikonet. 

Opprett en enkelt skyform og juster den

Nå ser dette ut som et rot av forskjellige former for øyeblikket. Men i Adobe XD kan vi kombinere flere former i en enkelt form. 

Bare dra over alt, og fra alternativene på toppen av Eiendomsinspektør, å velge Legg til, og det vil kombinere alle former sammen til en form. 

Du kan se at i bunnen har vi litt av en anomali. Men det er greit, bare zoome inn, dobbeltklikk, og prøv å justere den banen litt. Bare å flytte den sirkelen litt vil bidra til å jevne ut kurven. 

Dra deretter over alt og gi det en Grense av 2. Og fra fargeplukkeren, velg fargen # 4A4A4A, og avmarker fyllingen. Skal opp det litt, holder Alt-Shift og skalering fra senteret.

Igjen, gå til Objekt> Juster til pikselrutenett hvis du trenger det. Du kan se det blander det litt, så du må kanskje justere noen av figurene igjen, som vi gjorde før. 

Legg til det endelige detaljet

Det siste vi skal gjøre er å legge til en liten kurve, bare for å gi skyen litt mer detaljert.

Velg Pennverktøy og bare venstre-klikk, venstre-klikk igjen for å lage en kurve, og trykk Flukt å fullføre den. Velg deretter det samme # 4A4A4A fargepulver fra fargeplukkeren. Og det siste vi kan gjøre er å dra over alt og gå til Objekt> Gruppe slik at vi kan flytte den rundt som ett objekt.

Du ser at vår sky er noen gang så liten av pikselruten. Så du kan bare dra over alt, og gå til Objekt> Gruppe å gruppere alt sammen. Og så gå over til verktøylinjen og juster y-verdien slik at i stedet for å være 15,5, rundes den ned til 15. Og du ser det nå justerer til pikselruten pent.

Se hele kurset

I hele kurset, Icon Design Med Adobe XD, lærer du hvordan du bruker verktøyene som er tilgjengelige i Adobe XD, for å designe en rekke forskjellige ikoner. I tillegg til skyen lærer du å lage en telefon, nettleser, blyantikon og mer, og henter noen nyttige Adobe XD-ferdigheter underveis.

Du kan ta dette kurset med en gang med et abonnement på Envato Elements. For en enkelt månedlig avgift får du tilgang ikke bare til dette kurset, men også til vårt voksende bibliotek med over 1000 videokurser og bransjeledende e-bøker på Envato Tuts+. 

I tillegg får du ubegrensede nedlastinger fra det store Envato Elements-biblioteket med 440 000 + kreative eiendeler. Lag med unike skrifttyper, bilder, grafikk og maler, og lever bedre bedre prosjekter raskere.