Мен бірден айтайын - тек екі бағдарлама бар әзірлеу, макет, газет, журнал, буклет жасау үшінт.б.:

Кварк Xpress

Мен бұл компанияның тарихымен жақсы таныс емеспін, бірақ бағдарлама жаман емес. Осы күнге дейін газеттер мен журналдар оның қарапайымдылығына байланысты 4-нұсқасын (қазір 8-нұсқасы бар) пайдаланады. Орыс тілін қолдау ендірілген ЕМЕС және әр нұсқа үшін бөлек орнатылуы керек. Қосымша параметрлерсіз сөзді дефистеу жұмыс істемейді,

және қашан журналдар мен газеттердің орналасуыСөз сызықтары болмаса, ештеңе жұмыс істемейді, сондықтан егер сіз газетіңізді немесе журналыңызды үйде орналастырғыңыз келсе, Кваркты қолданбағаныңыз дұрыс - сізге көп нәрсені орнатуға тура келеді, бұл қосымша білім мен уақытты қажет етеді.

Adobe Indesign

Adobe Indesign - бұл Photoshop бағдарламасын жасаған динозаврлар нарығының бағдарламасы. Алдыңғы бағдарлама PageMaker деп аталды. Орнату кезінде проблемалар туындайды, әрине, әр жолы жаңалары бар, бірақ бұл ең жақсы бағдарлама өзінше. Орыс тілі кіріктірілген, мен сөздерді дефиспен қою мүмкіндігі туралы айтып отырмын. Мен Indesign-те Quark-ты жақсы білетіндіктен жұмыс істей бастадым (мен іс жүзінде тінтуірсіз - пернетақтада жұмыс істей алатынмын), тіпті бұл мәселені жасаушылар да ескерді: Indesing-те Quark Exrpress 4.0 пернелер тіркесімін орнатуға болады (бірақ олар тек шамамен ұқсас, бірақ сіз оған тез үйренесіз) ).

Осы бағдарламалардың барлығы жақсы орнатылып, жұмыс істеуі үшін қаріптерді ретке келтіру керек. Ол үшін қандай да бір түрін орнатыңыз (ең танымал Adobe Font Manager). " Бұзылған қаріптер» жиі кездеседі, көбінесе бұзылған қаріп Arial болып шығады (Windows жүйесіндегі негізгілердің бірі). Яғни, бұл, әрине, көзге көрінбейді - қаріптің өзі және шрифт Word бағдарламасында жақсы жұмыс істейді, мысалы, бірақ кейбір таңбалар дұрыс «сызылған» және Indesign жай орнатылмайды немесе орнатқаннан кейін іске қосылмайды.

Ал, ең бастысы! Газеттер мен журналдардың макетіне арналған бағдарламалар ( Айтпақшы, Quark Express және Indesign-те басып шығару үшін кез келген макеттерді жинай аласыз: флаерлер, плакаттар, брошюралар, буклеттер.) Бұл мәтінмен жұмыс істеуге арналған бағдарламаларбірақ фотосуреттермен немесе мәтін мен фотосуреттерді реттеу үшін емес. Бұл бағдарламаларда фото өңдеу құралдары жоқ, сондықтан кем дегенде тағы біреуі міндетті бағдарлама- Бұл Adobe Photoshop, ол жариялауға барлық растрлық графиканы дайындайды.

Scribus – баспа өнімдерінің макетіне арналған бағдарлама: кітаптар, журналдар мен буклеттер, брошюралар, визиткалар және т.б. Scrybus қымбат ақылы редакторларға тегін балама ретінде жасалған, сондықтан қосымшада көптеген кәсіби мүмкіндіктер бар. Осылайша, бағдарлама CMYK түсті бөлу жүйесін және ICC түстерді басқаруды қолдайды. Бұл веб-сайтта Scribus тегін жүктеп алуға болады.

