Adobe Photoshop CS6: Forbedringer for Web og UI Designers
Photoshop CS6 har blitt hyllet som en stor forbedring for web og UI designere. Jeg kommer til å dele med deg noen av de funksjonene som Photoshop CS6 Beta har å tilby og vise hvordan de kan hjelpe deg i din web eller UI design arbeidsflyt.
Innledning
Da jeg våknet den 26. Mars 2012, det var som en hvilken som helst annen vanlig mandag morgen. Jeg var fortsatt i halvsøvne og restituerte fra min helg bakrus. Så, som vanlig, sjekket jeg Twitter og det er da jeg la merke til en skinnende liten tweet som snart løftet meg fra min dazy dis. Det fortalte meg at Adobe hadde sluppet Photoshop CS6 Beta.
Photoshop CS6 er nå tilgjengelig i beta som en gratis nedlasting. Sjekk det ut! enva.to/GO7Wt7
– envatopsd (envatopsd) 22 mars 2012
Nå er jeg sikker på at jeg ikke var den eneste som får litt for over begeistret om dette (OK jeg skal innrømme det, jeg? m en geek). Jeg mener, jeg jobber med Photoshop dag inn og dag ut og sannsynligvis bruke mye mer tid og se mye mer av sin UI enn jeg gjør min egen familie. Jeg fikk snart å jobbe med å studere så mange av de 65 helt nye funksjoner som jeg kunne. Jeg fant fort ut at den var en av de beste oppdateringene for UI og webdesignere jeg har vært vitne til.
Det nye grensesnittet
Det har vært nesten to år siden Adobe siste sluppet en oppdatering til Photoshop og med denne oppdateringen kommer et helt nytt grensesnitt. Det er på tide Adobe viste en liten bit av kjærlighet til sin UI og jeg må si jeg er imponert. Du har muligheten til å velge mellom fire grå farger, slik at du kan stille inn kontrasten på grensesnittet som passer dine behov. Å sette disse kan du finne dem i Innstillinger> Grensesnitt.
New Borders
En av de største spørsmålene jeg har hatt lyst til å spørre Adobe i lang tid er "Hvorfor er det ikke noe alternativ å legge prikkede eller stiplede kantlinjer? ". Dette er trolig en av de mest populære teknikkene som brukes i moderne web design i øyeblikket, og inntil nå har det vært en lang, trukket ut prosess som innebærer å kutte opp linjer eller bruke '-' for å lage en serie med "sting".
Vel, Adobe har sikkert innsett dette og har innført et verktøy for å gjøre oss i stand til å lage dem med letthet og fleksibilitet.
Strokes kan legges til noen form eller bane og kommer med flere slag alternativer som fungerer på en lignende måte til slagalternativpanelet i Illustrator
Align -.. Dette gjør at du kan velge om du vil at hjerneslag å justere inne, ute eller midten av formen
< li> Caps - Dette alternativet lar deg velge om du vil at slag linje å ha squared ender som slutten på banen punktet (Butt Cap), halvsirkelformede ender (Round Cap) eller squared ender som square off forbi banen punktet (Square Cap) .
Corners - Dette gjør at du kan velge hvordan du vil at hjørnene av formen som skal vises. Alternativene her er Milter, avrundet og fas.
Avsnittsmaler
Så du har nettopp mottatt den siste motiv tilbake fra klienten. PSD inneholder ti mapper med hver mappe som inneholder en side design for nettstedet. Det er en stor fil og kunden ønsker å endre tittelen skrift på hver side, og spør om du kan også gjøre det litt større, slik at det kan bli mer lesbar. Det er en enkel nok endring, men det er en av de endringer som kan være ganske repeterende; tråling gjennom alle mappene, endre hver tittel individuelt kan ta lengre tid enn forventet.
Photoshop CS6 introduserer 'avsnittsmaler "for å ta brodden av endringer som disse. Med avsnittsstiler kan du effektivt manipulere teksten akkurat som du ville gjort i CSS ved å lage et sett med egenskaper for hver stil. Du kan sette opp 'h1-6' koder og "p" tags eller andre stiler som du kanskje ønsker. Når teksten er opprettet, kan du bare velge den stilen du ønsker fra Window> Avsnittsmaler. Dette alternativet fungerer på en lignende måte til samme alternativene i Adobe InDesign, men er perfekt for denne typen scenario.
Lorem Ipsum kommer i CS6
Det er ofte slik at den enkleste av ideer er vanligvis den mest vellykkede, og dette er absolutt til stede for en bestemt ny funksjon i Photoshop CS6. Hvor mange ganger har du måtte forlate Photoshop for å hente noen lorem ipsum dummy tekst fra andre steder på nettet? Vel nå trenger du ikke lenger å. Du kan bare lime noen lorem ipsum inn fra bunnen av den typen menyen
Dette er en flott funksjon, men min eneste snipe vil være at det ville bli enda smidigere hvis det fulgte med en pre konfigurert snarvei tastatur. - selv ved å skrive inn ordet "lorem" etterfulgt av avkastningen ville være veldig flott! Dette kan bli jobbet rundt, ved hjelp av handlinger og hurtigtaster, men likevel.
Farger Bli Hash Tag Vennlig
Hvis du utfører front end utvikling på de nettstedene du opprette så er jeg sikker på at du ' ll tilbringe mye tid flicking mellom Photoshop og valgt kode editor. Sannsynligvis ikke mer enn å få hex verdi fargereferanser. Problemet før var at hex verdien innen fargevelgeren i Photoshop tidligere ikke godtok hash symbol (#) selv.
Dette resulterte i problemer når du prøver å matche fargene fra nettet, og vil ofte resultere i gjentatte reiser mellom nett inspektør, din kode editor og Photoshop. I CS6 Photoshop spiller pent og aksepterer hash tag enten det er matet inn, eller hvis ikke. Et annet lite tidsbesparende som gjør hele forskjellen.
Nytt dokument Presets for felles enheter (iPhone, iPad Etc)
Det var bare et spørsmål om tid før Photoshop innført lerret forhåndsinnstillinger for vanlige enheter slike som iPhone. Dette er en flott liten funksjon som bare sparer oss som litt ekstra tid. Etter min mening, å være en vellykket UI eller webdesigner handler om å skape en god arbeidsflyt og jo mer tid sparere som du har jo raskere kan du få jobben gjort.
En annen stor tips er å lage en handling som åpner et nytt dokument med dine valgte enhetene UI eiendeler allerede i. For eksempel har jeg laget en handling for iPhone, iPad og Android som automatisk oppretter et dokument og bringer inn elementer som menylinjen og vanlige kontrollene samt retningslinjer og rutenett oppsett for det. Dette tar CS6 nye dokumentet forhåndsinnstilt funksjon som ett skritt videre.
Shape oppretting og manipulering
I både web og UI design, former er viktig del av denne prosessen. Vi bruker dem for bannere, bokser, innganger form og i mange andre tilfeller. Vektorfigurer har fått en stor overhaling i CS6 og brakt noen veldig velkommen endringer. La oss se på dem.
Lim Shape attributter - Ved å høyreklikke på et formlag, du er nå i stand til å kopiere en figur attributter (som farge og hjerneslag) og lim det videre til en annen form. Dette er en flott tid saver
Shapes som Layers -. Før, på å skape en form, brukte den til å dukke opp i lag panel som en solid farge. Dette er ikke lenger tilfelle min venn; du er nå i stand til å se den faktiske form i lag-panelet.
Hiding banen. - Det er nå mulig å veksle banen til en form ved å trykke Command + shift + H /Ctrl + Shift + H. Dette gjør det mye lettere å være i stand til å se den riktige effekten når du legger lagstiler eksempel hjerneslag.
Farvel Info Panel, Hello visuell tilbakemelding! Anmeldelser
Jeg kan ikke huske hvor mange ganger at jeg har vært koding opp et design og måtte ta bilde målinger eller bilde stillinger for sprites. Jeg pleide å stole på info-panelet for å hjelpe til med dette. Ok, fortsatt eksisterer informasjonspanelet, så det er ikke nødvendigvis "farvel info panel", men du kan finne deg selv å bruke det mindre og mindre nå som visuell tilbakemelding har blitt innført i CS6.
Det kommer i form av en fin lite verktøytips som gir deg pikseldimensjoner sammen markøren når du oppretter en form eller telt. Ikke lenger har du å få lagrene til hvor informasjonspanelet er på skjermen som nå dimensjonene er alltid der ved siden av markøren. Dette er en av de funksjonene som gjør det vanskelig å tro at Photoshop tilbys aldri det før.
Layer Searching
Dette er en som jeg mest definitivt trenger. Jeg pleier ikke å rydde min PSD sin opp og organisere dem helt til slutten. Jeg er sikker på at noen vil være uenig med denne praksisen, men jeg føler at hvis jeg skulle organisere min PSD som jeg gikk sammen da dette ville forstyrre min kreative flyt. Jeg føler at jeg bør konsentrere seg om å gjøre det ser det beste den kan være, og ikke å måtte bryte av og organisere. Hvis du er som meg, eller selv om du ikke er, er jeg sikker på at du vil sette pris CS6 nye muligheten til å søke gjennom dine lag. Søket er egentlig ganske omfattende, og lar deg filtrere lag basert på følgende:
Kind - Med dette alternativet kan du filtrere dine lag basert på pikselområde, justeringslag, tekstlag formlag og smart objekt .
Name - Dette er et enkelt søk for å filtrere lag av lagnavnet
Effect -. Filtrerer vekk lag med spesifikke lagstiler søkt
Mode -. Filtrerer ut . lag som har spesifikke fargemoduser søkt
Egenskap - Filtrerer vekk lag med spesifikke attributter festet som "låst" eller "synlig"
Color -. Filtrerer ut lag som du har gruppert under en bestemt farge
Andre nyttige små forbedringer
Ytelse -.. Når du først prøve ut CS6 Beta kan du bare legge merke til at alt ser ut til å ha blitt en litt raskere og mer lydhør for dine handlinger. Dette er delvis ned til Photoshop nye grafikkmotor, Mercury. Alt som du gjør i Photoshop er nå raskere enn noen gang før
Gi nytt navn deretter fanen til neste lag. - Du kan nå endre navn på et lag, og bare tab for å gå videre til neste lag til å endre det. Awesome
Toggle Layer Styles Panel -! Når presentere min PSD til klienten eller utbygger, er det alltid hyggelig å sende et rent, ryddig PSD. Nå finnes det en enkel måte å veksle lukket alle lag stil slipp nedturer fra laget ved ganske enkelt alternativ-klikk /alt-klikke på den lille pilen som veksler de lagstiler.
Konklusjon
< p> Jeg har vært ved hjelp av Photoshop CS6 for litt over to uker, og det har satt fart min arbeidsflyt? Svaret er ja. Ikke bare har det fart ting opp, men det er gjort lite kjedelige oppgaver mye enklere og mer givende å utføre. CS6 har blitt bemerket som en av de beste forbedringer for UI og webdesignere i lang tid, og jeg må være enig. Det er flott å se at Adobe er å komme tilbake på toppen av sitt spill med denne nye utgivelsen, og jeg ser frem til å se om det er noen flere fine små tilføyelser når vi ser hele utgivelsen.
Og slutt. ..
Last den ned nå og prøve det ut selv!
Adobe Photoshop CS6 Beta
Full listen over funksjoner (pdf)
Innledning til Photoshop CS6 Session over på PSDTUTS +
Tror du det er fortsatt noen funksjoner som Photoshop vil dra nytte av at det ennå ikke er iverksatt? Jeg vil gjerne høre dine tanker om dette! Anmeldelser