Tegneflater i Adobe XD: Opprettelse og tilpasning

Oppretting av tegneflater i Adobe XD er det første steget i utviklingen av designene dine. Enten det gjelder responsive nettsider, apper eller prototyper – en smart arrangement av tegneflater er avgjørende for arbeidsflyten. I denne guiden vil du lære hvordan du oppretter og optimaliserer tegneflater for forskjellige oppløsninger og enheter. Slik holder du oversikt over prosjektene dine.

Viktigste innsikter

• Tegn tegneflater for forskjellige enheter og oppløsninger.
• Gi tegneflatene og objektene dine nøye navn for å holde oversikten.
• Ta hensyn til pikseltettheten for Retina-skjermene for å maksimere bildekvaliteten.
• Bruk snarveier for en raskere og mer produktiv arbeidsmetode.

Trinn-for-trinn guide

Begynnelsen: Opprett din egen tegneflate

For å begynne å arbeide i Adobe XD, må du opprette din første tegneflate. Du finner tegneflatepanelet, som du får tilgang til via et lite ikon i den nederste linjen. Der kan du administrere alle tegneflatene du har i prosjektet ditt. Bruk nå dobbeltklikk for å gi den første tegneflaten et nytt navn, for eksempel "Hjem". Dette hjelper deg med å holde oversikt.

Oppretting av ny tegneflate

Ønsker du å legge til en ny tegneflate? Bruk snarveien "A" for Artboard-verktøyet. Når du klikker på det, opprettes en ny tegneflate. Med et nytt klikk på tegneflaten kan du også gi den et nytt navn, for eksempel "Funksjoner". Pass på at du bruker forskjellige størrelser for tegneflatene dine for å oppnå fleksibilitet i designet ditt.

Tilpasning av tegneflaten

Tegneflatene tilbyr mange tilpasningsmuligheter. Klikk på den aktuelle tegneflaten og gå til innstillingene i panelet. Du kan lett endre orienteringen fra horisontal til vertikal. Dette gjør det mulig for deg å simulere hvordan designet ditt vil se ut på forskjellige enheter som nettbrett eller smarttelefoner. Spesielt innen webdesign er det viktig å lage responsive design.

Forstørre og justere størrelsen

Nå kan du endre størrelsen på tegneflaten din. Ved å dra i håndtaket nedover, kan du se det nye området som endres tilsvarende. Over den stiplete linjen kan du se hvilke deler av siden som er synlige i den nåværende visningen. Deler som strekker seg utover må rulles.

Farge- og rutenettinnstillinger

Gå nå til fargeinnstillingene og definer de fargene du trenger. Du kan skrive inn fargekoder eller bruke glidebryteren. I tillegg kan du aktivere et rutenett for designet ditt, noe som hjelper deg med å lage layouts presist. Disse verktøyene er enormt nyttige for å strukturere designene dine og gjøre dem visuelt tiltalende.

Oppsett for forskjellige enheter

Opprett minst tre forskjellige tegneflater for de vanligste skjermformatene: Desktop, Nettbrett og Smarttelefon. Du bør sørge for at designene dine fungerer godt på alle enheter. Den vanligste desktop-oppløsningen ligger på 1366 piksler, men du kan også bruke 1920 piksler (Full HD). For nettbrettet kan du velge iPad eller Surface som mal, og deretter gå til smarttelefon-dimensjonen, som iPhone 10.

Vurdering av piksel tetthet

Et av detaljene som må tas hensyn til i designet er høyoppløselige skjermer som brukes i mange moderne enheter. Disse skjermene har høy piksel tetthet, noe som betyr at bildekvaliteten er svært viktig. Når du setter inn grafikk eller bilder fra Photoshop i prosjektet ditt, vær oppmerksom på hvilken oppløsning disse bildene har. For Retina-skjermene må du minst doble bildestørrelsen for å oppnå ideal kvalitet.

Arrangement av tegneflater

Med Adobe XD har du muligheten til å omorganisere tegneflatene dine enkelt. Dette er nyttig når du ønsker å få en bedre oversikt. Gjennom tilbakestillingstasten eller Slett kan du slette uønskede tegneflater. Alternativt kan du bruke snarveien "Command + D" for å lage en duplikat av et artboard, slik at du kan utvikle nye design basert på det.

Optimalisere arbeidsområdet

Bruk mellomromstasten for å aktivere håndverktøyet og bevege deg fritt i arbeidsområdet ditt. Dette er spesielt nyttig når du har flere elementer på artboardet ditt. Dobbeltklikk på objekter for å gå til detaljvisningen og redigere dem videre. Sørg for at alle objektene dine er klart navngitt og plassert ordentlig innenfor tegneflatene, for å gjøre det enklere å arbeide senere.

Oppsummering – Tegneflater i Adobe XD: Trinn for trinn til effektiv design

I denne guiden har du lært hvordan du oppretter og tilpasser tegneflater i Adobe XD. Du vet hvor viktig det er å navngi og tilpasse dem riktig for å holde oversikten i prosjektet ditt.