Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Я працую фронтэнд-распрацоўшчыкам каля двух гадоў, удзельнічаў у стварэнні самых розных праектаў. Адзін з вывучаных мной урокаў: узаемадзеянне паміж рознымі групамі распрацоўшчыкаў, аб'яднаных адной мэтай, але якія маюць розныя задачы і ступень адказнасці, - справа няпростая.

Раячыся з іншымі ўдзельнікамі каманды, дызайнерамі і распрацоўшчыкамі, я стварыў цыкл стварэння сайтаў, прызначаны для невялікіх каманд (5-15 чалавек). У яго ўключаны такія прылады, як Confluence, Jira, Airtable і Abstract. У гэтым артыкуле я падзялюся асаблівасцямі арганізацыі працоўнага працэсу.

Skillbox рэкамендуе: Двухгадовы практычны курс "Я – Вэб-распрацоўшчык PRO".

Нагадваем: для ўсіх чытачоў "Хабра" - зніжка 10 000 рублёў пры запісе на любы курс Skillbox па промакодзе "Хабр".

Навошта ўвогуле ўсё гэта трэба?

Мінімальная каманда, патрэбная для стварэння сайта з нуля, - гэта дызайнер, праграміст і менеджэр праектаў. У маім выпадку каманда была сфарміравана. Але пасля рэлізу пары сайтаў у мяне склалася адчуванне, што з ёю нешта не так. Часам мы проста не да канца разумелі свае абавязкі, пакідалі жадаць лепшых зносін з кліентам. Усё гэта тармазіла працэс і замінала ўсім.

Я стаў працаваць над вырашэннем праблемы.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады
Пошук у Google дае нядрэнныя вынікі па нашай праблеме

Для таго каб выкананая праца была больш нагляднай, я стварыў дыяграму працоўнага працэсу, якая дае разуменне таго, як выконваецца праца ў нас.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады
Пры кліку карцінка адкрыецца ў поўным дазволе

Мэты і задачы

Адна з першых методык, якія я вырашыў праверыць, – "каскадная мадэль" (Waterfall). Яе я ўжыў, каб вылучыць праблемы і зразумець, як іх вырашыць.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Праблема: Часцей за ўсё кліент не ацэньвае працэс стварэння сайта модульна, як гэта робяць распрацоўшчыкі. Ён успрымае яго як звычайны сайт, гэта значыць думае катэгорыямі асобных старонак. На яго думку, дызайнеры і праграмісты ствараюць асобныя старонкі, адну за адной. У выніку заказчык проста не разумее, што за чым ідзе падчас рэальнага працэсу.

Задача: Пераконваць кліента ў зваротным не варта, аптымальны варыянт - распрацаваць усярэдзіне кампаній модульны працэс стварэння сайта на аснове пастаронкавай мадэлі.

Універсальныя дызайн-токены і кампаненты кіруюцца як распрацоўшчыкамі, так і дызайнерамі.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Праблема: гэта звычайная сітуацыя, якой прысвечана вялікая колькасць стратэгій. Ёсць нямала цікавых рашэнняў, у большасці выпадкаў прапануецца стварыць дызайн-сістэму, якая кіруецца гідам стыляў/генератарамі бібліятэк. Але ў нашай сітуацыі даданне ў працэс распрацоўкі яшчэ аднаго кампанента, які дазволіў бы кіраваць узроўнямі доступу для дызайнераў, было проста немагчымым.

Задача: пабудова ўніверсальнай сістэмы, у якой дызайнеры, распрацоўшчыкі і менеджэры могуць працаваць сінхронна, не замінаючы адзін аднаму.

Дакладнае адсочванне працэсу распрацоўкі

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Праблема: нягледзячы на ​​тое, што існуе мноства карысных інструментаў, якія дазваляюць адсочваць праблемы і ацэньваць агульны прагрэс, большасць з іх нельга назваць гнуткімі або аптымальнымі. Інструмент можа быць карысным, захоўваючы камандзе час, які ў звычайнай сітуацыі расходуецца на пытанні і ўдакладненні па канкрэтных задачах. Ён таксама палягчае жыццё мэнэджэрам, даючы ім больш дакладнае разуменне ўсяго праекта.

Задача: стварыць дашборд для адсочвання працэсу выканання задач рознымі чальцамі каманды.

Набор інструментаў

Пасля эксперыментавання з рознымі прыладамі я спыніўся на наступным наборы: Confluence, Jira, Airtable і Abstract. Ніжэй я раскрою перавагі кожнага.

Зліццё

Роля інструмента: інфармацыйны і рэсурсны цэнтр.

Працоўная прастора Confluence адносна проста арганізаваць, у ім ёсць шмат функцый, інтэграцыя з рознымі прыкладаннямі і асобныя наладжвальныя шаблоны. Яго нельга назваць універсальным вырашэннем усіх праблем, але ён ідэальна падыходзіць у якасці інфармацыйнага і рэсурснага цэнтра. Гэта азначае, што любая спасылка або тэхнічная дэталь, якія маюць дачыненне да праекту, павінны быць занесены ў базу.

Інструмент дазваляе правільна задакументаваць кожны кампанент і любыя іншыя падрабязнасці аб праекце.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Асноўная перавага Confluence - настройка шаблонаў дакументаў. Акрамя таго, з яго дапамогай можна рэалізаваць адзінае сховішча спецыфікацый і рознай дакументацыі праекту, падзяліўшы ўзроўні доступу ўдзельнікаў. Цяпер можна не хвалявацца, што ў вас на руках старая версія спецыфікацыі, як здараецца, калі адпраўляць дакументы па электроннай пошце.

Больш інфармацыі пра інструмент даступна на афіцыйным сайце прадукта.

Jira

