16 најбољих Гоогле-ових алата за развој и дизајн у 2020

Аутор: Louise Ward
Датум Стварања: 10 Фебруар 2021
Ажурирати Датум: 18 Може 2024
Anonim
СТАМБУЛ, Турция. Восток и Запад. Большой выпуск.
Видео: СТАМБУЛ, Турция. Восток и Запад. Большой выпуск.

Садржај

Рад на вебу обично значи да ћете радити са Гоогле-ом у неком облику или облику. А пошто је Гоогле Цхроме улице испред конкуренције, дизајнери и програмери морају да размисле о томе како ће њихов пројекат функционисати са прегледачем. Како ће изгледати? Које технологије подржава, колико је сигурна и како ће се изводити?

Срећом, Цхроме нуди алате који осигуравају да било која веб локација или апликација буду у најбољем издању. ДевТоолс омогућавају дизајнерима и програмерима да стекну увид у веб страницу: можете да манипулишете ДОМ-ом, проверите ЦСС, експериментишете на дизајну са уређивањем уживо, отклоните грешке у ЈаваСцрипт-у и проверите перформансе. (Овде погледајте више о томе како да користите ове Гоогле веб алате, а ако почињете од нуле, погледајте и нашу листу најбољих веб-креатора).

Али Гоогле нуди више од самог прегледача. Има алате и ресурсе који помажу готово свим аспектима вашег дизајнерског и развојног живота. Желите да знате како да побољшате перформансе? Светионик је овде да помогне. Желите да направите мобилне веб локације са бољим учинком? Онда се поздравите са АМП-ом. Да ли желите да направите лепе ПВА? Тада су Флуттер, Материал Десигн и Воркбок спремни за улазак.


Лепота коришћења Гоогле алата, ресурса, библиотека и оквира је у томе што знате да ће добро радити са прегледачем Цхроме - најпопуларнијим прегледачем на планети. За више алата погледајте наш преглед алата за веб дизајн.

01. Светионик

Учинак је кључни фактор успеха веб локације, а Лигхтхоусе је Гоогле-ов алат за побољшање квалитета веб страница (такође ће вам помоћи права услуга хостинга). Па како користите Лигхтхоусе и шта он може учинити? У најједноставнијем облику, Лигхтхоусе можете покренути са картице Ревизије и одабрати једну од опција, укључујући радну површину или мобилни уређај, поред квачица за перформансе, приступачност и СЕО, да бисте генерисали коначни извештај са предложеним побољшањима.

02. Полимер

Полимер је познат по раду са веб компонентама, али пројекат је сада проширио свој репертоар тако да обухвата колекцију библиотека, алата и стандарда. Шта је укључено? ЛитЕлемент је уређивач који олакшава дефинисање веб компонената, док је лит-хтмл ХТМЛ библиотека предложака која омогућава корисницима да пишу ХТМЛ предлошке следеће генерације у ЈС-у. Поред тога, пронаћи ћете и ПВА Стартер комплет, оригиналну библиотеку Полимер и скупове веб компонената.


03. АПИс Екплорер

Гоогле има огромну библиотеку АПИ-ја доступних програмерима, али проналажење онога што вам није лак задатак. Овде ступа Гооглеов истраживач АПИ-ја да би пружио руку помоћи. Постоји дуга листа која се може померити, али за бржи приступ постоји поље за претрагу за филтрирање АПИ листе. Сваки унос води до референтне странице са више детаља о томе како се користи АПИ.

04. Лепршање

Ако желите да из једне базе кодова направите лепо изгледајуће апликације за мобилне уређаје, веб и радне површине, Флуттер би могао бити за вас. Сајт представља потпуну референцу за рад и израду са Флуттером. Немате појма шта да радите? Документи воде корисника од инсталације до стварања, уз помоћ мноштва узорака и водича.

05. Гоогле ГитХуб

Као што ће већина знати, ГитХуб је хостинг платформа / спремиште за чување и дељење кода и датотека. На срећу, Гоогле има своје место на платформи са преко 260 спремишта за пребирање. Помоћу филтера смањите време претраге и приближите се спремишту са којим желите да се играте или у коме желите да допринесете.


06. Луткар