Қолданбаның стандартты интерфейсі қарапайым: ұқсас бағдарламалық жасақтаманы жақсы білетін пайдаланушылар онымен еш қиындықсыз жұмыс істей алады. Бағдарлама көптеген заманауи кескін пішімдерімен жұмыс істейді, Юникодта мәтіндер мен қаріптерді, сондай-ақ жылдам пернелерді қолдау бар. Қажет болса, өзіңіздің жылдам пернелеріңізді орнатуға, қабаттармен жұмыс істеуге, қаріптерді енгізуге және қолмен кернге қоюға болады.

Қолданбаны тәжірибесіз пайдаланушылар оңай меңгере алады, арқасында көмек жүйесіорыс және басқа тілдерде қолданушы бағдарламаны меңгеру барысында туындайтын сұрақтарға жауап таба алады. Scribus сізге нөлден бастап макеттер жасауға, сондай-ақ дерекқорда қол жетімді үлгілерді пайдалануға мүмкіндік береді. Сонымен қатар, әзірлеушілер дайындаған үлгілерді өз қалауыңыз бойынша өзгертуге болады.

Жаңа жобаны жасамас бұрын операциялық параметрлерді - парақ пішімін, қаріпті және басқа да көптеген параметрлерді орнату керек. Параметрлерді орнатып, оларды растағаннан кейін бағдарлама терезесі пайда болады, онда жұмыс аймағы, құралдар жиынтығы бар панель және контекстік мәзір. Құрал белгішелері жақсы жасалған және интуитивті және олар ыңғайлы орналасқан. Өздерінің айтуы бойынша функционалдық Scribus қымбаттан айтарлықтай ерекшеленбейді ақылы бағдарламалар, демек, меңгеру бұл қолданбабұл біраз уақытты алады.

Scribus-тың негізгі артықшылықтары

• Кең функционалдылық.
• CMYK пішімін қолдау.
• Ыңғайлы көмек жүйесі.
• Кірістірілген үлгілердің болуы.
• Жылдам пернелерді қолдау.

Қолданбаның функционалдығы ішінде құжаттарды жасауға мүмкіндік береді PDF пішімі. Сондай-ақ құжаттаманы SVG, PDF және EPS пішімдерінен импорттауға және экспорттауға болады. Құрылған макеттер кәсіби жабдықта басып шығаруға дайын.

2 дауыс

Менің блог сайтыма қош келдіңіз. Бүгін біз html орналасуы үшін қандай бағдарлама қажет екендігі туралы сөйлесетін боламыз. Кейбіреулер, әсіресе жаңадан келген веб-шеберлер қарсылық білдіруі мүмкін. Жүйеде қол жетімді кез келген нәрсеге қол жеткізуге болатын болса, неге қосымша бағдарламалық құралды пайдалану керек? мәтіндік редактор, мысалы, блокнотпен? Иә, солай, бірақ жұмыс істеу ыңғайсыз болады.

Арнайы бағдарламаны пайдалансаңыз, орналасу әлдеқайда жылдамырақ болады қосымша мүмкіндіктер, веб-сайтты жасау процесін айтарлықтай жеңілдетеді. Бұл мәселені толығырақ қарастырайық.

Бұл не

Макет – беттегі блоктардың, тақырыптардың, кестелердің, кескіндердің және басқа элементтердің орналасуы. Ол кесте түрінде де болуы мүмкін.

Үстіңгі деректемесі (үстіңгі деректеме) және төменгі бөлігі (колонтитул) бар екі бағаналы макеттің мысалын қарастырайық.

Тақырыпта компания логотипі бар. Содан кейін екі бағанға бөлінген негізгі мазмұны бар аймақ бар. Сол жақ мәзірді, бүйірлік тақтаны және т.б. орналастыру үшін қолданылады. Дұрысы негізгі мазмұнға арналған.

Төменгі деректеме немесе төменгі деректеме әдетте қосу үшін қажет байланыс ақпаратысайт иесі туралы.

