Kot front-end razvijalec delam približno dve leti in sem sodeloval pri nastajanju najrazličnejših projektov. Ena od lekcij, ki sem se jih naučil, je, da sodelovanje med različnimi skupinami razvijalcev, ki si delijo isti cilj, a imajo različne naloge in odgovornosti, ni enostavno.
Po posvetovanju z drugimi člani ekipe, oblikovalci in razvijalci sem ustvaril cikel izdelave spletne strani, namenjen majhnim ekipam (5-15 ljudi). Vključuje orodja, kot so Confluence, Jira, Airtable in Abstract. V tem članku bom delil značilnosti organizacije delovnega toka.
Skillbox priporoča: Dvoletni praktični tečaj .
Spomnimo: za vse bralce "Habr" - popust v višini 10 rubljev ob vpisu v kateri koli tečaj Skillbox s promocijsko kodo "Habr".
Zakaj je vse to potrebno?
Minimalna ekipa, ki je potrebna za izdelavo spletnega mesta iz nič, je oblikovalec, programer in vodja projekta. V mojem primeru se je ekipa oblikovala. Toda po izdaji nekaj strani sem dobil občutek, da je nekaj narobe z njim. Včasih preprosto nismo popolnoma razumeli svoje odgovornosti in komunikacija s stranko je pustila veliko želenega. Vse to je upočasnilo proces in motilo vse.
Začel sem delati na rešitvi problema.
Iskanje Google daje dobre rezultate glede našega problema.
Da bi bilo opravljeno delo bolj vizualno, sem ustvaril diagram delovnega toka, ki pojasnjuje, kako delo tukaj poteka.
Kliknite na sliko, da se odpre v polni ločljivosti.
Cilji in cilji
Ena prvih tehnik, ki sem se jo odločil preizkusiti, je bil »kaskadni model« (Slap). Uporabil sem ga za poudarjanje težav in razumevanje, kako jih rešiti.
Težava: Najpogosteje naročnik procesa izdelave spletne strani ne oceni modularno, kot to počnejo razvijalci. Dojema ga kot navadno spletno mesto, torej razmišlja po posameznih straneh. Po njegovem mnenju oblikovalci in programerji ustvarjajo posamezne strani, eno za drugo. Posledično stranka preprosto ne razume, kaj sledi čemu med dejanskim procesom.
Naloga: Naročnika nima smisla prepričevati o nasprotnem, najboljša možnost je razviti modularni proces izdelave spletne strani znotraj podjetja po modelu stran za stranjo.
Žetone in komponente univerzalnega oblikovanja upravljajo tako razvijalci kot oblikovalci.
Težava: To je običajna situacija, ki jo obravnavajo številne strategije. Obstaja veliko zanimivih rešitev, v večini primerov je predlagana izdelava oblikovalskega sistema, ki ga nadzirajo vodnik po slogu / generatorji knjižnice. Toda v naši situaciji dodajanje druge komponente v razvojni proces, ki bi nam omogočila upravljanje ravni dostopa za oblikovalce, preprosto ni bilo mogoče.
Naloga: zgraditi univerzalni sistem, v katerem lahko oblikovalci, razvijalci in menedžerji delujejo sinhrono, ne da bi se med seboj motili.
Natančno sledenje razvoju
Težava: Čeprav je na voljo veliko uporabnih orodij za sledenje težavam in merjenje splošnega napredka, jih večina ni prilagodljiva ali optimalna. Orodje je lahko uporabno, saj ekipi prihrani čas, ki bi ga običajno porabili za vprašanja in pojasnila o določenih nalogah. Prav tako olajša življenje menedžerjem, saj jim omogoča natančnejše razumevanje celotnega projekta.
Naloga: ustvarite nadzorno ploščo za spremljanje napredka nalog, ki jih izvajajo različni člani ekipe.
Set orodij
Po eksperimentiranju z različnimi orodji sem se odločil za naslednji sklop: Confluence, Jira, Airtable in Abstract. Spodaj bom razkril prednosti vsakega.
Sotočje
Vloga orodja: središče informacij in virov.
Delovni prostor Confluence je razmeroma enostaven za nastavitev, ima veliko funkcij, integracij z različnimi aplikacijami in ima posamezne, prilagodljive predloge. To ni rešitev, ki bi ustrezala vsem, vendar je idealna kot središče informacij in virov. To pomeni, da je treba vse reference ali tehnične podrobnosti v zvezi s projektom vnesti v bazo podatkov.
Orodje vam omogoča pravilno dokumentiranje vsake komponente in vseh drugih podrobnosti o projektu.
Glavna prednost Confluence je prilagajanje predlog dokumentov. Poleg tega se lahko uporablja za izvedbo enotnega repozitorija specifikacij in različne projektne dokumentacije, ki ločuje ravni dostopa udeležencev. Zdaj vam ni več treba skrbeti, da imate pri roki staro različico specifikacije, kot se zgodi, ko dokumente pošiljate po e-pošti.
Več informacij o orodju .
Jira
Vloga orodja: spremljanje problemov in upravljanje nalog.
Jira je zelo zmogljivo orodje za načrtovanje in upravljanje projektov. Glavni del funkcionalnosti je ustvarjanje prilagodljivih delovnih tokov. Za učinkovito obvladovanje problemov (kar potrebujemo) je vredno posebno pozornost nameniti pravilni uporabi tipa zahteve in tipa problema (Issue type).
Torej, da bi zagotovili, da razvijalci gradijo komponente na podlagi pravilne zasnove, morajo biti obveščeni vsakič, ko se kaj spremeni v zasnovi. Takoj ko je komponenta posodobljena, mora oblikovalec odpreti problem, dodeliti odgovornega razvijalca in mu dodeliti pravilno vrsto problema.
Z Jiro ste lahko prepričani, da absolutno vsi udeleženci v procesu (naj vas spomnim, v našem primeru jih je 5–15) prejmejo pravilne naloge, ki se ne izgubijo in najdejo svojega izvajalca.
Več o Jiri .
Airtable
Vloga orodja: upravljanje komponent in tabela napredka.
Airtable je mešanica preglednic in baz podatkov. Vse to omogoča prilagoditev delovanja vseh zgoraj obravnavanih orodij.
Primer 1: Upravljanje komponent
Kar se tiče generatorja slogovnih vodnikov, ni vedno priročno uporabljati - težava je v tem, da ga oblikovalci ne morejo urejati. Poleg tega ne bi bila dobra odločitev za uporabo knjižnice komponent Sketch, saj ima veliko omejitev. Najverjetneje te knjižnice preprosto ne boste mogli uporabljati zunaj programa.
Tudi Airtable ni popoln, vendar je boljši od mnogih drugih podobnih rešitev. Tukaj je predstavitev predloge tabele za upravljanje komponent:
Ko razvijalec sprejme komponento oblikovanja, ovrednoti nastali ABEM tako, da komponento zapiše v tabelo. Skupaj je 9 stolpcev:
- Ime - ime komponente po principu ABEM.
- Predogled – tukaj je posnetek zaslona ali slika komponente, ki je bila prenesena iz drugega vira.
- Povezana stran je povezava do strani komponente.
- Podrejena komponenta - povezava do podrejenih komponent.
- Modifikator - preveri prisotnost slogovnih možnosti in jih definira (na primer aktivno, rdeče itd.).
- Kategorija komponente je splošna kategorija (besedilo, promocijska slika, stranska vrstica).
- Status razvoja - dejanski napredek razvoja in njegova opredelitev (končano, v teku itd.).
- Odgovoren - razvijalec, ki je odgovoren za to komponento.
- Atomska raven je atomska kategorija te komponente (v skladu s konceptom atomske zasnove).
- Na podatke se lahko sklicujemo v isti ali v različnih tabelah. Povezovanje pik bo preprečilo zmedo pri skaliranju. Poleg tega je mogoče podatke brez težav filtrirati, razvrščati in spreminjati.
Primer 2: napredek pri razvoju strani
Če želite oceniti napredek razvoja strani, potrebujete predlogo, ki je ustvarjena posebej za ta namen. Miza lahko služi tako potrebam same ekipe kot naročnika.
Vse informacije o strani lahko označite tukaj. To je rok, povezava do prototipa InVision, cilj, podrejena komponenta. Takoj postane opazno, da so operacije zelo priročne za izvajanje, tako glede dokumentiranja in posodabljanja zasnove kot tudi statusa front-end in back-end razvoja. Poleg tega se te operacije izvajajo hkrati.
Minimalizem
Vloga orodja: en sam vir nadzora različic za oblikovalska sredstva.
Povzetek lahko imenujemo GitHub za sredstva v Sketchu in oblikovalcem prihrani kopiranje in lepljenje datotek. Glavna prednost orodja je, da ponuja repozitorij oblikovanja, ki deluje kot »en sam vir resnice«. Oblikovalci morajo glavno vejo posodobiti na najnovejšo različico odobrene postavitve. Po tem morajo obvestiti razvijalce. Ti pa bi morali delati samo z oblikovalskimi sredstvi iz glavne veje.
Kot zaključek
Po uvedbi novega razvojnega procesa in vseh zgoraj omenjenih orodij se je hitrost našega dela vsaj dvakrat povečala. Ni popolna rešitev, je pa zelo dobra. Res je, da bi delovalo, se morate zelo potruditi - potrebno je "ročno delo", da posodobite in vzdržujete vse v delovnem stanju.
Skillbox priporoča:
- Praktični tečaj .
- Spletni tečaj .
- Praktični enoletni tečaj .
Vir: www.habr.com