Hvad er nyt for webdesignere i Illustrator CC
Den 6. maj annoncerede Adobe sine seneste opdateringer til sin kreative software. Nogle af disse opdateringer har store konsekvenser for, hvordan brugere arbejder med deres værktøjer. I denne artikel vil jeg gerne gennemgå, hvad Adobe har ændret i Illustrator, og specifikt hvordan det påvirker webdesignere.
Selvfølgelig er der en række nye funktioner, som AutoCAD-biblioteker, hvid overprint, udfyld og strejke proxy bytte til tekst, automatisk hjørnegenerering, indikeret support, pakkefiler, uemballerede billeder, flere filer, touch-type værktøjer, gratis transformationsværktøjer og billeder i børster. Hvis du er en Illustrator-junkie, er disse alle værdifulde funktioner, men det jeg vil fokusere specifikt på er de grundlæggende forbedringer, der kan hjælpe alle med at skabe kunstværker til levering på skærmen.
HiDPI support
Med fremkomsten af skærme med høj opløsning (f.eks. Macbook Pro med retina-displayet), så Illustrator CS6 og tidligere sløret ud. Artwork og ikoner så pixelated og tekst kiggede anti-aliased. Illustratorens karakter er en skarp rig kunst, så denne oplevelse var mindre end ønskelig. Heldigvis har Adobe forbedret Illustrator CC for at udnytte disse højopløsningsskærme. Billedet vil se bedre ud, teksten vil se skarpt ud, UI-elementer (ikoner, markører osv.) Vil se glattere ud. De har også lavet nogle forbedringer af rendering processen. Det udnytter nu multi-core-maskiner og bruger gevindgengivelse til at gengive kunst. Du bør se nogle forbedringer i opgaver som zoomning, panorering, kopiering indsæt, træk og slip osv.
Guider forbedringer
Vejledninger bruges i vid udstrækning til planlægning og udlægning af sider. Oprettelse af mock-ups i Illustrator ved hjælp af guider giver dig mulighed for at placere indhold på en præcis måde. I Illustrator CC er der fire forbedringer til vejledninger:
- Dobbeltklik på en linjal skaber en vejledning på det pågældende sted på linjalen.
- Når du holder Shift og derefter dobbeltklikker på et bestemt sted på en linjal, klikker den vejledning, der er oprettet ved punktet, automatisk til det nærmeste mærke (division) på linjalen.
- Hvis du skjuler guider (Ctrl / Cmd +;) og derefter vælger at vise dem, bliver guiderne ikke automatisk låst, som de gjorde i tidligere versioner.
- Opret vandrette og lodrette vejledninger i en handling. Sådan gør du: Klik øverst til venstre i Illustrator-vinduet på skærmens kryds og tryk på Ctrl (eller Cmd på en Mac), og træk musemarkøren til et hvilket som helst sted i Illustrator-vinduet. musemarkøren bliver kryds hår for at angive, hvor en horisontal og vertikal vejledning kan oprettes; slip musemarkøren for at oprette guiderne.
Skriftsøgningsforbedringer
Den typiske søgning fremad søgning søger kun det første ord i skrifttypenavnet, som generelt ikke giver de bedste resultater med det samme. Det kan også være svært at søge og gennemse et stort antal skrifttyper. En ny søgefunktionsindstilling "Søg hele skrifttypenavn" er blevet tilføjet til kontrol- og tegnpanelerne. Desuden blev TypeKit integration til desktop skrifttyper for nylig annonceret på MAX. Det betyder, at du nemt kan designe mock-ups ved hjælp af de samme skrifttyper, du har tænkt dig at bruge på internettet.
Farvesøgningsforbedringer
At finde en bestemt farve fra en række talrige farver kan være tidskrævende og frustrerende. I Illustrator CC er der foretaget ændringer for at gøre opgaven med at søge og finde en farve meget lettere. Dialogboksen Farvevalg (dobbeltklik på Fyld proxy i værktøjslinjen) har nu en søge widget i vinduet Farveprøver. Når du klikker på farveprøver, vises en søgefelt under den foruddefinerede liste over farver. Indtast navnet på en farve eller en RGB-værdi (eller CMYK til udskrivning). Hvis du skriver 'blå', vises alle farveprøver med ordet blå i deres navn. Hvis du skriver R = 77, vises alle farveprøver med rød farve med en værdi på 77 i RGB-skalaen. Søge-widgeten er som standard aktiveret.
Søgeindstillingen i panelet Farveprøver er også blevet forbedret. Feltet håndhæver ikke en automatisk komplet. De tegn, du skriver, erstattes ikke længere automatisk automatisk med den nærmeste farvekonkurrence fundet. Du kan skrive et navn på en farve, eller blot indtaste værdierne for RGB-farve (eller CMYK for udskrivning) for at søge, om der findes en sådan farvekombination. Find feltet er ikke aktiveret som standard, og skal aktiveres for første gang fra panelets undermenu.
Det er også værd at bemærke, at Kuler er blevet bagt i Illustrator. Så hvis du bruger denne Adobe-tjeneste til at oprette farvetemaer og grupper, kan du nemt få adgang til dette indhold direkte inde i Illustrator CC.
CSS egenskaber panel
Selvfølgelig er den største funktion for internettet forbedringer af CSS og SVG-arbejdsgange. Nu, hvis du er en hardcore Illustrator-bruger, kan du have brugt noget i CS5, der hedder HTML5-pakken, som var tilgængelig fra AdobeLabs. Af en eller anden grund er det aldrig vist i CS6, men mange af disse funktioner er vendt tilbage med denne CC-opdatering. Disse funktioner minder om, hvad der allerede er gjort tilgængeligt for Photoshop CS6 via Creative Cloud opdateringer og funktioner, der findes i Fireworks CS6.
CSS Properties Panel er, hvordan du udtrækker CSS fra Illustrator dokumentet, og det giver flere måder at gøre. Nøglefasen i at gøre alt dette arbejde er dog ved at navngive dine lag i lagpanelet. Sikkert Illustrator kan generere CSS uden objektet har et navn inden i lagpanelet, men du åbner dig selv op til en uorganiseret og potentielt sjusket måde at generere kode på. Dette er i det væsentlige, hvordan Illustrator vil navngive de klasseregler, det skaber for dig. Den CSS, der genereres, kan have browser præfikser til Webkit, Firefox, Opera og Internet Explorer. Det kan fange CSS understøttede fremtoninger som gradienter og afrundede hjørner.
Du kan styre, hvordan CSS genereres ved at få adgang til dialogboksen CSS Eksportindstillinger. Du kan få adgang til dialogboksen ved at klikke på knappen CSS Export Options, som er den første af fire knapper nederst til højre på panelet. Panelet giver flere funktioner til CSS-arbejdsgange:
- Se CSS for en valgt objekt
- Kopier CSS kode for en valgt objekt
- Eksporter valgte objekt til en CSS-fil sammen med billeder, der bruges i CSS
- Eksporter CSS-kode til alle objekter i dokumentet til en CSS-fil
Derudover kan du eksportere CSS-koden til alle objekter i dokumentet ved at gå til menuen Filer og vælge Eksporter. Det åbner en dialogboks, og derfra kan du vælge CSS fra formatmenuen.
Hvis du har et objekt, skal du markere det og sørge for, at det er angivet korrekt i panelet Lag. Med det valgte vil du se CSS, der er nødvendigt for at generere illustrationen i en browser i CSS Properties Panel.
SVG kode
I tidligere versioner af Illustrator skal du gemme et dokument som SVG. Her i CC-opdateringen har du evnen til at kopiere noget i dokumentet, så gå til dit foretrukne HTML-editor og simpelthen udføre en pasta Alle SVG-koder placeres i dokumentet. Det er en overraskende flot arbejdsgang. Hvis det ikke skærer det for dig, er den mere traditionelle metode til at gemme dokumentet som en SVG stadig til rådighed.
Derudover har Adobe tilføjet support til eksport af ubrugte stilarter. Når du designer, skaber du ofte gange flere grafiske stilarter, mens du laver illustrationer. Du må ikke bruge alle tilgængelige stilarter. Når du eksporterer illustrationer i SVG-format, udføres ikke ubrugte stilarter. Også i den eksporterede CSS-kode har grafiske stilarter ikke navne, der er forbundet med dem, og det kan være svært at identificere den rigtige grafiske stil.
Illustrator CC tilbyder to funktioner, der er blevet tilføjet for at forbedre oplevelsen af at arbejde med stilarter i SVG-format, der løser disse problemer:
- Grafisk stilnavn. Når du vælger at eksportere grafiske stilarter, eksporteres navnet på hver stil med definitionen af stilen i CSS-nomenklaturen.
- Udfør ubrugte stilarter. Når du eksporterer illustrationer i SVG-format, kan du nu vælge at eksportere ubrugte stilarter. Dette tillader en anden designer eller udvikler, der importerer stilarterne til at bruge de ubrugte grafiske stilarter i andre kunstværker.
Hvordan skal du bruge det
Dette er bestemt ikke et værktøj til at kode fuldstændige websider. Hvad jeg ser bruger Illustrator til at oprette mock-ups, så håndkode strukturen i HTML og layoutkoden i CSS. Når der er behov for en dråbe skygge, gradient, mønster eller endog logo, vil disse nye CSS-ekstraktioner og SVG-muligheder komme meget praktisk og være en stor tidsbesparende.
Hvis du er interesseret i at lære mere om de nye funktioner i Illustrator CC, besøg Illustrators produktside.
Er du en Illustrator aficionado? Hvilke funktioner i Illustrator CC er du mest begejstret for? Lad os vide i kommentarerne.