Уграђен у Ноде, Пуппетеер нуди АПИ на високом нивоу који вам омогућава приступ Цхроме-у без главе - ефикасно Цхроме-у без корисничког интерфејса, који програмери могу да контролишу преко командне линије. Па, шта можете учинити с Пуппетеером? Доступно је неколико опција за генерисање снимака екрана и ПДФ-ова страница, аутоматизовање слања образаца и стварање аутоматизованог окружења за тестирање.

07. Радна кутија

Ако желите да направите ПВА, ово је сјајна полазна основа. Воркбок пружа колекцију ЈаваСцрипт библиотека за додавање офлајн подршке веб апликацијама. Избор детаљних водича показује како се креира и региструје датотека услужног радника, захтеви за усмеравање, користе се додаци и користе пакети са Воркбок-ом. Такође постоји низ примера стратегија кеширања које треба проверити.

08. Цоделабс

Потребне су вам практичне смернице за Гоогле производ? Цоделабс пружа „вођено, туториално, практично искуство кодирања“. Сајт је лепо подељен на категорије и догађаје, што омогућава брзо и лако проналажење онога што желите. Обухвата Аналитику, Андроид, Асистента, проширену стварност, Флуттер, Г Суите, Сеарцх, ТенсорФлов и виртуелну стварност. Изаберите опцију и набавите код и упутства која су вам потребна за изградњу малих апликација.

09. Алат за боје

Алат за боје је једноставан алат који вам омогућава да креирате, делите и примените палету поред провере приступачности. Корисници могу да изаберу унапред дефинисану палету из палете Материјал. Једноставно одаберите боју, а затим је примените на примарну шему боја, пребаците се на секундарну опцију и изаберите поново. На крају, одаберите боје текста за обе шеме. Алтернативно, пребаците се на Прилагођено да бисте одабрали боје. Затим пређите на Приступачност да бисте проверили да ли је све добро пре, коначно, извоза палете.

10. Дизајн спринтова

Дизајн спринт комплет је за оне који уче како да учествују или воде трке у дизајну. Чини се да покрива све базе знања, од почетника до искусних фацилитатора спринта. Сазнајте више о методологији или скочите право у фазу планирања, укључујући писање подлога, прикупљање података и истраживања, као и шта радити након спринта. Такође укључује мноштво ресурса као што су алати, предлошци, рецепти и могућност слања сопственог метода. Такође, вероватно ће вам требати негде за складиштење и дељење ресурса, па будите сигурни да је ваш избор за складиштење у облаку тачан.

11. Водич за људе + АИ

Овај водич је дело иницијативе Пеопле + АИ Ресеарцх при Гоогле-у и чини се да нуди помоћ онима који желе да изграде АИ производе усмерене на човека. Свеобухватан водич подељен је у шест поглавља која покривају потребе корисника, прикупљање и процену података, менталне моделе, поверење, повратне информације и грациозан неуспех. Свако поглавље је праћено вежбама, радним листовима и алатима и ресурсима који су потребни да би се то остварило.

12. Гоогле помоћник

Ово је платформа за програмере Гоогле Ассистант-а која нуди водич о томе како да интегришете свој садржај и услуге са Гоогле Ассистант-ом. Показује вам како да проширите своју мобилну апликацију, представите садржај на богате начине за Сеарцх и Ассистант, управљате светлима, апаратима за кафу и другим уређајима широм куће и градите гласовна и визуелна искуства за паметне звучнике, екране и телефоне.

13. ПагеСпеед Инсигхтс

ПагеСпеед Инсигхтс анализира веб садржај, а затим нуди предлоге за брже учитавање. Једноставно додајте УРЛ, притисните дугме Анализирајте и сачекајте да се магија догоди. Проверите Документе да бисте добили бољи увид у то како функционише ПагеСпеед АПИ и како да почнете да га користите.

14. АМП на Гоогле-у

АМП је Гоогле-ов алат за креирање мобилних страница са брзим учитавањем које ће (надамо се) доћи на врх ранг листе. Научите како да креирате брзе, корисничке веб локације, интегришете АМП у Гоогле производе, користите Гоогле АМП кеш меморију да бисте убрзали АМП странице и уновчили АМП странице са другим Гоогле производима.

15. Гоогле ДевТоолс

Сваки дизајнер и програмер зна (или би бар требао да зна) да Цхроме долази са сетом алата уграђених директно у прегледач. Цхроме-ови ДевТоолс су идеални за преглед елемената који чине страницу, проверу ЦСС-а, брзо уређивање страница и још много тога.

