Parem veebiarenduse töövoog: Confluence, Airtable, Jira ja Abstract

Confluence, Jira, hõlbus ja abstraktne

中文 版 連結 (hiina versioon) / algselt postitatud saidile vinceshao.com

Töötades pea kaks aastat eesliidena arendajana, olen saanud kasulikke kogemusi, kui olen osalenud mitmetes disaini / digitaalagentuuride veebiarendusprojektides.

Üks ilmne, kuid väärtuslik õppetund, mille olen õppinud, on see, et iga grupi koostöö ühe eesmärgi nimel, kuid selgelt eristatavad kohustused ja eesmärgid pole lihtne. Koostöös on erinevaid aspekte ja raskuste tasemeid ning nende konkreetseks osaks, mida ma siinkohal käsitleksin, on töövoo protsess.

Koostasin oma kogemuste põhjal ja disainerite ning arendajasõprade abiga väikesele meeskonnale (5–15 inimest) mõeldud veebisaidi arendamise töövoo. Süsteem koosneb Confluence, Jira, Airtable ja Abstract. Selles artiklis jagan selle töövoo põhjused ja kuidas.

Uue töövoo ehitamise motivatsioon

Kohandatud veebisaidi edastamiseks ilma veebisaidi ehitajate pakutavaid malle kasutamata hõlmavad minimaalsed talendinõuded disainerit, arendajat ja projektijuhti. Pärast paaril juhtumil osalemist oli mul tunne, et meie tööprotsessis oli midagi valesti: oluline teave ei olnud alati joondatud nii sisemiselt erinevate rollide vahel kui ka väliselt kliendi jaoks. See ebaefektiivne suhtlus aeglustas selgelt arendustsüklit ja tegi meeskonnale haiget.

Nii et ma hakkasin seda probleemi lahendama.

Google'i otsingu töövoo suurepärased ressursid: kujundamissüsteemide funktsioonid, stiilijuhendi ressursid ja töövoo määratlus

I Google otsis ressursse töövoo loomise ja parendamise kohta. Ehkki õppisin paljudest suurepärastest ressurssidest palju, ei leidnud ma neist ühtegi disaini / digitaalagentuuri veebiarendusprojektide jaoks. See oli kas disainisüsteem või kodeerimisjuhised, mis ulatusid disaini või esiotsa rollidesse, või töövoog, mis loodi meeskonna jaoks, kellel on oma toode.

Selle tulemusel otsustasin valida probleemide lahendamiseks vajalikke osi ja moodustasin veebisaidi arendamiseks kohandatud töövoo.

Probleemid ja eesmärgid

Järgnevalt on toodud probleemid, mida kontrollisin meie olemasoleva töövoo järgi, ja vastavad parandamise eesmärgid:

1. Jugametoodika

jugamudeli abstraktne demo

Probleem: tuginedes minu kogemustele, kasutavad veebisaidiprojektid juga-lähenemist, kuna klientidel puudub minimaalse elujõulise toote kontseptsioon. Selle asemel, et jagada funktsioonid vaadete ja moodulite vahel, kipuvad kliendid mõtlema saidile traditsioonilisel lehekülgede kaupa, mis sunnib nii kujundajaid kui ka arendajaid töötama lehekülgede kaupa järjest. Seetõttu kaotavad nad kogu projekti universaalse perspektiivi. Selle olukorra tulemuseks on palju edasi-tagasi ülearuseid muudatusi lehekülgede vahel.

Eesmärk: klientide mõtteviisi muutmine on ühtaegu ülbe ja ebareaalne. Eesmärk on leida viis, kuidas eraldada nõuded vaadetest nii kiiresti kui võimalik ja töötada võimalikult sisemiselt välja, lähtudes lehe-lehe mudelist.

2. Universaalsed disainimärgid ja komponendid, mida haldavad nii disainerid kui ka arendajad

Designformi kaubamärgid firmalt Salesforce

Probleem: see on tavaline probleem, millele on paljudes artiklites jagatud suurepäraseid lahendusi, milles enamasti pakutakse välja kujundussüsteemi loomine, mida haldavad stiilijuhendid / raamatukogugeneraatorid. Kuigi see on suurepärane lahendus, ei olnud meie olukorras asjakohane täiendava saidi haldamine, mis andis disaineritele vaevalt redigeerimise loa.

Eesmärk: välja arvatud universaalsete disainimärkide ja keelte loomiseks, millest kõik saavad aru nii disainerid, arendajad kui ka juhid, luua süsteem, mis võimaldab kõigil vara sünkroonselt hallata.

3. Täpne ja ajakohastatud juhtpaneel

vajame redigeeritavat ja juurdepääsetavat progressi juhtpaneeli

