Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Lucrez ca dezvoltator front-end de aproximativ doi ani și am participat la crearea unei game largi de proiecte. Una dintre lecțiile pe care le-am învățat este că colaborarea între diferite echipe de dezvoltatori care împărtășesc același scop, dar au sarcini și responsabilități diferite nu este ușoară.

În consultare cu alți membri ai echipei, designeri și dezvoltatori, am creat un ciclu de creare a site-ului web conceput pentru echipe mici (5-15 persoane). Include instrumente precum Confluence, Jira, Airtable și Abstract. În acest articol voi împărtăși caracteristicile organizării fluxului de lucru.

Skillbox recomandă: Curs practic de doi ani „Sunt un dezvoltator web PRO”.

Amintim: pentru toți cititorii „Habr” - o reducere de 10 de ruble la înscrierea la orice curs Skillbox folosind codul promoțional „Habr”.

De ce este nevoie de toate acestea?

Echipa minimă necesară pentru a crea un site web de la zero este un designer, programator și manager de proiect. În cazul meu s-a format echipa. Dar după lansarea a câteva site-uri, am avut senzația că ceva nu este în regulă cu el. Uneori pur și simplu nu ne înțelegeam pe deplin responsabilitățile, iar comunicarea cu clientul lăsa mult de dorit. Toate acestea au încetinit procesul și au deranjat pe toată lumea.

Am început să lucrez la rezolvarea problemei.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente
O căutare pe Google dă rezultate bune la problema noastră.

Pentru a face munca realizată mai vizual, am creat o diagramă a fluxului de lucru care oferă o înțelegere a modului în care se face munca aici.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente
Faceți clic pe imagine pentru a deschide la rezoluție maximă.

Obiectivele și obiectivele

Una dintre primele tehnici pe care am decis să le testez a fost „modelul în cascadă” (Cascada). L-am folosit pentru a evidenția problemele și pentru a înțelege cum să le rezolv.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Problemă: Cel mai adesea, clientul nu evaluează modular procesul de creare a site-ului web, așa cum o fac dezvoltatorii. El îl percepe ca pe un site obișnuit, adică gândește în termeni de pagini individuale. În opinia sa, designerii și programatorii creează pagini individuale, una după alta. Ca urmare, clientul pur și simplu nu înțelege ce urmează în timpul procesului propriu-zis.

Sarcină: Nu are rost să convingi clientul de altfel; cea mai bună opțiune este dezvoltarea unui proces modular de creare a unui site web în cadrul companiei pe baza unui model pagină cu pagină.

Jetoanele și componentele de design universal sunt gestionate atât de dezvoltatori, cât și de designeri.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Problemă: Aceasta este o situație comună pe care o abordează multe strategii. Există multe soluții interesante, în cele mai multe cazuri se propune crearea unui sistem de design care să fie controlat de un ghid de stil/generatoare de bibliotecă. Dar în situația noastră, adăugarea unei alte componente în procesul de dezvoltare care ne-ar permite să gestionăm nivelurile de acces pentru designeri pur și simplu nu a fost posibilă.

Sarcină: construirea unui sistem universal în care designerii, dezvoltatorii și managerii să poată lucra sincron fără a interfera unul cu celălalt.

Urmărirea precisă a dezvoltării

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Problemă: deși există multe instrumente utile disponibile pentru a urmări problemele și a măsura progresul general, majoritatea nu sunt flexibile sau optime. Instrumentul poate fi util prin economisirea timpului echipei care ar fi cheltuit în mod normal cu întrebări și clarificări privind sarcinile specifice. De asemenea, ușurează viața managerilor, oferindu-le o înțelegere mai precisă a întregului proiect.

Sarcină: creați un tablou de bord pentru a urmări progresul sarcinilor efectuate de diferiți membri ai echipei.

trusa de scule

După ce am experimentat cu diferite instrumente, m-am așezat pe următorul set: Confluence, Jira, Airtable și Abstract. Mai jos voi dezvălui beneficiile fiecăruia.

confluență

Rolul instrumentului: centru de informații și resurse.

Spațiul de lucru Confluence este relativ ușor de configurat și are o mulțime de funcții, integrare cu diferite aplicații și șabloane individuale, personalizabile. Nu este o soluție unică, dar este ideală ca centru de informații și resurse. Aceasta înseamnă că orice referință sau detaliu tehnic legat de proiect trebuie introdus în baza de date.

Instrumentul vă permite să documentați în mod corespunzător fiecare componentă și orice alte detalii despre proiect.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Principalul avantaj al Confluence este personalizarea șabloanelor de documente. În plus, poate fi folosit pentru a implementa un singur depozit de specificații și diverse documentații de proiect, separând nivelurile de acces ale participanților. Acum nu trebuie să vă faceți griji că aveți o versiune veche a specificației la îndemână, așa cum se întâmplă atunci când trimiteți documente prin e-mail.