Роля інструмента: маніторынг праблем і кіраванне задачамі.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Jira - вельмі магутны інструмент планавання і кіравання праектамі. Асноўная частка функцыяналу - стварэнне кастамізаваных працоўных працэсаў. Для таго каб эфектыўна кіраваць задачамі (што нам і патрабуецца), варта звярнуць адмысловую ўвагу на правільнае выкарыстанне тыпу запыту і задачы (issue type).

Так, каб быць сапраўды ўпэўненым у тым, што распрацоўшчыкі ствараюць кампаненты на аснове карэктнага дызайну, іх трэба апавяшчаць кожны раз, калі ў дызайне нешта мяняецца. Як толькі кампанент абнавіўся, дызайнеру трэба адкрыць задачу, прызначыць адказнага распрацоўніка, прысвоіўшы яму карэктны тып задачы.

З Jira можна быць упэўненым, што абсалютна ўсе ўдзельнікі працэсу (нагадаю, іх у нашым выпадку 5-15) атрымліваюць карэктныя задачы, якія не губляюцца і знаходзяць свайго выканаўцу.

Больш падрабязная інфармацыя аб Jira даступная на афіцыйным сайце прадукта.

Airtable

Роля інструмента: кіраванне кампанентамі і дошка прагрэсу.

Airtable уяўляе сабой сумесь электронных табліц і баз дадзеных. Усё гэта дае магчымасць наладзіць працу ўсіх прылад, пра якія ішла гаворка вышэй.

Прыклад 1. Упраўленне кампанентамі

Што да генератара кіраўніцтва па стылі, то карыстацца ім не заўсёды зручна – праблема ў тым, што дызайнеры не могуць яго рэдагаваць. Акрамя таго, не занадта правільным будзе і рашэнне выкарыстоўваць бібліятэку кампанентаў Sketch, бо ў яе шмат абмежаванняў. Хутчэй за ўсё, выкарыстоўваць па-за праграмай гэтую бібліятэку проста не атрымаецца.

Airtable таксама нельга назваць ідэальным, але ён лепш, чым многія іншыя падобныя рашэнні. Вось дэманстрацыйны варыянт шаблону табліцы кіравання кампанентамі:

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Калі распрацоўшчык прымае ў працу дызайн-кампанент, ён ацэньвае атрыманае на аснове ABEM, рэгіструючы кампанент у табліцы. Усяго ў ёй 9 слупкоў:

  • Назва - найменне кампанента паводле прынцыпу ABEM.
  • Папярэдні прагляд - тут размяшчаецца або скрыншот, або малюнак кампанента, загружанае з іншай крыніцы.
  • Звязаная старонка - гэта спасылка на старонку кампанента.
  • Даччыны кампанент - спасылка на даччыныя кампаненты.
  • Мадыфікатар - праверка наяўнасці варыянтаў стылю і вызначэнне іх (напрыклад, актыўны, чырвоны і да т.п.).
  • Катэгорыя кампанента - гэта агульная катэгорыя (тэкст, промамалюнак, бакавая панэль).
  • Статус распрацоўкі - уласна прагрэс распрацоўкі і яго вызначэнне (завершаны, у працэсе і да т.п.).
  • Адказны - распрацоўшчык, які адказвае за гэты кампанент.
  • Атамарны ўзровень - атамарная катэгорыя гэтага кампанента (згодна з канцэпцыяй атамарнага дызайну).
  • Спасылацца на дадзеныя можна ў адной і той жа ці ў розных табліцах. Злучэнне кропак не дасць заблытацца ў выпадку маштабавання. Акрамя таго, дадзеныя можна без праблем фільтраваць, сартаваць і змяняць іх выгляд.

Прыклад 2: прагрэс распрацоўкі старонкі

Для адзнакі прагрэсу распрацоўкі старонкі патрэбен шаблон, які створаны менавіта для гэтай мэты. Табліца можа служыць як для патрэб самой каманды, так і для кліента.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Тут можа быць адзначана любая інфармацыя аб старонцы. Гэта дэдлайн, спасылка на прататып InVision, адрасат, даччыны кампанент. Адразу становіцца прыкметна, што аперацыі выконваць вельмі зручна, што дакранаецца як дакументаванні і абнаўленні дызайну, так і статуту распрацоўкі фронтенда і бэкенда. Прычым гэтыя аперацыі выконваюцца адначасова.

абстрактны

Роля інструмента: адзіная крыніца кантролю версій асэтаў дызайну.

Арганізоўваем эфектыўны працоўны працэс вэб-распрацоўнікаў: Confluence, Airtable і іншыя прылады

Abstract можна назваць GitHub для асэтаў у Sketch, ён ратуе дызайнераў ад неабходнасці капіявання і ўстаўкі файлаў. Асноўная перавага інструмента ў тым, што ён уяўляе сабой сховішча дызайну, якое дзейнічае як «адзіная крыніца ісціны». Дызайнеры павінны абнаўляць галоўную галінку да самага апошняга варыянту зацверджанага макета. Пасля гэтага ім даводзіцца апавяшчаць распрацоўшчыкаў. Тыя, у сваю чаргу, павінны працаваць толькі з дызайнерскімі ассетамі асноўнай галінкі.

У якасці вываду

Пасля таго як мы ўкаранілі новы працэс распрацоўкі і ўсе тыя інструменты, пра якія гаворыцца вышэй, хуткасць нашай працы павялічылася мінімум у два разы. Гэта не ідэальнае рашэнне, але вельмі добрае. Праўда, для таго каб яно працавала, трэба прыкласці нямала намаганняў - патрабуецца "ручная праца" па абнаўленні і падтрыманні ўсяго гэтага ў працаздольным стане.

Skillbox рэкамендуе:

Крыніца: habr.com

Дадаць каментар