Probleem: kuigi väljaannete jälgijad, kanban ja muud projektihaldusmudelid on kasulikud ja praktilised, ei suutnud enamik neist toimida sirgjoonelise, paindliku ja sõbraliku edasiliikumise armatuurlauana. Selline armatuurlaud säästaks meeskonda palju aega, kuna see takistaks meeskonnaliikmetel aktiivselt teatamast või küsimas konkreetsete ülesannete hetkeolukorra kohta. See teeb juhtide elu lihtsamaks ka siis, kui neil on kogu projekti kohta selged teadmised ilma liigsete pingutusteta.

Eesmärk: looge armatuurlaua süsteem, mis annab konkreetsete ülesannete eest vastutavatele isikutele muutmisloa.

Töövoo skeem

Enne kui hakkame haldustööriistade virna üksikasjalikult tutvustama, heidame pilgu minu korraldatud abstraktsele lihtsustatud töövoole. See on üsna lihtsalt tavalise töövoo visualiseerimine, mis enamikul agentuuridel on, kuid siinkohal tuleb märkida kahte punkti.

kujundasin töövoo skeemi

1. Arendaja hinnang

Esiteks, kui haldur kiidab heaks ja dokumenteerib kliendilt tulenevad nõuded või probleemid, välja arvatud ülesande saatmine kujundajale, lähevad nad ka arendajale hindamiseks. Selle protsessi käigus vaatab arendaja läbi ülesande spetsifikatsiooni ja kontrollib, kas selles on mõni üsna keeruline funktsioon või funktsioon. Kui see on positiivne, võib arendaja sellega tegelema hakata või teavitada disainerit võimalikest probleemidest eelnevalt.

2. Üks tõeallikas

Pange tähele ka seda, et pärast seda, kui klient on disainilahenduse heaks kiitnud ja enne ülesande arendajale üleandmist, läbib see disainerite poolt registreerimise / muutmise / kustutamise protsessi üle disainipoe. Selle põhjuseks on asjaolu, et arendaja peaks alati kokku puutuma ühe ja ainult ühe disainipoe allikaga, mis sisaldab pidevalt hooldatud ja ajakohastatud arendamiseks vajalikke varasid.

Nüüd saame sukelduda minu ettevalmistatud haldustööriistade virna ja vaadata, kuidas need tööriistad aitavad meil probleeme lahendada.

Tööriistad virnavad

Pärast turul pakutavate erinevate võimalustega katsetamist koosneb siin pakutav virn Confluence'ist, Jira'st, Airtable'ist ja Abstract'ist. Lisaks põhitutvustusele ja mõnele peamisele rakenduse näitele ei kata ma kõiki tööriistade kasutamise üksikasju.

aatomikujundus ja ABEM

Märkus: süsteem eeldab, et arendusmeeskond võtab vastu aatomikujunduse metoodika ja ABEM-nimesüsteemi.

1. Koosmõju

Roll: teabe- ja ressursikeskus

Ehkki see on alguses hirmutav, pakub Confluence võimsa tööruumi, mida on lihtne korraldada, ning sellel on palju funktsioone, rakenduste integreerimine ja kohandatud mallid. See pole kindlasti kõigi probleemide universaalne lahendus, kuid sobib ideaalselt spetsifikatsioonide, nõuete, koosolekute märkuste ja muu dokumenteerimiseks.

Seetõttu toimib selle virna Confluence teabe- ja ressursikeskusena, mis tähendab, et kõik seotud lingid ja üksikasjad selle projekti kohta peaksid olema siin korralikult dokumenteeritud.

Minu lemmik eelis Confluence'is on võimalus kohandada dokumendimalle. See funktsioon muudab töövoo standardimise tõeliselt mugavaks.

arendaja hindamisetapp

Näide: komponendi funktsionaalsuse ülevaade

Mainisin ülalpool arendaja hindamisprotsessi, mis on tegelikult keeruline töö. Selle põhjuseks on asjaolu, et see protsess sisaldab komponendi põhiteavet, arendaja FSM-i ülevaadet (vajadusel), KKK-ruumi ja palju muud. Kuid malli ja tööriistade paindlikkus, mida Confluence pakub, muudab selle ülilihtsaks. Ehitage lihtsalt mall konfiguratsiooniseadetes ja teil on hea minna.

kohandatud mall komponentide ülevaatamiseks rakenduses Confluence

2. Jira

Roll: probleemide jälgimine ja toimingutüübi haldamine

Samuti Atlassiani perekonna liige, Jira on ülivõimas probleemide jälgimise ja projektide kavandamise tarkvara. Minu lemmik osa sellest on kohandatud väljaannete töövoogude tegemine. Kuna Jira võimsuse kasutamiseks on palju suurepäraseid õpetusi, siis tahan siin ainult välja tuua allpool nimetatud väljaande tüübi kasutamise.

disainerite värskenduste disainipood