Көріп отырғаныңыздай, нәтиже мазмұны жоқ макет, бірақ оның жалпы құрылымы бар. Бұл макет. html және css тілдерінде жасалған арнайы бағдарламалар. Евгений Поповтың меңгеру бойынша жақсы тегін курсы бар екенін атап өткім келеді html Және css .

Жақшалар

Біреуі шығар үздік редакторларашық бастапқы код. Бірнеше бар қызықты ерекшеліктері:

• Көру жеке элементтерграфикалық дизайн psd файлы, және оларды CSS кодына түрлендіру;
• Қосымша ақпарат алу үшін қосымшаларды пайдаланыңыз ыңғайлы жұмысбастапқы кодпен;
• «Жылдам өңдеу» мүмкіндіктері.

Жақшалар - бұл жаңадан бастағандар үшін де, кәсіпқойлар үшін де қолайлы тамаша редактор. Оны жүктеп алу үшін өтіңіз brackets.io .

Интернет жобасын жасау кезінде бір макет бағдарламасы жеткіліксіз болатындығын атап өткім келеді. Мен сізге оны тексеруді ұсынамын.

Керемет мәтін

Негізгі ерекшеліктерін қарастырайық Керемет мәтін :

• Код арқылы оңай шарлау үшін шағын карта;
• Сіздің жеке параметрлеріңіз арнайы қалтада сақталады;
• Плагиндердің болуы;
• Windows және Mac операциялық жүйелерінде жұмыс істейді.

Macromedia Dreamweaver

DW - ең көне редакторлардың бірі, ол өте танымал, себебі:

• ол дизайн мен кодты бір уақытта көруге мүмкіндік береді;
• кеңесті қолдануға болады;
• таңбаларды іздеу және ауыстыру ыңғайлы ұйымдастырылған;
• Ресми веб-сайтта сіз DW үшін көптеген қондырмалар мен плагиндерді таба аласыз.
• күшті визуалды редакторкод жазбай бетті жасауға мүмкіндік береді.
• онлайн алдын ала қарау.

Онымен жұмыс істеу өте қиын. Барлық мүмкіндіктерді зерттеу үшін уақыт қажет. Кәсіби мамандар үшін қолайлы, әсіресе жасалған беттің html кодын жылдам алу қажет болса.

Visual Studio коды

Visual StudioКод веб-бағдарламалаумен таныс адамдарға арналған.

Оның жоғарыдағы редакторлар сияқты мүмкіндіктері бар. Мен JavaScript, Node.js, TypeScript және т.б. веб-қосымшаларды құру үшін қолданылатын Visual Studio Code құралын ерекше атап өткім келеді. Бағдарлама тегін.

Блокнот++

Тегін редактор ашық дереккөз. Оның функционалдығы модульдердің көмегімен кеңейтілген. Көптеген қосымша плагиндер орнатылған болса да жылдам жұмыс істейді. Кірістірілген бастапқы кодты бөлектеу функциясы бар.

Егер сіз веб-сайт құруға қызығушылық танытсаңыз, қосымша әдебиетсіз жасай алмайтыныңызды атап өткім келеді. Мен сізге осы тақырып бойынша менің мақаламды оқуды ұсынамын.

Aptana Studio 3

Күшті және тегін құрал Aptana Studio 3 html, css, php, JavaScript, Ruby тілдерімен жұмыс істеуді қолдайды. Кез келген күрделілік деңгейіндегі интернет-жобаны құру үшін қолайлы. Онда артық ештеңе жоқ және ол өте жылдам жұмыс істейді. Синтаксистік ерекшелеу функциясы бар. Бұл DW-ге тегін балама деп айта аламыз.

Bootstrap Studio

түріндегі конструктор» сүйреп апарыңызрамка үшін drop" Bootstrap . Әзірлеушілер редакторға қосты орасан зор сомақосымша модульдер, . Беттің қалай көрінетінін тексеруге мүмкіндік береді әртүрлі құрылғылар. Редактор тегін емес, бірақ бұл кез келген маңызды әзірлеуші ​​үшін жақсы инвестиция.

