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.
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.
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.
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 tilkoblinger. Du 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.
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.
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.
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.
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.
Å 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å.
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.
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.