Näide: värskendage arendajat disainiladude muudatuste osas väljaande tüübi järgi

Tagamaks, et arendajad ehitavad komponente õigete kujundusvaadete alusel, tuleb neid teavitada igast värskendusest disainipoes, mis hõlmab selliseid toiminguid nagu registreerimine, muutmine ja kustutamine. Komponendi värskendamisel peaks disainer avama probleemi määratud vastutavale arendajale ja valima õige väljaande / toimingu tüübi.

Jira väljaandetüüpide funktsioon

3. Liigitav

Roll: komponentide haldamine ja progressi armatuurlaud

Airtable, arvutustabeli ja andmebaasi segu, on asi, mis paneb selle virna tööle. Minu töövoogu toetavad kaks hämmastavat funktsiooni: neli tüüpi vaate üleminek ühes tabelis ja sellega seotud sisu linkimine. Toon siin kaks näidet nende kahe funktsiooni kasutamisest.

arendaja alustab ülesande kallal tööd

Näide 1: Komponentide haldamine

Kuidas oma komponentide teeki haldate? Valisime stiilijuhendi generaatori mittekasutamise, kuna disainerid ei saa seda redigeerida. Komponendi Sketch teegi kasutamine polnud samuti sobiv, kuna sellel on liiga palju piiranguid, kui proovime seda kasutada väljaspool tarkvara enda ulatust.

Ma ei ütleks, et Airtable on täiuslik lahendus, kuid see on lihtsaim ja paindlikum variant, mida ma võiksin mõelda. Siit leiate ülevaate komponentide haldustabelist demonstreeritava malli kohta:

komponentide tabel

Kui arendajale on esitatud värskelt registreeritud disainivaade, mis on valmis programmiliselt arendamiseks, hindavad nad vaate ABEM-i süsteemi alusel ja registreerivad selle tabelisse. Tabelis on 9 veergu, sealhulgas:

1. Nimi: komponendi nimetamine ABEM põhimõttel

2. Eelvaade: komponendi ekraanipilt või eksporditud pilt

3. Lingitud leht: link lehele sisaldab seda komponenti

4. Laste komponent: link laste komponentide juurde sisaldab seda

5. Modifikaator: kontrollib, kas stiilimuutusi on (nt: - aktiivne, - punane)

6. Komponentide kategooria: kategooria üldine klassifikatsioon (nt tekst, kangelane, külgriba)

7. Arenguseisund: arenduse edenemise staatus (ootel, määratud, pooleli, täielik, läbivaatamisel)

8. Omandaja: selle komponendi eest vastutav arendaja

9. Aatomitase: selle komponendi aatomi kategooria (aatom, molekul, organism)

Parim on see, et saate viidata andmetele nii ühes kui ka teises tabelis. See punktide ühendamine hoiab ära selle, et skaala kasvades muutuvad asjad segasemaks. Pange tähele, et saate vaateid hõlpsalt filtreerida, sorteerida ja muuta.

Näide 2: lehe arendamise olek

Kuna siin eeldatakse, et hindame arenduse edenemist paratamatult lehekülgede kaupa, on selleks vajalik tabelimall vajalik. See tabel võib olla mõlema sisemise meeskonna edasiliikumise armatuurlaud ja seda saab samal ajal klientidega jagada.

leheküljeloendi tabel

Igasugust teavet lehe kohta, sealhulgas tähtaega, InVisioni prototüübi linki, volitajat ja lastekomponenti, saab siin korraldada. Pange tähele, et disaini-, kasutaja- ja tagavara arenduse olekut on korraga mugav dokumenteerida ja värskendada.

4. Kokkuvõte

Roll: tõe allikas ja disainivara versiooni kontroll

Kokkuvõte on Sketchi varade jaoks mõeldud GitHub, mis päästab disainerid failide kopeerimise ja kleepimise põrgust. Selle artikli reguleerimisalast välja jääb versioonikontrolli voo üksikasjade demonstreerimine. Võtmeks on siin see, et Abstract on disainiladu, mis toimib ainsa tõeallikana. Disainerid peaksid põhiosa värskendama kinnitatud disaini uusimale versioonile ja teavitama sellest siis arendajaid. Teisest küljest peaksid arendajad võtma disainilahendusi vaid põhialana.

Abstraktne haru mall

Veel tuleb ära teha

Minu enda kogemusest on kogu projekti väljatöötamine pärast selle uue töövoo vastuvõtmist olnud vähemalt kaks korda kiirem kui varem. See ei ole täiuslik lahendus, kuna selle värskendamiseks ja hooldamiseks on vaja veel palju käsitsi tööd.

Kuid ma arvan, et see võib olla kasulik viide veebisaitide arendusmeeskondadele, kes otsivad paremat töövoogu ja loodetavasti saab tulevikus rohkem inimesi oma töövooge jagada!