Атом

Редакторды әйгілі GitHub командасы жасаған. Жоғарыда сипатталған бағдарламалар сияқты мүмкіндіктерге ие. Атом - ашық бастапқы бағдарламалық қамтамасыз ету. Сондықтан сіз өзіңіз жасай аласыз, бар модульдерді өңдей аласыз немесе өзіңізді жаза аласыз. Мұнда дистрибутивке енгізілген пакеттер:

• html және css үшін автотолтыру;
• Үзінділерді құру;
• Жұптастырылған жақшаларды бөлектеу;
• Ыңғайлы іздеу және ауыстыру.

Оқуға уақытты босқа өткізгіңіз келмесе, бірақ нәтиже тез қажет болса не істеу керек? Бұл жағдайда ақылға қонымды баға бойынша мәселеңізді шеше алатын мамандарға хабарласыңыз. Ол үшін мен сізге қызықты қызмет ұсынғым келеді. Kwork .

Қорытынды

Жоғарыда сипатталған редакторлардың әрқайсысы кодты жылдам жазу опцияларын ұсынады. Олардың арасындағы айырмашылық бұл функциялардың қалай жүзеге асырылатынында. Мен ең алдымен жаңадан бастаушыларға жақшаларды немесе жоғары мәтінді пайдалануды ұсынамын. Тәжірибелі веб-шеберлер Macromedia Dreamweaver бағдарламасына назар аударуы керек ( оны қалай пайдалану керектігі туралы тегін курс) немесе Visual Studio коды. Редакторды таңдау көбінесе жеке қалауыңызға және әзірлеуші ​​ретіндегі жұмысыңыздың күрделілігіне байланысты.

Менің парақшама жазылыңыз ВКонтакте тобы , онда көптеген қызықты ақпарат болады.

3 дауыс

Менің блогыма қош келдіңіз. Бүгін мен дизайнерлер үшін пайдалы таңдауды дайындауды шештім. Мен ең танымал веб-шебер сайттарына кіріп, дизайн жасауға көмектесетін 50 ең жақсы құралды таптым.

Мен сіздердің назарларыңызға веб-дизайн бағдарламаларын, кәсіби мамандар мойындаған үздік онлайн қызметтер мен құралдарды ұсынамын. Мен барлық тармақтармен келіспеймін, бірақ мен сияқты сайттарда жұмыс істейтін мамандармен дауласатын кіммін Нетология , vc.ru, сәлем айтжәне т.б.

Мен бұл тізімді өз бетімше кеңейтіп, санаттарға бөлдім. Енді назарларыңызға ұсынамын.

Негізгі бағдарламалар

Әрине, бірде-бір веб-әзірлеуші ​​онсыз жасай алмайды стандартты жиынтық Adobe компаниясынан, ол арқылы барлық жұмыс жүргізіледі. Қазір 2016 жылдың соңы және көптеген мамандар бұл бағдарламаның танымалдылығы артып жатқанын айтады Эскиз Бірнеше жылдан бері кәдімгі Photoshop-ты алмастырып келе жатқан , мұны істемекші. 2017 жылы біз барлығымыз осы нақты бағдарламаны белсенді түрде зерттейтін боламыз.

Бұл оның әлі орыс тілінде болмағанына және тек Mac OS үшін жарамды болғанына қарамастан. Көптеген кәсіпқойлар бұл Photoshop-қа қарағанда интерфейсті жобалауға жақсырақ деп мәлімдейді.

Егер біз басқа Adobe өнімдері туралы айтатын болсақ, оларды зерттеу немесе білмеу сізге байланысты. Бірақ олар әлі де тізімде.

• Иллюстратор қалай ең жақсы құралвекторлық графикамен жұмыс істеуге және иллюстрациялар жасауға арналған.
• InDesign басып шығаруға арналған оңтайлы утилита ретінде.
• Adobe Muse - жасау үшін тамаша платформа

