Millistel eesmärkidel on programme vaja?
Enne programmide kasutamist veebisaidi paigutuse jaoks peate need jagama mitmesse kategooriasse.
Töö graafikaga. Esiteks peab küljendaja saama saadud küljendusega töötada. Kui ta ei saa küljendusest vajalikke osi välja lõigata, siis on edasine paigutus põhimõtteliselt võimatu.
Koodiga töötamine. Kui olete graafika välja mõelnud ja kõik vajaliku välja lõiganud, peate asuma küljendaja põhitööle - koodi kirjutamisele. Selle võimalikult kiireks ja mugavaks tegemiseks peate kasutama vastavat tarkvara.
Töö kontrollimine. Kui olete põhitöö juba teinud, peate selle tulemust kontrollima. Reeglina võite kirjutamise käigus teha palju vigu, eriti kui teil pole palju kogemusi. Samuti esitatakse valmis paigutusele tavaliselt erinevad nõuded. Kontrollid aitavad seda nende nõuetega kohandada.
Paigutusega töötamiseks
Küljendaja peab meeles pidama vajadust küljendusega töötada. Selle jaoks on PhotoShop, kuigi saate tasuta alternatiivina kasutada GIMP-i. Mõlemad sobivad, kuigi Photoshop on muidugi veidi mugavam.
Peate mõistma, et paigutus võib sisaldada sadu kihte. Sellega ilma piduriteta töötamiseks peate töötama vähem võimsa riistvaraga. Palju sõltub paigutusest endast. Mida vähem kihte ja elemente, seda väiksem on faili suurus, seda kiiremini seda töödeldakse.
Tegelik paigutus
Paigutusega on kõik väga selge, kuid milline tarkvara võib paigutuse jaoks kasulik olla? Võib-olla vajate veebisaidi paigutuse programmi, mis kasutab ainult html-i ja css-i. Sel juhul saate valida midagi lihtsamat. Mida keerulisem on töö, seda funktsionaalsemat lahendust tasub kasutada.
Märkmik. Koodi redigeerimiseks on kõige lihtsam asi. Funktsionaalsus puudub. Millistel juhtudel peate seda kasutama? Oletame, et peate sõbrale mõnda koodijuppi näitama, kuid tema arvutis pole sobivat programmi. Märkmik ei sobi toimetamiseks, veel vähem koodi kirjutamiseks.
Riis. 1. Notepadil puudub süntaksi esiletõstmine, seega ei sobi see koodiga töötamiseks.
Notepad++. Kuid see on palju arenenum tööriist. Seda nimetatakse sageli programmeerija märkmikuks. See toetab süntaksi esiletõstmist, mitut keelt ja kodeeringut. Koodi kirjutamine on lihtne, mugav, võimalik on ühendada pluginaid ja töötada korraga suure hulga failidega. Sõltuvalt teie keeleoskusest saate tööriistavihjeid lubada või keelata. Kogenud kodeerijad lülitavad need tavaliselt välja, kuna need segavad ainult koodi kirjutamist.
Riis. 2. Notepad++ on suurepärase süntaksi esiletõstmisega. Sildid, atribuudid, atribuutide väärtused ja lihttekst tõstetakse esile erinevalt.
Adobe DreamViewer. Võimsam programm, mis sisaldab mitte ainult redaktorit, vaid ka tööriistu lehtede ja elementide täiesti visuaalseks loomiseks. Peate õppima sellega töötama, kuna see on üsna keeruline. Peab ütlema, et iga visuaalne redaktor lisab palju mittevajalikku koodi.
See kehtib ka Dreamvieweri puhul, kuid siin tuleb kiiruse eest maksta. Programm sobib professionaalidele, kui neil on vaja kiiresti hankida koodilehed, et seda kliendile näidata.
SublimeTekst. Väga sarnane Notepad++-ga. See erineb peamiselt ainult liidese ja erinevate pistikprogrammide poolest, mida saab ühendada.
Esilehekülg. Teine Microsofti programm. Samuti võimaldab see töötada piltide, videote ja JavaScriptiga.
Jällegi sõltub valik sellest, kas vajate visuaalset komponenti või kavatsete ise rohkem koodi kirjutada.
Statistika näitab, et enamik arendajaid kasutab Sublime'i ja Notepad++. Need on veebisaidi paigutuse jaoks parimad programmid. Aga need sobivad sulle, kui sa koodi juba tead ja tegelikult abi ei vaja. Siis annavad need toimetajad teile rohkem vabadust.
Võite valida ka UltraEdit. Kuigi programm pole eriti populaarne, avab see suuri faile üsna kiiresti ja on mugav ka koodi sisse kirjutada.
Paljud inimesed kiidavad ka NetBeansi. See arenduskeskkond sobib hästi veebiskriptide ja skriptide kirjutamiseks. Soovitatav algajatele programmeerijatele.
Moodsam tarkvara sisaldab Vim tekstiredaktorit. Funktsionaalsuse poolest peetakse seda üheks võimsaimaks. Näiteks saate ühes aknas töötada paljude failidega, võrrelda kahte faili ja seejärel kiiresti muudatusi teha. Teine funktsioon on piiramatu võimalus mõnda oma tegevust tühistada ja uuesti teha.
Paigutuse kontroll
Tavalised koodiredaktorid sisaldavad reeglina juba tööriistu kirjutatu kontrollimiseks. Näiteks võimaldab koodi esiletõstmine hõlpsasti tuvastada juhuslikke kirjavigu ja väiksemaid vigu (sulgemata silt, täiendav semikoolon jne).
Kuid paigutuse kontrollimine ei puuduta ainult seda. Täielikuma testimise jaoks peate kasutama muid programme. Näiteks seesama silur. Olen seda juba mitu korda maininud. Esiteks on see võimalus probleem kiiresti leida ja see lahendada. Kuna saate siluris kõik stiilid keelata, saate kiiresti leida stiili, mida saab kasutada meediumireeglite toimimise testimiseks, kui rakendate ka reageerimisvõimet.
Sellest ei pruugi ka piisata. Kui mall peaks enamikes populaarsetes brauserites samasugune välja nägema, peate kontrollima paigutust brauseritevahelise ühilduvuse osas. Selleks on mitu võrguteenust. Üks populaarsemaid on crossbrowsertesting.com/. Teatud saidi funktsioonid on saadaval ainult raha eest. Teenus on populaarsust kogunud tänu võimalusele kontrollida saiti enam kui sajas erinevate brauserite versioonis.
Riis. 3. Crossbrowsertesting on üks ressurssidest, mis pakub brauseriülest testimist sadades brauseri versioonides.
Siiski võib osutuda vajalikuks kohandada paigutust brauserite vanemate versioonide jaoks. Nagu teate, on Internet Exploreriga alati kõige rohkem probleeme tekkinud. Kirjutasin varem IE Testerist, programmist, mille abil saate tasuta kontrollida, kuidas sait selle brauseri vanemates versioonides välja näeb. Selleks sobib ka NetRederender. See võimaldab teil näha saidi välimust IE versioonides 5.5 kuni 9.
Järeldus
Veebisaidi paigutus võib nõuda üsna palju teenuseid ja programme. Minimaalne konfiguratsioon sisaldab programmi graafikaga töötamiseks, 1 koodiredaktorit ja 2-3 teenust paigutuse kontrollimiseks. Olen näinud inimesi, kellel on palju suurem tööriistakomplekt. Kõik sõltub teie tegevuse keerukusest veebiarendajana. See on tänaseks kõik. Liituge meie ajaveebiga, kui soovite veebisaidi loomise kohta kõike teada.
QuarkXPress on programm, mis on mõeldud erinevate trükitoodete – ajalehed, ajakirjad, brošüürid, kataloogid jne – küljendamiseks. QuarkXPress võimaldab teil luua mitte ainult paberpaigutusi, vaid ka e-raamatute, veebisaitide ja interaktiivsete rakenduste (Flash) kujundusi. QuarkXPressil on 25 turulolekuaasta jooksul õnnestunud kogu maailmas disainerite ja küljendajate seas lugupidamine võita – programm toetab rahvusvahelisi värvistandardeid ja suudab võimalikud probleemid automaatselt tuvastada juba pressieelses etapis. Rakendus toetab pukseerimis- ja kiirklahve, võimaldab töötada läbipaistvuse ja efektidega (vihkvari jne), hallata kihte, joondada paigutusel graafilisi elemente, peenhäälestada tekstiparameetreid (süvendamine, jälgimine, sidekriipsud jne). . QuarkXPress toetab Unicode'i ja OpenType'i fonte, suudab importida tabeleid ja teksti Wordi ja Exceli dokumentidest ning importida graafikat PSD-, EPS-, GIF-, JPG-, PDF-, PNG-, PostScript- ja TIFF-vormingus. QuarkXPress suudab automaatselt värskendada paigutustes kasutatavaid elemente (tekstid, pildid), võimaldab rakendada stiile ja automaatselt jälgida projekti spetsifikatsioonide järgimist.
Peamised omadused ja funktsioonid
- lai valik tööriistu küljenduste, tekstide ja graafikaga töötamiseks;
- automaatne kontroll projekti spetsifikatsioonidele vastavuse üle;
- võimalike probleemide automaatne tuvastamine trükieelses etapis;
- mitme graafilise vormingu tugi;
- importida andmeid Excelist ja Wordist;
- e-raamatute, veebisaitide ja veebirakenduste disaini arendamise oskus.
Iga päevaga ilmub Internetti üha rohkem programme, mida disaineritel kasutada pakutakse. Nende hulgas on eriti palju ülesannete planeerijaid, mõttekaartide loomise tööriistu ja muid moodsaid funktsioone, mis ilmuvad peaaegu iga päev, küsivad uskumatult raha ja surevad siis ahnusest loomulikku surma.
Olen selliste uute toodete suhtes alati väga skeptiline ja ootan mõnda aega nende loomulikku valikut ja surma, enne kui torman uut teenust õppima. See võib olla tõeline peavalu, eriti kui te alles alustate ega mõista veel täielikult, miks teil seda või teist programmi vaja on.
Tegelikult pole nende programmide ja teenuste loend, mida ma veebidisaini, graafilise disaini ja ülesannete koordineerimiseks kasutan, kuigi pikk ja iga üksus on kindlasti ajaproovile vastu pidanud.
10 parimat veebi- ja graafilise disaineri programmi:
1. Adobe Photoshop
Kuigi veebidisaini loomisel pole see kaugeltki esimene, mis avaneb, olgu see aga esimene ese kui kõige populaarsem. Photoshopi on jumal teab kaua liidesteks kasutatud, olen seda kasutanud vähemalt 10 aastat ja programm läheb ainult paremaks. Sellel on tohutult palju võimalusi, kuid veebidisainerid kasutavad seda liideste joonistamiseks, rastergraafika loomiseks ja fotode töötlemiseks. Graafilised disainerid teenivad ligikaudu samu eesmärke.
P.S. Olen juba mitu aastat oodanud hetke, mil Photoshop asendub vektorprogrammidega. Selle esimesed konkurendid on Sketch, Adobe Illustrator ja natuke Indesign. Nendega on tõesti mugav töötada liidestega, aga häda on selles, et nende programmidega tööd oskavaid küljendajaid saab Venemaal ühe käe peal üles lugeda ja nad kõik töötavad suurtes ettevõtetes. Nii et kui olete vabakutseline ja te ei tea, kes teie paigutuse kujundab, on Photoshop siiski universaalne ja parim valik. Võib-olla paari aasta pärast see muutub.
2. Adobe Illustrator
Juba mainitud Illustrator on veebidisaini osa loomulikult juba üle võtnud. Nimelt luuakse selles kogu vektorgraafika: ikoonid, vektortekstuurid, logod, vektorillustratsioonid. Ja seejärel eksporditakse need sama programmi abil skaleeritavasse SVG veebigraafikasse.
Graafilise disaineri jaoks on illustraator programm number üks. Sest kõik logod, ettevõtte identiteedid, lihtsad trükimaterjalid, mis ei nõua lehekülje paigutust (näiteks visiitkaardid), luuakse samuti Illustratoris.
See sisaldab ka esitlusi ja juhiseid klientidele.
P.S. Muidugi pole see imerohi. Kui teil on ülesanne teha flaier ilma tekstita ja ainult fotodega, siis oleks loogilisem joonistada see Photoshopis, sest See on rastergraafika.
3. Coggle.it
Mõttekaardistamiseks sobiva tööriista otsimisel proovisin tosinat teenust. Kõige rohkem meeldis mulle muidugi mindmeister. Kuid pärast ühe kaardi loomist küsis ta minult igakuiselt üsna kallist tellimust koos tasumisega ja otsustasin, et makstes iga kuu Adobe Creative Cloudi paketi eest ja olin juba üsna aus inimene, hakkasin otsima tasuta tööriista.
Coggle ei piira kaartide arvu, neid saab teiste kasutajatega jagada, piltidena salvestada ning need näevad üsna kenad ja mugavad välja. Kuid millegipärast nõuab ta, et teie kaardid oleksid lahtised ja teoreetiliselt võiks igaüks neid vaadata.
P.S. Kui te ei tea, mis on mõttekaart, on see väga mugav ja mitmekülgne tööriist kontseptsioonide väljatöötamiseks, saidikaardi kujundamiseks ja kasutajastsenaariumide koostamiseks. See on koht, kus veebidisain tavaliselt algab. Kunagi kirjeldan seda meetodit üksikasjalikumalt.
4. InvisionApp
Väga mugav tööriist prototüüpimiseks. Loon sellega halle kujundusi ja kasutan isegi valmis küljenduste esitlemiseks. Saate mitte ainult kohe välja töötada kogu saidi struktuuri ja panna lingi, vaid korraldada ka selliseid meeldivaid pisiasju nagu kleepmenüü või teha globaalset navigeerimist. Negatiivne külg on see, et Invision on taas tasuline ja pakub ainult ühte tasuta prototüüpi. Kui te ei halda korraga 5 projekti, piisab sellest.
Marvel Appile on olemas täiesti tasuta alternatiiv, kuid selle funktsionaalsus on palju lihtsam ja prototüüpidega töötamine siiski keerulisem.
5. Pinterest
See on võrguteenus, mis on populaarne kitsastes disainerite ringkondades. Siin on väga mugav luua projektide jaoks meeleolutahvleid ja talletada viiteid. Meeleolutahvleid saab jagada, ühiselt hooldada ning sellel ressursil on ka suurepärane disainitööde andmebaas, mida mujal pole.
P.S. Moodboards ja viited on veel üks tööriist kontseptsioonide loomiseks, kuid visuaalsed. Otsige töönäiteid ja looge nendest meeleolutahvel, mis sisaldab fonte, värve, stiile, mis aitavad teil konkreetse projekti jaoks inspiratsiooni saada.
6. Evernote
Kasutan tasuta versiooni, selle võimalused on täiesti piisavad. Evernote on väga mugav lühikeste, märkmete, linkide salvestamiseks ja korraldaja hooldamiseks. See on sisuliselt sülearvuti, sünkroonitakse mitme teie seadmega, saate jagada märkmeid või märkmikke. Seal töötab palju inimesi, seega on see väga mugav ka meeskonnasuhtluseks.
7. Adobe InDesign
See on nii kaugel ainult seetõttu, et ma ei trüki eriti sageli. kuid üldiselt on see väga populaarne programm mitmeleheliste toodete küljendamiseks. Brošüürid, kataloogid, brošüürid, voldikud, raamatud. Kui soovite trükkimisega tegeleda, peate seda teadma, loomulikult koos Photoshopi ja illustraatoriga, sest... Graafika on neis endiselt joonistatud, kuid tekst on trükitud disainiga.
8. Lülita
Ajajälgija sisekasutuseks. See pole nii arenenud kui TimeDoctor, mis teeb ekraanist ekraanipilte ja saadab need kliendile iga 3 minuti järel. Kuid toggl aitab teil aega õigesti jaotada, keskenduda ja arvutada, kui palju aega sellele või teisele tööle kulutate. Töötage sellega aasta ja hindate hõlpsalt iga projekti tundide kaupa ja vastavalt sellele nimetate maksumust mitte juhuslikult, vaid mõistes, kui palju teie jõupingutusi konkreetse projekti jaoks tegelikult vaja on.
9. Trello
10. Adobe Lightroom
Harva, kuid siiski kasuta kiireks fototöötluseks. Photoshopil on muidugi kõik Lightroomi võimalused, aga kui sul on projekti jaoks sadu fotosid ja need on kõik toored, saad need kiiresti läbi Lightroomi jooksutada ja saada näiteks eskiispaigutuse jaoks väga ilusaid fotosid. .
5 parimat rakendust kliendiga suhtlemiseks:
Tunnistan ausalt, et pool disaineri tööd koosneb kliendiga suhtlemisest. Paljud konfliktid vabakutseliste ja klientide vahel tekivad normaalse suhtluse puudumise tõttu, sa said ülesandest valesti aru ja lahendasid selle valesti, enamjaolt on see isegi vabakutselise süü. Seetõttu seadistan kõik oma seadmed vahetute tõukemärguannete jaoks ja installin sõnumitoojad, mida mu kliendid kasutavad, et alati igal juhul ühendust võtta.
1. Skype
Muidugi Skype, vaatamata sellele, et viimasel ajal on ta aina kõledamaks ja labasemaks muutunud. Kuid siiani ei saa ükski programm seda asendada. Ja kõik kõned ja videokonverentsid toimuvad selle kaudu.
2.Telegramm
Usun, et telegramm sureb varsti. Aga võib-olla olen ma sellega liiga range, üsna paljud kliendid on Telegrami juba armunud ja loomulikult pidin ka mina selle installima.
3. Vkontakte, facebook
Isegi kui olete sotsiaalmeedia vihkaja, peate seda kasutama. Sest teie kliendid kasutavad neid ja mõnikord suheldakse nende kaudu. Kõige populaarsem on loomulikult Facebook, seda kasutatakse traditsiooniliselt töökontaktide ja vabade töökohtade jaoks. Kuid VKontakte'is juhtub seda aeg-ajalt, kuid juhtub ikka. Aga muide, ma kasutan VKontaktet ajakirjana, seadistades selle kasulikele gruppidele, võib olla väga mugav inspiratsiooni otsida.
4. Meiliklient
Püüan posti teel suhelda ainult ametlikus korras, st. suurklientidega, kui vajad dokumentaalset kirjavahetust ja leiad õige kirja aasta hiljem. Muidugi on ebamugav seal väikestel teemadel suhelda.
5. Viber, WhatsApp
Mul on isiklik vihkamine nende rakenduste vastu, kuid kõik on seotud rämpspostiga ja sellega, et nad ei saatnud mulle korraga paari olulist teadet. Kustutasin need ja installisin 5 korda =) Siiani pole nad mind sundinud neid tagasi panema.
Lisaprogrammid:
Samuti on väga oluline õppida midagi uut. Viis aastat tagasi poleks ühelgi veebidisaineril tulnud pähe 3D-modelleerimist õppida, et oma oskusi täiendada. Ja nüüd näeme kümneid saite, mis kasutavad 3D-d alusena ja mõnikord ka animeeritud. See on üks põhjusi, miks ma lõpetasin graafilise disaineri ja veebidisaineri töö lahutamise ning proovin uurida kõike, mis minu töös kasulik võib olla.
1. Adobe After Effect
Ma kasutan seda animatsiooni jaoks. Näiteks ikoonide animatsioonid, videod, animeeritud veebisaitide esitlused.
2.Adobe Premier
Aeg-ajalt kasutan seda monteerimiseks, sagedamini YouTube'i videod või midagi portfoolio jaoks.
3. Kino 4D
Töötan selles 3D-objektide või animatsioonivideotega. Üldiselt väga kasulik asi disainerile: selle programmiga saate väga kiiresti ja lihtsalt luua vapustavalt ilusaid asju kõige jaoks: olgu see siis veebi või ettevõtte identiteet.
Olgem siis selged: vajate oma töö kiirendamiseks tööriista. See tähendab, et te ei pea kõiki funktsioone täiuslikult valdama, peate õppima kiiresti töötama. Ükskõik millise tööriista valite, õppige põhifunktsioone ja valdage kõiki otseteid.
Õppige neid automaatselt kasutama ja alles siis liikuge edasi täpsemate funktsioonide juurde. Lihtsate veebisaitide kujundamiseks peate lihtsalt teadma, kuidas määrata fonti, joonistada lihtsaid kujundeid, töötada kihtidega, muuta värve jne.
Riis. 7.0: kujundasin oma veebisaidi mõne põhitööriista, ühe fondi ja kolme värvi abil.
Kui olete oma tööriistaga rahul, saate kiiresti katsetada erinevaid ideid (mis aitab teil saavutada paremaid tulemusi) ja lõpetada oma töö õigeaegselt (mis teeb teie kliendid ja tööandjad õnnelikumaks!).
Kui olete alles alustamas disaini õppimist või soovinud mõnele teisele tööriistale üle minna, soovitan teil katsetada mitme võimalusega ja valida endale sobivaim. Meil kõigil on oma elukogemused ja omad harjumused. Kui teile mõni programm mingil põhjusel meeldib, omandate selle tõenäoliselt palju kiiremini.
Oluline on mõista, et ühel hetkel peate võib-olla mõnele teisele tööriistale üle minema. Enamik meist on Photoshopi aastaid kasutanud, kuna turul polnud alternatiive. Viimase paari aasta jooksul on olukord kardinaalselt muutunud.
Veebikujundus ei ole ammu staatiline ja me püüame täita lünka disaini ja koodi vahel. Tõenäoliselt ilmub lähitulevikus palju uusi funktsioone ja isegi tööriistu.
Populaarsed disainiprogrammid
Disainitööriista valimisel ei mängi olulist rolli mitte ainult programmi enda kiirus ja kvaliteet, vaid ka selle populaarsus professionaalses keskkonnas. Kui kasutate sama tarkvara, on teil lihtsam töötada koos teiste disainerite ja arendajatega (näiteks suuremahulise projekti raames).
1. Sketš– 99 dollarit aastas (ainult Macis)
Joonis 7.1: Sketš Kasutan Sketchi enamiku oma praeguste projektide jaoks. Tööriist on väga kiire, intuitiivne ja üsna hõlpsasti kasutatav (vahetasin selle Photoshopist ilma probleemideta). Sketch on üks populaarsemaid disainirakendusi, nii et enamik arendajaid ja disainereid on sellega tuttavad.
Sketchis on kõik, mida vajate kujundamiseks: juhendid, ruudud, sümbolid, perspektiivi teisendus (kujunduse eelvaateks iOS-is), vektorredigeerimine, prototüüpide loomine, teegid, varade eksport, pilv (kujunduse ja teekide jagamiseks) ja isegi koodi eksport. Selle jaoks on ka palju pluginaid ja ressursse.
Sketchi suurim puudus on see, et see töötab ainult Macis. Siiski saate eksportida projekte selliste rakenduste jaoks nagu InVision Ja Zeplin arendajatele spetsifikatsioonide ja juhiste loomiseks.
2. Figma- tasuta või 12 dollarit kuus (veebirakendus)
Joonis 7.2: joonis figma Figma on suhteliselt uus disainiprogramm. See on võib-olla Sketchi suurim konkurent – ja see kasvab väga kiiresti. Figmal on kõik samad funktsioonid, mis Sketchil – lisaks saavad sama projektiga samaaegselt töötada mitu disainerit.
Kõige lahedam on see, et Figma on täiesti tasuta, kui teil on kuni kolm projekti ja kõigest 12 dollari eest kuus saate avada kõik funktsioonid ja saate luua lõpmatu arvu projekte. Rakendus töötab otse brauseris – seega peaaegu igas operatsioonisüsteemis. Kasutajaliides meenutab Sketchi ja Adobe XD-d: kui olete nende tööriistadega tuttav, ei pea te isegi midagi õppima.
See on suurepärane võimalus, kui olete algaja disainer ja soovite kätt proovida, ilma et peaksite veel kallisse tarkvarasse investeerima. Kasutasin Figmat mitmes oma projektis ja leidsin, et see on väga lihtne ja kiire.
3. Adobe XD- tasuta (Mac ja Windows)
Joonis 7.3: Adobe XD Adobe XD on veel üks tugev tegija professionaalsete disainirakenduste maailmas. Arvan, et see sobib suurepäraselt kasutajaliidese kujundamiseks, raamimiseks ja prototüüpimiseks, kuigi sellel puuduvad mõned täiustatud funktsioonid võrreldes Sketchi või Figmaga.
Eeliseks on see, et tööriist on tasuta nii Maci kui ka Windowsi jaoks (kuigi see võib olla tasuline, kui see on valmis). Lisaks on see Adobe tootesari – nii et saate jagada varasid teiste tööriistadega, nagu Photoshop või Illustrator.
Liides on väga sarnane Sketchile ja Figmale, nii et saate kasutada kolme tööriista korraga - ja nende vahel ilma probleemideta liikuda (välja arvatud see, et mõned kiirklahvid on erinevad!).
4. InVision Studio- Tasuta (beetaversioon, varase juurdepääsuga)
Joonis 7.4: InVision Studio InVision Studio on uus täispinu tööriist, mis on veel beetaversioonis, kuid tundub paljutõotav. Liides on Sketchi ja Figma koopia, millest on saanud juba tänapäevane disainitööriistade standard.
Olen InVision Studioga veidi katsetanud ja kuna mul on üldiselt teiste InVisioni toodetega häid kogemusi, siis olen kindel, et ametliku versiooni ilmumisel on poistel edu.
5. Veebivoog- tasuta või 16 dollarit kuus (veebirakendus)
Joonis 7.5: Veebivoog Webflow on täielik tööriist funktsionaalsete ja tundlike veebisaitide loomiseks, mida saab hostida otse nende platvormil (või eksportida ja mujal majutada).
Ma ei ole disaini-koodiks tööriistade fänn, sest genereeritud kood ei tööta tavaliselt kuigi hästi ja sellega on raske töötada. Webflow on aga väga hea. Teil on täielik kontroll CSS-koodi üle, lisaks näitab tööriist teile, kuidas HTML ja CSS töötavad, kuna kõik kujunduselemendid käituvad brauseris ootuspäraselt.
Arvan, et Webflow sobib suurepäraselt kiirete prototüüpide, lihtsate saitide, üheleheliste jms loomiseks. Paljud professionaalsed disainerid, keda tean, kasutavad Webflow’d – seega tasub sellega lähemalt tutvuda!
6. Adobe Photoshop– 20,99 dollarit kuus või Creative Cloudi osana (52,99 dollarit kuus)
Joonis 7.6: Adobe Photoshop Pole juhus, et panin Photoshopi nimekirja päris lõppu. Photoshop on väga populaarne veebisaitide kujundamise programm, kuid see on kaotamas võitlust Sketchi, Figma ja muude tööriistadega. Kui kasutate endiselt Photoshopi, on see hea, kuid olge valmis lähitulevikus teisele tööriistale üle minema.
Kehtivad veebiarendusstandardid sunnivad meid tegema paindlikumaid projekte, liikuma koodile lähemale ja töötama disainisüsteemi raames. Photoshop on liiga aeglane ja toodab liiga suuri faile võrreldes ülaltoodud tööriistadega.
Siiski kasutan endiselt Photoshopi fotode töötlemiseks, graafika loomiseks ja illustratsioonide redigeerimiseks.
Joonis 7.7: Sketchi, Figma ja Adobe XD liideste kiire võrdlus. Vaata, kui sarnased nad on! Muud tööriistad, mida ma tööl kasutan:
Siin on täielik nimekiri tööriistadest, mida ma oma töös kasutan.
3 häältTere tulemast minu blogisse. Täna otsustasin koostada disaineritele kasuliku valiku. Külastasin populaarsemaid veebihalduri saite ja leidsin 50 parimat tööriista, mis aitavad teil oma kujundust luua.
Esitan teie tähelepanu veebidisaini programmidele, parimatele veebiteenustele ja professionaalide poolt tunnustatud tööriistadele. Ma ei nõustu kõigi punktidega, kuid kes ma olen, et vaielda spetsialistidega, kes töötavad sellistel saitidel nagu Netoloogia , vc.ru, ütle Tere ja teised.
Olen seda nimekirja omaette veidi laiendanud ja kategooriatesse jaganud. Nüüd tutvustan seda teie tähelepanu.
Põhiprogrammid
Loomulikult ei saa ükski veebiarendaja veel hakkama ilma Adobe'i standardikomplektita, mille kaudu kogu töö toimub. Nüüd on 2016. aasta lõpp ja paljud spetsialistid väidavad, et programm muutub üha populaarsemaks Sketš , mis on juba mitu aastat tavalist Photoshopi asendanud, hakkab seda tegema. 2017. aastal õpime kõik aktiivselt seda konkreetset programmi.
Seda isegi hoolimata asjaolust, et see pole veel vene keeles ja sobib ainult Mac OS-i jaoks. Enamik spetsialiste väidab, et see sobib liidese kujundamiseks palju paremini kui Photoshop.
Kui me räägime muudest Adobe toodetest, siis on teie otsustada, kas neid uurida või mitte. Ja ometi on nad endiselt nimekirjades.
- Illustrator on parim tööriist vektorgraafikaga töötamiseks ja illustratsioonide loomiseks.
- InDesign kui printimise optimaalne utiliit.
- Adobe Muse on ideaalne platvorm loomiseks
Lisaks Adobe toodetele soovitavad professionaalid pöörata tähelepanu ka teistele kaubamärkidele ja nende toodetele. Ara on tunnistatud üheks populaarseimaks veebidisaini programmiks. Erinevalt Sketchist sobib see Windowsile ja võimaldab programmeerida koodi teadmata. See genereerib ennast automaatselt. Saate selle tasuta alla laadida otse ametlikult veebisaidilt. Tõsi ainult inglise keeles.
Creative Bloq pakub Adobe Muse'i alternatiivina teist kaasaegset teenust Männikas , sobib see iga veebisaidi joonistamiseks koos järgneva pildi automaatse teisendamisega koodiks. Sama saab saavutada Jetstrapiga.
Noh, kui teil on vaja rakendustega töötada, aitab see teid tõenäoliselt Rakenduste sihtasutus .
Graafikapank
Iga disainer vajab graafikat. Kui joonistate kõik ise, võtab see palju aega. Mõningaid elemente saab tellida kelleltki teiselt või valmis pilte osta või pankadest järele tulla. Hea disainer ei varasta kunagi, vaid laeb healt saidilt alla – miks mitte.
Näiteks edasi endlessicons.com leiate ikoone ja edasi coverr.co video kaaned.
Peal freepik.com Ja IconStore leiate palju tasuta pilte. Vektorid ja isegi PSD paigutused. Enda nimel võin pakkuda Photoshop-meister Ja Pixabay .
Stripemania.com – loob kiiresti graafikat. Lisage oma värvid ja saate triibulise pildi. Kas soovite luua oma animeeritud tausta? sujuva värviüleminekuga? See veebisait aitab teid selles. gradient-animator.com . See mitte ainult ei näita tulemust reaalajas, vaid loob ka koodi, mis tuleb ainult saidile sisestada.
Findguidelin.es see on kollektsioon, kust leiate ikoone ja kogu teabe disaineritele populaarsete kaubamärkide kohta: WatsApp, Facebook, VKontakte ja nii edasi.
Logo ja faviconi tegija
Olin üllatunud, kuid paljudel populaarsetel ja mainekatel disainerite veebisaitidel leiate lingi teenusele, mis aitab. Näiteks Netologys pakuvad nad withoomph.com või designrails.com . ma eelistan Logaster .
Kiireks loomiseks saate kasutada portaali www.favicon.cc . Muide, ma juba kirjutasin temast. Hea kraam.
Värviga töötamine
Halb disainer on see, kes ei usalda professionaalsete teenuste abi parima värvikombinatsiooni loomisel. Internetist leiate selle jaoks palju ressursse. Mulle näiteks meeldib Värviskeem .
Teenindus Materjalipalett pakub valida kaks värvi ja ta täidab teie eest ülejäänud skeemi: fondid, jaoturid ja nii edasi.
Peal 0 kuni 255 saate vaadata erinevaid toone, kuigi teil on ka vene alternatiiv - Yandex.
Kui näete ilusat pilti, saate teenust kasutada pictaculous.com eraldage sellest värviskeem. Muide, see aitab tõesti täpselt otsustada, kas kasutada oma portaalis seda või teist pilti. Kui see ei ole edukalt ühendatud põhiahelaga, on vastus ilmne.
Fontidega töötamine
Esimene ja parim ressurss Google Fontsiga töötamiseks. See on tohutu fontide kogu, sealhulgas vene keeles. Mugav valida ja lihtne kasutada.
Täiusliku fontide kombinatsiooni leidmiseks soovitavad eksperdid kasutada teenust: canva.com/font-combinations või typewolf.com .
Samuti võib see brauserilaiend olla kasulik fontface.ninja . Leidke kena font, hõljutage kursorit selle kohal ja hankige teavet. Jääb üle vaid ta üles leida.
Ja veebisaidi veebiredaktoris prototypo.io saate seda veidi muuta ja ainulaadseks muuta.
Viimane etapp
Kui projekt on valmis, peate kontrollima, kuidas kõik tavalistes brauserites arvutitest ja mobiiltelefoni ekraanilt välja näeb. Resizemybrowser.com aitab teil seda kiiresti teha.
Teenuse kasutamine dunnnk.com saate sisestada oma ekraanipildi tuhandetesse telefoni- ja arvutipiltidesse ja vaadata, kuidas teie sait erinevatel vidinatel mitme nurga alt välja näeb.
Väga kasulik nimekiri on veebisaidil webdesignerschecklist.com . Kas olete kõik õigesti teinud, kas projekti on võimalik esitada? Lihtsalt märkige ruudud ja veenduge, et te pole midagi unustanud. Kahju, aga teenus sobib ainult neile, kes räägivad inglise keelt.
Kui lisaks disainile teete ka küljendust, saate koodi sisse ehitada utiliidi kokku 11 a . See tõstab esile vead.
Noh, ärge unustage arengut. Arvan, et igal disaineril oleks kasulik valida puuduvate teadmiste kursus Photoshop-Master käsud .
PhotoshopMasteri meeskonna kursused disaineritele. Lisaks kutsun teid üles tellima minu ajaveebi uudiskirja ja VKontakte grupp. See võimaldab teil disaini arendamisel hetkekski peatuda ja täiustada end iga päev.
OK, nüüd on kõik läbi. Kohtumiseni ja edu.