Картица Елементи представља увод у ДевТоолс. Приказује ХТМЛ код који чини одабрану страницу. Стекните увид у својства сваког див-а или ознаке са изабране странице и започните уређивање уживо. Ово је савршено за експериментисање са дизајном. Проверите распоред - да ли користите Флекбок или Грид - и погледајте сродне фонтове са примерима и испитајте анимације.

На другим местима можете прегледати и променити ЦСС. На картици Стилови на табли Елементи наведена су ЦСС правила која се примењују на тренутно изабрани елемент у ДОМ стаблу. Укључите и искључите својства (или додајте нове вредности) да бисте експериментисали са дизајном. Ово је савршен алат за осигуравање да све функционише онако како се очекује пре него што примените било какве промене на дизајну уживо.

Такође можете отклонити грешке у ЈаваСцрипт-у, оптимизовати брзину веб странице и прегледати брзину мреже. Ево кратког савета који можете користити за тренутно убрзавање радног процеса. Идите на картицу Извори, кликните Нови исечак и додајте често коришћени код. Именујте фрагмент кода и сачувајте. Поновите по потреби. Сада можете да зграбите овај исечак кода уместо да га поново пишете.

Као и сваки добар прегледач, Цхроме се непрестано развија и свако ново издање доноси нове функције. Сазнајте шта се дешава на Цхроме статусној платформи

16. Дизајн материјала

Развој се може доживљавати као Гоогле-ово омиљено дете, али шта год да правите, стварате или градите, оно треба да изгледа добро и да кориснику пружи искуство због којег жели да га користи. Материјал је новији додатак Гоогле стаје, али је систем дизајна који је сазрео у витални део дизајнерског комплета.

Као и сваки добар систем дизајна, он има свој сет смерница, које морате погледати пре него што закорачите у узбудљивије ствари. Добијте преглед како се користе различити елементи, шта је тематика материјала, како се примењује тема и водичи за употребљивост, укључујући приступачност. Другде постоји увид у Материал Фоундатион, који укључује кључна подручја дизајна као што су изглед, навигација, боја, типографија, звук, иконографија, кретање и интеракција. Свака категорија открива своје предности и недостатке и где треба размотрити опрез. Да бисте добили идеју шта можете очекивати, категорија Лаиоут нуди одељке о разумевању распореда, густине пиксела, начину рада са прилагодљивим распоредом, укључујући колоне, олуке и маргине, тачке прекида, регионе корисничког интерфејса и методе размака.

Поред одељка Дизајн налази се Компоненте, који пружа физичке грађевне блокове потребне за креирање дизајна. Шта је овде укључено? Дугмад, натписи, картице, дијалози, преграде, листе, менији, индикатори напретка, клизачи, брзе баре (ово су кратке поруке о процесима апликација у дну екрана), картице, текстуална поља и описи алата. Несумњиво свеобухватна колекција компонената.

И програмери нису заборављени, са детаљима и упутствима о томе како да граде за различите платформе - Андроид, иОС, Веб и Флуттер. И, коначно, постоји страница посвећена мноштву ресурса који ће вам помоћи да остварите изабрани дизајн.

Овај чланак се првобитно појавио у часопису нет. Купи издање 326.

Нове Публикације
Чувени шлемови дали су геометријски заокрет овом запањујућем пројекту
Даље

Чувени шлемови дали су геометријски заокрет овом запањујућем пројекту

Јустин Маллер је оснивач и креативни директор модерног уметничког колектива Дептхцоре. У каријери је створио штампане огласе за многе врхунске клијенте, укључујући Нике, ЕСПН и Министри оф Соунд. Неда...
Како је Сцанлине ВФКС освојио свет воде
Даље

Како је Сцанлине ВФКС освојио свет воде

Овај чланак вам је представљен у сарадњи са Мастерс оф ЦГ, новим такмичењем које нуди прилику за рад са једним од најпознатијих ликова 2000АД-а. Освајају се велике награде, зато уђите већ данас!Било ј...
Раван дизајн се сусреће са Молескине свескама и ... шахом?
Даље

Раван дизајн се сусреће са Молескине свескама и ... шахом?

Знамо да сте велики љубитељи бележница. Ваша љубав према Молескинес-у, као и врхунским свескама које нису Молескине, део су тога што сте графички дизајнер. Овде је белгијски дизајнер Петер Баетен свој...