Adobe өнімдерінен басқа, мамандар басқа брендтерге және олардың өнімдеріне назар аударуды ұсынады. Макав ең танымал веб-дизайн бағдарламаларының бірі ретінде танылған. Sketch-тен айырмашылығы, ол Windows жүйесіне қолайлы және кодты білмей-ақ бағдарламалауға мүмкіндік береді. Ол автоматты түрде өзін жасайды. Сіз оны тікелей ресми сайттан тегін жүктей аласыз. Шындық тек қана Ағылшын.

Creative Bloq Adobe Muse бағдарламасына балама ретінде тағы бір заманауи қызметті ұсынады Қарағай , ол кескінді кодқа автоматты түрде түрлендіру арқылы кез келген веб-сайтты салу үшін қолайлы. Дәл осылай Jetstrap арқылы қол жеткізуге болады.

Егер сізге қолданбалармен жұмыс істеу қажет болса, бұл сізге көмектесуі мүмкін Қолданбаларға арналған негіз .

Графикалық банк

Әрбір дизайнерге графика қажет. Егер сіз бәрін өзіңіз салсаңыз, бұл көп уақытты алады. Кейбір элементтерді басқа біреуден тапсырыс беруге болады немесе банктерден дайын суреттерді сатып алуға немесе алуға болады. соғу жақсы дизайнерешқашан болмайды, бірақ жақсы сайттан жүктеп алыңыз - неге жоқ.

Мысалы, бойынша endlessicons.com белгішелерді және қосуға болады coverr.co бейне мұқабалар.

Қосулы freepik.com Және IconStore көп табуға болады тегін суреттер. Векторлар және тіпті PSD макеттері. Мен өз атымнан ұсына аламын Photoshop-шебері Және Pixabay .

Stripemania.com – графиканы жылдам жасайды. Өз түстеріңізді қосып, жолақты суретті алыңыз. Өзіңіздің анимациялық фоныңызды жасағыңыз келе ме? тегіс түсті ауысумен? Бұл сайт сізге көмектеседі. gradient-animator.com . Ол нәтижені нақты уақытта көрсетіп қана қоймайды, сонымен қатар сайтқа енгізу қажет кодты жасайды.

Findguidelin.es бұл танымал брендтер туралы дизайнерлер үшін белгішелер мен барлық ақпаратты таба алатын топтама: WatsApp, Facebook, VKontakte және т.б.

Логотип пен фавикон жасаушы

Мен таң қалдым, бірақ дизайнерлерге арналған көптеген танымал және беделді сайттарда сіз көмектесетін қызметке сілтеме таба аласыз. Нетологияда, мысалы, олар ұсынады withoomph.com немесе designrails.com . Мен артық көремін Логастер .

Жылдам жасау үшін порталды пайдалануға болады www.favicon.cc . Айтпақшы, мен ол туралы жазғанмын. Жақсы заттар.

Түспен жұмыс

Нашар дизайнер - түстердің ең жақсы комбинациясын жасау үшін кәсіби қызметтердің көмегіне сенбейтін адам. Бұл үшін Интернетте көптеген ресурстарды таба аласыз. Мысалы, маған ұнайды Түс схемасы .

Қызмет Материал палитрасы екі түсті таңдауды ұсынады және ол сізге схеманың қалған бөлігін аяқтайды: қаріптер, бөлгіштер және т.б.

Қосулы 0-255әртүрлі реңктерді қарауға болады, дегенмен сізде ресейлік балама бар - Яндекс.

Егер сіз әдемі суретті көрсеңіз, қызметті пайдалана аласыз pictaculous.comодан үзінді түс схемасы. Айтпақшы, бұл сіздің порталыңызда осы немесе басқа суретті пайдалануды нақты шешуге көмектеседі. Егер ол негізгі схемамен сәтті біріктірілмесе, онда жауап анық.

Қаріптермен жұмыс

