Bruk Skala Preview til Beam Bilder fra Photoshop til iOS

Når du designer for iOS-enheter, kan det være tungvint å hele tiden overføre skjermbilder til enheten. Skriv inn Skala Preview, en super enkel å bruke applikasjon for å sende designene til mobile enheter. I denne opplæringen begynner vi med Skala Preview, en app designet for å sende skjermbilder fra Photoshop til din iOS-enhet.


Hvorfor det er nyttig

Design for iOS er radikalt annerledes enn å designe for datamaskiner. Når du designer for disse enhetene, er det avgjørende å teste designene dine på mobile enheter for å sikre at brukerne finner grensesnittet enkelt å bruke. Min forrige metode for å prøve dette var å lagre bilder i Dropbox og deretter laste dem opp i iPhone-appen. Selv om dette virket bra, tok det for mange skritt og var ikke en effektiv arbeidsflyt.


Ved å bruke Skala Preview kan skjermbilder automatisk sendes fra Photoshop til iOS-enheter. Dette gjør utformingen for iOS mye mer strømlinjeformet.

Skala Preview for Mac og iOS er en fin måte å automatisere denne prosessen. Ved å sette opp Mac- og IOS-applikasjonene, kan du automatisk sende Photoshop-lerretet ditt til IOS-enheten din i sanntid. Dette er virkelig en flott arbeidsflyt for mobile designere som ønsker å visualisere sine design på ekte enheter.

Testing på iOS-enheter er viktig for alle typer mobildesign. Ved å designe for iOS-enheter kan testing av live hjelpe deg med å visualisere hvordan dine mock-ups vil vises på ekte enheter. Farger kan variere i henhold til skjermtype, og du har også et mye bedre inntrykk av størrelsen på elementene. Å utforme strengt innen Photoshop uten å teste på enheter, sikrer at du må gjøre en rekke tilpasninger senere.


Installere Skala Preview

For å bruke Skala Preview må du installere både Mac-programmet og iOS-appen. For å installere Mac-programmet, besøk Bjango nettsted for å hoppe til App Store-siden for Skala Preview, eller søk fra App Store.

Etter å ha kjørt installasjonen, start Skala Preview Mac-programmet. Første gang du kjører programmet, blir du møtt med en sprutskjerm med korte instruksjoner om å komme i gang. Gå videre og lukk det, da vi skal dekke hele installasjonen i denne opplæringen.

Gå videre og åpne Photoshop også. For å komme i gang med å sette opp Photoshop, velg Rediger> Eksterne tilkoblingerDu får se en boks dukker opp som gjør det mulig for eksterne tilkoblinger. Velg et hvilket som helst navn og et passord for den eksterne tjenesten, og kontroller at Aktiver eksterne tilkoblinger boksen er merket og trykk ok.


For å konfigurere Photoshop-ekstern tilkobling i Photoshop, velg et hvilket som helst navn og passord, og kontroller at boksen er merket under den.

Gå nå tilbake til Skala Preview-appen på din Mac. Velge Innstillinger> Photoshop-innstillingerog skriv inn de samme detaljene du opprettet ovenfor i Photoshop. Alt som er igjen er å sette opp iOS-appen.


Etter at du har konfigurert Photoshop til ekstern tilkobling, går du tilbake til Skala Preview-appen på din Mac og velger Innstillinger> Photoshop-innstillinger å angi de samme detaljene du valgte i Photoshop.

Oppsett på iOS

Enten du har en iPad eller iPhone, er "Skala View" -appen bygget for å motta skjermbilder fra din Mac. Gå videre og installer "Skala View" -appen fra App Store, og start den.

Når du har startet iOS-appen, klikker du på skjermikonet nederst til venstre og velger navnet på din Mac. Pass på at enhetene dine er på samme Wi-Fi-nettverk, og du bør kunne koble til Macen som kjører Skala Preview, enkelt.


For å koble til Mac-en din, sørg for å klikke på skjermikonet helt til høyre og velg navnet på Mac-en din. Det er viktig at begge enhetene er på samme Wi-Fi-tilkobling
På din Mac vil Skala be deg om å godta tilkoblingen.

Når du har godkjent iOS-enhetens tilkobling på din Mac, er alle oppsettstrinnene nå ferdige. Vær oppmerksom på at det også finnes en iPad-app som fungerer identisk med iPhone-appen som brukes i denne opplæringen.


Bruke Skala

Når du har fullført oppsettstrinnene ovenfor, bruker Skala en bris. Appen sender automatisk oppdatert design fra din aktive Photoshop-kategori eller -vindu til iOS-enheten. Etter min erfaring er det bare et lite lag i å sende oppdaterte skjermbilder til iOS-enheten.

Når du åpner Skala View, kan bildet som sendes fra Photoshop, være for stort til å vises på skjermen. Hvis dette er tilfelle, har du alle de vanlige iOS-fotonavigasjonskonvensjonene som klemmer for å zoome eller sveipe for å bevege seg rundt utsikten.

Bunnen av skjermen har også en rekke interessante alternativer for å endre hvordan bildet vises. Du kan justere lysstyrken på skjermen, og også velge mellom en rekke delingsalternativer. Ved å klikke på pilen på verktøylinjen har du også muligheten til å eksportere bilder til kamerabiblioteket, eller dele via e-post eller tweet.


En av mine favorittfunksjoner i iOS-appen er muligheten til å simulere skjermen under forskjellige fargeforhold. Disse alternativene lar deg simulere visningen av de med fargebegrensninger, inkludert ulike typer fargeblindhet.

Å klikke på brillikonet har noen gode muligheter for å simulere de forskjellige typer fargeblindhet. Kjører gjennom skjermbildene dine med dette, hjelper deg med å visualisere grensesnittet for de med synshemming, og det er en fin måte å sikre tilgjengelighet på.


Ved å holde mine mobile enheter rundt MacBook-maskinen mens jeg designer, hjelper jeg meg til å sikre at mine mobile design ser bra ut uten flere timer med revisjoner. Skala Preview er det beste verktøyet jeg har funnet for dette.

Et alternativ er å bare slippe bilder i Skala Preview Mac app vinduet. Med dette oppsettet er Photoshop ikke engang nødvendig for å se mobildesignene dine live på en iOS-klient.


Wrapping Up

I denne veiledningen viste jeg deg hvordan du automatiserer prosessen med å sende Photoshop-dokumenter til iOS. Enten du dobler med iOS-appdesign eller testing av mobile nettsteder, bruker en app som Skala en stor hjelp til design arbeidsflyten. Kraften til automatisk å sende oppdaterte skjermbilder av utviklingen din, kan hjelpe deg med å visualisere designet ditt på mobile enheter.