Mai multe informații despre instrument disponibil pe site-ul oficial al produsului.

JIRA

Rolul instrumentului: monitorizarea problemelor și managementul sarcinilor.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Jira este un instrument de planificare și management de proiect foarte puternic. Partea principală a funcționalității este crearea de fluxuri de lucru personalizabile. Pentru a gestiona eficient problemele (care este ceea ce avem nevoie), merită să acordăm o atenție deosebită utilizării corecte a tipului de cerere și a tipului de problemă (tipul de problemă).

Deci, pentru a vă asigura că dezvoltatorii construiesc componente pe baza designului corect, aceștia trebuie să fie notificați de fiecare dată când ceva se schimbă în design. De îndată ce componenta este actualizată, designerul trebuie să deschidă o problemă, să desemneze un dezvoltator responsabil, atribuindu-i tipul corect de problemă.

Cu Jira, puteți fi sigur că absolut toți participanții la proces (permiteți-mi să vă reamintesc, în cazul nostru sunt 5-15 dintre ei) primesc sarcini corecte care nu se pierd și își găsesc executorul.

Aflați mai multe despre Jira disponibil pe site-ul oficial al produsului.

Airtable

Rolul instrumentului: managementul componentelor și panoul de progres.

Airtable este un amestec de foi de calcul și baze de date. Toate acestea fac posibilă personalizarea funcționării tuturor instrumentelor discutate mai sus.

Exemplul 1: Managementul componentelor

În ceea ce privește generatorul de ghiduri de stil, nu este întotdeauna convenabil de utilizat - problema este că designerii nu îl pot edita. În plus, nu ar fi o decizie bună să folosiți biblioteca de componente Sketch, deoarece are multe limitări. Cel mai probabil, pur și simplu nu veți putea folosi această bibliotecă în afara programului.

Nici Airtable nu este perfect, dar este mai bun decât multe alte soluții similare. Iată o demonstrație a șablonului Tabel de gestionare a componentelor:

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Când un dezvoltator acceptă o componentă de proiectare, el evaluează ABEM rezultat prin înregistrarea componentului într-un tabel. Sunt 9 coloane în total:

  • Nume - denumirea componentei conform principiului ABEM.
  • Previzualizare - Aici este plasată fie o captură de ecran, fie o imagine a componentei descărcate din altă sursă.
  • O pagină legată este un link către pagina unei componente.
  • Componentă copil - o legătură către componentele copil.
  • Modificator - verifică prezența opțiunilor de stil și le definește (de exemplu, activ, roșu etc.).
  • Categoria componente este o categorie generală (text, imagine promoțională, bară laterală).
  • Starea dezvoltării - progresul real al dezvoltării și definiția acestuia (finalizat, în curs etc.).
  • Responsabil - dezvoltatorul care este responsabil pentru această componentă.
  • Nivelul atomic este categoria atomică a acestei componente (conform conceptului de proiectare atomică).
  • Datele pot fi referite în același sau în tabele diferite. Conectarea punctelor va preveni confuzia la scalare. În plus, datele pot fi filtrate, sortate și modificate fără probleme.

Exemplul 2: progresul dezvoltării paginii

Pentru a evalua progresul dezvoltării paginii, aveți nevoie de un șablon care este creat special pentru acest scop. Masa poate servi atât nevoilor echipei în sine, cât și ale clientului.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Orice informație despre pagină poate fi marcată aici. Acesta este un termen limită, o legătură către prototipul InVision, o destinație, o componentă copil. Devine imediat vizibil că operațiunile sunt foarte convenabile de efectuat, atât în ​​ceea ce privește documentarea și actualizarea designului, cât și starea dezvoltării front-end și back-end. Mai mult, aceste operații sunt efectuate simultan.

Abstract

Rolul instrumentului: o sursă unică de control al versiunilor pentru elementele de proiectare.

Organizăm un flux de lucru eficient pentru dezvoltatorii web: Confluence, Airtable și alte instrumente

Abstract poate fi numit GitHub pentru activele din Sketch și îi scutește pe designeri de a fi nevoiți să copieze și să lipească fișiere. Principalul avantaj al instrumentului este că oferă un depozit de design care acționează ca o „sursă unică de adevăr”. Designerii trebuie să actualizeze ramura principală la cea mai recentă versiune a aspectului aprobat. După aceea, ei trebuie să notifice dezvoltatorii. Aceștia, la rândul lor, ar trebui să funcționeze numai cu active de proiectant din ramura principală.

Drept concluzie

După ce am implementat noul proces de dezvoltare și toate instrumentele menționate mai sus, viteza muncii noastre a crescut de cel puțin două ori. Nu este o soluție perfectă, dar este una foarte bună. Adevărat, pentru ca acesta să funcționeze, trebuie să depuneți mult efort - necesită „lucrare manuală” pentru a actualiza și a menține totul în stare de funcționare.

Skillbox recomandă:

Sursa: www.habr.com

Adauga un comentariu