Жұмыс істеуге арналған бірінші және ең жақсы ресурс Google қаріптеріҚаріптер. Бұл үлкен қаріптер жинағы, соның ішінде орыс тілінде. Таңдауға ыңғайлы және пайдалану оңай.

Қаріптердің тамаша үйлесімін табу үшін сарапшылар қызметті пайдалануды ұсынады: canva.com/font-combinations немесе typewolf.com .

Сондай-ақ бұл шолғыш кеңейтімін пайдалы деп таба аласыз fontface.ninja . Жақсы қаріпті тауып, тінтуірді оның үстіне апарып, ақпарат алыңыз. Оны табу ғана қалды.

Және веб-сайттағы онлайн редакторда prototypo.io сіз оны аздап өзгерте аласыз және оны бірегей ете аласыз.

Қорытынды кезең

Жоба дайын болғанда, компьютерлерден және экрандағы стандартты браузерлерде бәрі қалай көрінетінін тексеру керек ұялы телефон. Resizemybrowser.com тез орындауға көмектеседі.

Қызметті пайдалану dunnnk.com скриншотты телефондар мен компьютерлердің мыңдаған кескіндеріне кірістіре аласыз және сіздің сайтыңыз әртүрлі гаджеттерде бірнеше бұрыштан қалай көрінетінін көре аласыз.

Веб-сайтта өте пайдалы тізім бар webdesignerschecklist.com . Сіз бәрін дұрыс орындадыңыз ба, жобаны ұсынуға бола ма? Тек ұяшықтарды белгілеп, ештеңені ұмытпағаныңызға көз жеткізіңіз. Өкінішті, бірақ қызмет тек ағылшын тілін білетіндер үшін жарамды.

Егер сіз дизайнмен қатар макет жасасаңыз, кодқа қызметтік бағдарламаны құра аласыз барлығы 11ж . Ол қателерді көрсетеді.

Жақсы, даму туралы ұмытпаңыз. Кез келген дизайнерге жетіспейтін білім бойынша курсты таңдау пайдалы болады деп ойлаймын Photoshop-Master командалары .

PhotoshopMaster командасының дизайнерлеріне арналған курстар.

Сонымен қатар, мен сізді блог ақпараттық бюллетеньге жазылуға шақырамын және ВКонтакте тобы. Бұл дизайнды дамытуда бір секундқа тоқтап қалмауға және күн сайын жақсартуға мүмкіндік береді.

Жарайды, бәрі осы. Тағы да кездескенше, сәттілік тілейміз.

Сонымен, түсінікті болсын: жұмысыңызды жылдамдату үшін сізге құрал қажет. Яғни, барлық функционалдылықты жетік меңгерудің қажеті жоқ, тез жұмыс істеуді үйрену керек. Қандай құралды таңдасаңыз да, үйреніңіз негізгі ерекшеліктеріжәне барлық жылдам пернелерді меңгеріңіз.

Оларды автоматты түрде пайдалануды үйреніңіз, содан кейін ғана кеңейтілген функцияларға өтіңіз. Қарапайым веб-сайттарды жобалау үшін сізге тек қаріпті орнату, сурет салу мүмкіндігі қажет қарапайым пішіндер, қабаттармен жұмыс, түстерді өзгерту және т.б.

Күріш. 7.0: Мен веб-сайтымды бірнеше негізгі құралдарды, бір қаріпті және үш түсті пайдаланып жасадым.

Құралмен ыңғайлы болғаннан кейін, сіз әртүрлі идеяларды жылдам сынай аласыз (бұл сізге жақсы нәтиже беруге көмектеседі) және жұмысыңызды уақытында аяқтай аласыз (бұл сіздің клиенттеріңіз бен жұмыс берушілеріңізді қуантады!).

Егер сіз дизайнды енді ғана үйрене бастасаңыз немесе басқа құралға ауысқыңыз келсе, мен сізге бірнеше нұсқамен тәжірибе жасап, өзіңізге ыңғайлысын таңдауға кеңес беремін. Әрқайсымыздың өз өмірлік тәжірибеміз, өз әдетіміз бар. Егер сізге қандай да бір себептермен бағдарлама ұнаса, сіз оны әлдеқайда жылдам меңгересіз.

Бір сәтте басқа құралға ауысуға тура келетінін түсіну маңызды. Көпшілігіміз фотошопты жылдар бойы қолданып келеміз, өйткені нарықта балама жоқ. Соңғы екі жылда жағдай түбегейлі өзгерді.

Веб-дизайн ұзақ уақыт бойы статикалық болуды тоқтатты, және біз дизайн мен код арасындағы алшақтықты толтыруға тырысамыз. Жақын арада көптеген жаңа мүмкіндіктер мен тіпті құралдар пайда болуы мүмкін.

Танымал дизайн бағдарламалары

Дизайн құралын таңдаған кезде бағдарламаның жылдамдығы мен сапасы ғана емес, сонымен қатар оның кәсіби ортадағы танымалдығы маңызды рөл атқарады. Егер сіз бір бағдарламалық жасақтаманы пайдалансаңыз, басқа дизайнерлермен және әзірлеушілермен (мысалы, ауқымды жобаның бөлігі ретінде) жұмыс істеу оңайырақ болады.

1. Эскиз– жылына $99 (тек Mac үшін)

7.1-сурет: Эскиз

Мен қазіргі жобаларымның көпшілігі үшін Sketch қолданамын. Құрал өте жылдам, интуитивті және пайдалану өте оңай (мен оны Photoshop-тан еш қиындықсыз ауыстырдым). Эскиз - ең танымал дизайн қосымшаларының бірі, сондықтан оны әзірлеушілер мен дизайнерлердің көпшілігі жақсы біледі.

Sketch-те дизайн үшін қажет нәрсенің бәрі бар: бағыттаушылар, торлар, таңбалар, перспективалық түрлендіру (iOS жүйесінде дизайнды алдын ала қарау үшін), векторлық өңдеу, прототиптеу, кітапханалар, активтерді экспорттау, бұлт (дизайндар мен кітапханаларды ортақ пайдалану үшін) және тіпті кодты экспорттау . Ол үшін көптеген плагиндер мен ресурстар бар.

Sketch бағдарламасының ең үлкен кемшілігі ол тек Mac жүйесінде жұмыс істейді. Дегенмен, сияқты қолданбалар үшін жобаларды экспорттай аласыз InVision Және Зеплин әзірлеушілер үшін спецификациялар мен нұсқауларды жасау.

2. Фигма– Тегін немесе айына $12 (веб қолданбасы)

7.2-сурет: Сурет

Фигма салыстырмалы жаңа бағдарламадизайн үшін. Бұл, мүмкін, Sketch-тің ең үлкен бәсекелесі - және ол өте тез өсіп келеді. Figma Sketch сияқты барлық мүмкіндіктерге ие - сонымен қатар бірнеше дизайнер бір жобада бір уақытта жұмыс істей алады.

Ең кереметі, егер сізде үш жобаға дейін болса, Figma толығымен тегін және айына бар болғаны 12 долларға сіз барлық мүмкіндіктердің құлпын ашып, шексіз жобаларды жасай аласыз. Қолданба тікелей браузерде жұмыс істейді - демек, кез келген дерлік операциялық жүйе. Пайдаланушы интерфейсі Sketch және Adobe XD-ді еске түсіреді: егер сіз бұл құралдармен таныс болсаңыз, онда сізге ештеңе үйренудің де қажеті жоқ.

Егер сіз бастаушы дизайнер болсаңыз және қымбат бағдарламалық жасақтаманы әлі инвестицияламай-ақ өз күшіңізді сынап көргіңіз келсе, бұл тамаша нұсқа. Мен бірнеше жобаларымда Фигманы қолдандым және оны өте оңай әрі жылдам деп таптым.

3. Adobe XD– Тегін (Mac және Windows)

7.3-сурет: Adobe XD

Adobe XD - кәсіби дизайн қолданбалары әлеміндегі тағы бір күшті ойыншы. Менің ойымша, бұл UI дизайны, сымдық фрейминг және прототиптеу үшін тамаша, бірақ оның Sketch немесе Figma-мен салыстырғанда бірнеше жетілдірілген мүмкіндіктері жоқ.

Артықшылығы - бұл құрал Mac және Windows үшін де тегін (бірақ ол аяқталған кезде төленуі мүмкін). Сонымен қатар, бұл Adobe өнімдерінің желісі, сондықтан сіз активтерді Photoshop немесе Illustrator сияқты басқа құралдармен бөлісе аласыз.

Интерфейс Sketch және Figma-ға өте ұқсас, сондықтан сіз бірден үш құралды пайдалана аласыз - және олардың арасында еш қиындықсыз ауыса аласыз (кейбір жылдам пернелердің әртүрлі болуын қоспағанда!).

4. InVision Studio– Тегін (бета-нұсқасы, ерте қол жеткізу)

7.4-сурет: InVision Studio

InVision Studio - әлі бета нұсқасында, бірақ перспективалы болып көрінетін жаңа толық стек құралы. Интерфейс дизайн құралдарының заманауи стандартына айналған Sketch және Figma көшірмелері болып табылады.

Мен InVision Studio-мен біраз тәжірибе жасап көрдім және басқа InVision өнімдерімен жақсы тәжірибе жинағандықтан, ресми нұсқасы шыққан кезде жігіттер табысқа жететініне сенімдімін.

5. Веб ағыны– Тегін немесе айына $16 (веб қолданбасы)

7.5-сурет: Веб-ағын

Webflow – тікелей платформасында орналастырылатын (немесе басқа жерде экспортталатын және орналастырылатын) функционалды және жауап беретін веб-сайттарды жасауға арналған толық стек құралы.

Мен дизайнды кодтау құралдарының жанкүйері емеспін, себебі жасалған код әдетте өте жақсы жұмыс істемейді және онымен жұмыс істеу қиын. Дегенмен, Webflow өте жақсы. Сізде CSS кодын толық басқара аласыз, сонымен қатар құрал HTML және CSS қалай жұмыс істейтінін көрсетеді, себебі барлық дизайн элементтері браузерде күтілгендей әрекет етеді.

Менің ойымша, Webflow жылдам прототиптерді, қарапайым сайттарды, бір пейджерлерді және т.б. жасау үшін тамаша. Мен білетін көптеген кәсіби дизайнерлер Webflow қызметін пайдаланады, сондықтан оны мұқият қарап шығу керек!

6. Adobe Photoshop– айына $20,99 немесе Creative Cloud бөлігі ретінде (айына $52,99)

7.6-сурет: Adobe Photoshop

Мен фотошопты тізімнің ең соңына қойғаным кездейсоқ емес. Photoshop - бұл өте танымал веб-сайтты жобалау бағдарламасы, бірақ ол Sketch, Figma және басқа құралдармен күресте жеңіліп жатыр. Егер сіз әлі де Photoshop қолданбасын пайдаланып жатсаңыз, бұл жақсы, бірақ жақын арада басқа құралға көшуге дайын болыңыз.

Қазіргі веб-әзірлеу стандарттары бізді икемді жобалар жасауға, кодқа жақындауға және дизайн жүйесі аясында жұмыс істеуге мәжбүр етеді. Жоғарыдағы құралдармен салыстырғанда Photoshop бағдарламасы тым баяу және тым үлкен файлдарды шығарады.

Дегенмен, мен әлі де фотошопты фотосуреттерді өңдеу, графика жасау және иллюстрацияларды өңдеу үшін қолданамын.

7.7-сурет: Sketch, Figma және Adobe XD интерфейстерін жылдам салыстыру. Қараңызшы, олар қаншалықты ұқсас!

Жұмыста қолданатын басқа құралдар:

Мұнда толық тізімжұмысымда қолданатын құралдар.