Deveniți un dezvoltator mai bun, mai rapid din față

Deci, sunteți deja un dezvoltator de web minunat.

Aveți niște ciuperci CSS (un browser încrucișat chiar), probabil că ați fost un expert în Photoshop de ani de zile și aveți destule cunoștințe jQuery pentru a face aproape orice animație înlănțuită să meargă fără probleme.

Dar cu siguranță vă întrebați, ce urmeaza?

De fapt, una dintre întrebările cele mai întrebate despre dezvoltarea web-ului este "cum stau pe marginea de vârf?" Chris Coyier a prezentat recent o discuție fantastică pe această temă și există site-uri dedicate în totalitate pentru a rămâne la curent cu ultimele știri de web design. Adunarea lui Osmani pentru a deveni un inginer de front-end, pune un conținut extraordinar pe bord pentru a vă gândi la subiect; e nevoie să spun că o mulțime de oameni inteligenți se gândesc la acest subiect, deci te îndrepți în direcția cea bună.

Imagine de Fundal gratis de Space Ghost, de Mads Frantzen

În acest articol, vom vorbi despre o modalitate foarte importantă de a vă separa și de a deveni un dezvoltator mai bun: a deveni un eficace dezvoltator de interacțiune rapidă.


Ce este "dezvoltarea rapidă a interacțiunii?"

Dezvoltarea rapidă a interacțiunii este un termen pe care îl folosim astăzi pentru a descrie practica creării rapide a unor elemente pentru web pe care un utilizator le poate interacționa, în special cu intenția de a repeta rapid și de a lustrui interacțiunea. Nu este același lucru cu proiectarea documentelor plate; în schimb, aceasta include construirea unui element care are unul sau mai multe sublinieri ale interacțiunii.

Aceasta poate include, de exemplu, un widget pe care utilizatorul îl poate tasta și căuta sau un meniu derulant care permite unui utilizator să selecteze un element de submeniu. Aceste piese interactiv sunt elementele de bază ale unei povestiri mai mari a experienței depline a utilizatorului de a folosi un site web și, prin urmare, ele sunt incredibil de importante pentru a putea trece prin și "simți". La proiectarea unui site web, aceste interacțiuni pot provoca sau întrerupe experiența utilizatorului și, prin urmare, ar putea să facă sau să spargă eficacitatea site-ului în ansamblu.

Interacțiunile nu au întotdeauna bucăți "în mișcare"; de fapt, dezvoltarea rapidă a interacțiunii se bazează adesea pe ierarhiile de conținut și pe hiperlegăturile la fel de mult ca orice altceva. Dezvoltarea interacțiunii ia în considerare interacțiunea deplină a omului cu computerul, încorporând intuiții despre baza de utilizare, înțelegerea fundamentală a factorilor umani și cunoașterea mesajului și a imaginii organizației sau a persoanei reprezentate de interacțiunea.


Înțelegerea valorii dezvoltării rapide a interacțiunii

Dacă mă angajez pe un dezvoltator web de front-end (sau pe oricine pentru asta), mă voi gândi la cinci lucruri primare.

  1. Personalitatea lor se potrivește echipei mele?
  2. Sunt talentați?
  3. Sunt eficiente?
  4. Sunt consecvente?
  5. Pot să le plătesc în mod corespunzător?

Aceste întrebări sunt extrem de importante pentru orice parte a procesului de angajare. Prima întrebare este, de obicei, decisă pe baza chimiei interacțiunii - nu este ceva ce vom acoperi în acest articol. Cea de-a cincea este de obicei decisă de la caz la caz și este, de asemenea, ceva care nu se încadrează în domeniul de aplicare al acestui articol. Cu toate acestea, atunci când răspundem la celelalte trei întrebări, doi factori primari joacă în judecată: viteză și acuratețea. În cazul dezvoltatorului web, dezvoltarea rapidă a interacțiunii este o modalitate de a dovedi că ați luat foarte mult în serios ambarcațiunile de dezvoltare a interacțiunii.

Dezvoltarea interacțiunii rapide nu este afectată în mod accidental de o mută lovitură (cum ar fi cazul unui grad de artă mai mare). În schimb, dezvoltarea rapidă a interacțiunii este o abilitate care este îmbunătățită de dezvoltator. Această abilitate dovedește eficiență și talent și dă mai multă încredere în capacitatea dezvoltatorilor de a obține coerență. Pentru a putea dezvolta rapid interacțiuni, dezvoltatorul trebuie să aibă cele două ingrediente magice: viteză și precizie.

O avertizare: Este posibil ca cineva să fie angajat pentru că, deși nu sunt la fel de talentați ca un alt individ, ei sunt extrem de consecvenți și au o mare personalitate. Acest lucru nu este în nici un caz un "ghid pentru a obține un loc de muncă ca dezvoltator".


Să mergem mai departe cu ea?

Având în vedere importanța dezvoltării rapide a interacțiunii, acum putem înțelege cum puteți imediat începe să perfecționeze această abilitate. Unele dintre aceste sfaturi iau o simplă schimbare în modul de gândire, în timp ce altele iau o investiție de învățare sau schimbare de tipar. Cu toate acestea, toate acestea vă pot ajuta să deveniți un dezvoltator web mai bun, mai rapid și mai valoros.


Optimizați-vă modelele

Ați adoptat un cadru CSS? Dacă da, atunci înțelegeți valoarea codului reutilizabil. Probabil ați adoptat modele fără a le realiza. Pentru a dovedi acest lucru, întrebați-vă "când încep să construiesc un site web, care este primul meu pas?" Dacă răspunsul dvs. este "Nu știu", atunci este timpul să vă dați seama. Dacă răspunsul dvs. este "mai întâi deschid editorul de text", atunci ați adoptat cel puțin un pas într-un model.

Deci, cum optimizați un model? Acestea sunt deseori denumite fluxuri de lucru, dar aceasta nu este o descriere adecvată, deoarece fluxul de lucru nu include tot ce vrem să vorbim aici. Unele instrumente comune care vă ajută să vă structurați modelul sunt "cadrele" CSS și JS, cum ar fi Twitter Bootstrap, Foundation sau Topcoat ...


... instrumente de preprocesare ca SASS sau mai puțin ...


... probabil optimizare completă și instrumente de procesor cum ar fi CodeKit ...


... teme de pornire Wordpress precum Bones, și chiar opțiunea de a construi scripturi personalizate alimentate de o linie de comandă. Dacă sunteți un dezvoltator JavaScript mai avansat și doriți să vă mutați într-un spațiu nou, trebuie să vă gândiți să vă uitați la Backbone, Ember și alte cadre JavaScript (MVC-oriented JavaScript) [http://todomvc.com/]; ar fi, de asemenea, recomandat să se uite în Node, care împuternicește server-side JavaScript. Ar putea să vă ducă ceva timp, însă luarea și învățarea unora dintre aceste instrumente crește cu siguranță productivitatea pe termen lung.

Recomandare: decide cu privire la un tip de document HTML / boilerplate / document reutilizabil "index.html" și structura asociată a fișierelor care urmează convenții acceptate în mod obișnuit, este construită cu marcaj semantic și dă un "martor gol" pentru a lucra (gândiți-vă: HTML5 Boilerplate). Poate că, dacă lucrați în primul rând cu Wordpress sau un alt instrument, ați dori să găsiți o boilerplate similară cu funcționalitate de bază pentru acel instrument.

Dacă sunteți un pic mai avansat, ridicați niște abilități Yeoman pentru schele de proiectare rapidă și generație bazată pe experimente bazate pe experți. Decideți pe un cadru CSS și / sau JS (Bootstrap, Foundation, Topcoat) și începeți să utilizați un preprocesor pentru CSS mai devreme decât mai târziu. Învățarea unui preprocesor merită investiția în timp și nu va reduce productivitatea, deoarece LESS și SASS pot manipula ambele CSS de vanilie. Încercați să construiți o schemă completă de tip wireframe complet cu clasele integrate ale cadrului. Veți fi surprins probabil cât de puțin cod aveți nevoie pentru a scrie pentru a face un aspect funcțional să se întâmple foarte repede. Acest lucru reduce costurile generale de scriere a codului repetitiv și, de asemenea, are avantajul suplimentar de a trage de la testări mult mai extinse și considerațiile încrucișate ale browserului decât o singură persoană poate face singură.


Lucrați cu ceea ce știți; În mod intenționat, învățați ce nu faceți.

Este absolut important să adoptați a stilul de viață al învățării ca dezvoltator. Adoptarea de noi instrumente și abilități, cum ar fi cele discutate mai sus, face parte din viața de sânge a oricărui dezvoltator de succes. Tehnologia pe care o folosim în fiecare zi se schimbă mai repede decât orice altceva; pentru a rămâne la sau deasupra locului nostru actual din industrie, este imperativ să învățăm în mod continuu.

Dar - este la fel de important să înțelegem acest lucru învățarea noii tehnologii vă va încetini - la început. Din acest motiv, atunci când practicați o repetare rapidă a interacțiunii, nu ar trebui să învățați un nou cadru. În schimb, intenționați să vă petreceți ceva timp din săptămâna dvs. și să-l dedicați învățării acelui cadru prin intermediul unui proiect pentru animale de companie, în noaptea de hacking în weekend sau prin implementarea pieselor noului instrument într-un proiect care absolut are nevoie noile funcționalități oferite de această soluție. Acest lucru vă va permite să vă mențineți impulsul și să rezolvați problemele în mod fluent, mai degrabă decât într-un stop-go Google și StackOverflow. Cel mai important, această segregare intenționată vă permite să vă concentrați asupra a ceea ce contează: rezolvarea problemelor de proiectare în loc de bug-uri de cod.

Ca o notă secundară, atunci când intenționați să înveți în mod intenționat, aceasta ajută și la rezolvarea problemelor care au deja soluții bine cunoscute și bine documentate; desigur, lumea nu are nevoie o alta aplicație simplă de rezolvat. Dar crearea unei aplicații de rezolvat vă poate ajuta să înțelegeți JavaScript mult mai mult și vă poate ajuta în viitor când sintetizați informații pentru a rezolva noi probleme. Soluțiile de construcție pentru problemele care au deja soluții bine documentate vă ajută să comparați și să contrastați soluția dvs. și ușurează căutarea ajutorului atunci când rămâneți blocat. Dacă vă aflați pe un teritoriu neexplorat și încercați să învățați în același timp, pierdeți este mult mai probabil și veți scăpa de scopul procesului de învățare.


Adoptați Mini-Sprints hiperfocalizate

Dacă ați auzit termenul "agil", ați putea avea o idee despre ce este un sprint. Sprints sunt perioade scurte, predefinite de lucru în care dezvoltatorii decid asupra unui set de obiective și "sprint" pentru a termina aceste obiective în intervalul de timp alocat. Pentru că vorbim despre dezvoltarea rapidă a interacțiunii, un sprint este potrivit pentru această discuție. Iată elementele de bază.

  1. Defini
    Prioritizați sarcinile / obiectivele, definiți lungimea sprintului, îndepărtați sau adăugați sarcini până când timpul estimat pentru finalizarea sarcinilor se potrivește cu lungimea predefinită a sprintului
  2. Sprint
    Acesta este momentul în care vă aflați "în zonă" - distragerile la zero, etc.
  3. Reflectați
    Odată ce sprintul este complet, verificați progresul. Ți-ai întâlnit sau ai depășit obiectivele? Ceea ce a cauzat cel mai mult hangup?
  4. Adapta
    Aflați de la ceea ce ați reflectat și puneți sistemele în loc pentru a evita hangouturile.

În abordarea agilă tradițională, sprinturile se bazează pe sprijinirea colaborării în echipă și, în general, durează mai multe zile sau chiar săptămâni. Aici, vorbim de mini-sprint-uri de auto-gestionare și hiperfocalizare. Aceste mini-sprinturi s-ar putea chiar să se concentreze doar pe o singură sarcină sau interacțiune și obiectivele asociate acesteia. Procesul de definire și de prioritizare a sarcinii sau a subtask-urilor sale înainte de a se scufunda în muncă și, ulterior, a lua timp pentru a reflecta asupra procesului și pentru a vă adapta fluxul de lucru sau modelele (amintiți-vă că este important să vă optimizați tiparele) vă va ajuta să deveniți mai conștienți de viteza și productivitatea dvs. și vă va permite să fiți mai conștienți de ceea ce ar putea utiliza îmbunătățirea la nivel micro.

Recomandare: definiți două sprinte 3 oră pentru o zi, fiecare având o sarcină principală. Scopul sprintului (ca și în cazul unui sprint fizic) este să-ți conduci creierul cât de tare poți pentru cele 3 ore. După aceste 3 ore, veți avea nevoie de o pauză de creier; poate că aceasta este pauza de prânz sau poate ați ales să adoptați un program alternativ care să permită un bloc de timp neîntrerupt, hiper-concentrat (mai târziu, mai târziu). Indiferent de situație, planificarea acestor sprinturi separate unul față de celălalt vă va ajuta să vă reîncărcați creierul. Merită să încercați tipuri complet diferite de activitate (cum ar fi o plimbare sau citire de ficțiune) sau chiar un pui de somn - mai mult pe aici. Dacă lucrați pentru o agenție, probabil întreruperea este perioada în care ați rezervat întâlniri, sarcini administrative sau sarcini de dezvoltare mai puțin impozabile. Unii oameni consideră că acest lucru este cel mai bun mod de a lucra în fiecare zi, iar alții pot alege sporadic să facă acest tip de "antrenament cu interval sprint"; alegeți ceea ce vă sfârșește, făcându-vă cel mai productiv și creșteți viteza de dezvoltare a interacțiunii.


Temporar blocați site-urile Go-To

Dacă sunteți ca majoritatea oamenilor, degetele au memorie musculară; când deschideți un browser, este instinct să tastați imediat în Hacker News, Tuts + sau Twitter? Care sunt site-urile care te determină să te amâne?


Hacker News a atacat această problemă într-un mod specific, oferind utilizatorilor înscriși posibilitatea de a stabili o restricție "noprocrastinate". Există câteva instrumente interesante care oferă, de asemenea, astfel de restricții, dar de ce să nu faceți asta? Pe un Mac, executați următoarele comenzi de la terminal:

sudo nano / etc / hosts # introduceți parola atunci când solicită acest lucru. # Acesta va deschide un fișier într-un editor de coduri bazat pe terminale; # Nu vă faceți griji! Nu vei mai face multe aici. Introduceți următoarele linii. 0.0.0.0 twitter.com 0.0.0.0 facebook.com # apăsați Ctrl + C (ieșire), Y (da, aș vrea să salvez) și introduceți (salvați numele fișierului existent)

Puteți edita același fișier în Windows (consultați această explicație).

Acest lucru vă va împiedica să utilizați Twitter sau Facebook și, în schimb, vă redirecționați către localhost (0.0.0.0 este o comandă rapidă către aparatul dvs.). Pentru a vă întoarce la terenurile de rețea socială, urmați aceiași pași, însă eliminați liniile pe care le-ați adăugat.

Recomandare: Ar trebui să blocați Facebook și Twitter tot timpul în timp ce lucrați? Spunem nu. Are sens să fie capabil să ia mici pauze între sarcini pentru a evita arsurile. Cu toate acestea, în timpul unui sprint, dacă aceste site-uri vă fac aparent să vă pierdeți timpul, este important (cel puțin până când rupeți obișnuitul care provoacă memoria musculară) să le puneți în pauză. Notă importantă aici este, controlați întârzierea, chiar dacă asta înseamnă programarea timpului a irosi. Conștientizarea timpului pe care îl puneți într-o anumită activitate vă va ajuta să fiți mai conștienți de faptul dacă acest timp alunecă sau nu din controlul dvs..


Minimizați întreruperea

Întreruperile sunt cunoscute de mult pentru a reduce productivitatea lucrătorilor din domeniul cunoașterii. (A se vedea aici, aici, aici, și există mult mai multe disponibile printr-o căutare rapidă pe Google.) Programatorii (și, prin urmare, designerii de web) sunt susceptibile de a obține doar unu sesiune neîntreruptă de 2 ore într-o zi. În metodologia agilă, există conceptul de ore de bază care susține că un accent puternic ar trebui să fie menținut pentru 5 ore total pe zi. Acesta este un salt de departe de cele două ore programatorii se pot aștepta să obțină într-un birou normal.

Anatomia unei întreruperi

Există multe tipuri de întreruperi, dar vom analiza astăzi două aspecte specifice ale întreruperii. Primele sunt întreruperi bine primite sau "auto-provocate", celelalte fiind întreruperi externe sau "intruzive". Ambele tipuri sunt în detrimentul productivității și ambele tipuri pot fi oarecum gestionate în moduri diferite.

Întreruperi proprii se întâmplă pentru că ați creat în vreun fel un spațiu pentru ca aceștia să apară. Acestea provin de obicei sub forma unor notificări programabile (telefon, calculator etc.).


Întreruperi intruzive se întâmplă deoarece alți oameni au nevoie de tine să le acorzi atenție. Deconectarea este sincronizare și sentiment de urgență. Trebuie să vă gestionați timpul și trebuie să puneți în practică modalități de a evita cât mai mult posibil efectele negative ale întreruperii.

Deci, ce faceți pentru a atenua întreruperile? Cum obții Zen Zone Time? Iată câteva dintre recomandările noastre.

  1. Reduceți sau dezactivați complet notificările
    Acestea includ notificări telefonice precum texte, e-mail, Twitter și chiar "chat". Ascundeți-vă ferestrele de chat și participați la acestea ca parte a fluxului dvs. de lucru, în loc de a avea o bază de solicitare de răspuns. Acest lucru poate părea că vă va afecta mai întâi productivitatea, dar s-ar putea să fiți surprins de cât de dispuși să așteptați importantă, și cât de probabilă este rezolvarea problemelor pentru ei înșiși, dacă sunteți prea ocupați să renunți la ceea ce faceți.
  2. Gestionați-vă conducerea: să adopte un respect organizațional pentru Zona.
    Creați reguli în organizație cu privire la "ora zonei" sau "timpul producătorului". Aceasta înseamnă că există limite specifice pentru momentul, unde și cum poți întrerupe pe cineva atunci când se află în zonă. Au modalități specifice de a vă semnifica faptul că sunteți "sub", cum ar fi punerea în cască sau lucrul într-o anumită parte a biroului dvs. Acesta este scopul de a "îndepărta" mesaje pe chat, de asemenea. Managementul trebuie să aloce timp pentru cultivarea dezvoltării rapide a interacțiunii!
    Managerii - acest lucru poate părea o potențială amenințare la adresa biroului, dar, ca orice, puteți încerca acest lucru pentru un pic pentru a vedea ce piese eșuează și ce piese reușesc. Veți vedea probabil creșterea productivității imediat.
  3. Izolați-vă
    Poate că soluția cea mai eficientă, izolându-vă, vă face să vă controlați spațiul. Acest lucru se poate întâmpla în multe formate diferite; de exemplu, mulți designeri web și dezvoltatori lucrează de la cafenele pentru a se scufunda în izolare. Acest lucru va preveni întreruperile care se produc ca urmare a proximității fizice. Izolarea nu înseamnă însă întotdeauna locația; în cazul în care majoritatea lucrărilor de birou de la 9-5, poate lucrați de la 6AM la 2PM sau 12PM la 8PM. Acest lucru vă va oferi spațiu și timp pentru a vă gândi și a lucra fără întrerupere. Poate că poți lucra de la distanță una sau două zile pe săptămână? Poate că este mult mai simplu decât pentru tine, mai ales dacă ești un freelancer.
  4. Fiți sârguincioși cu comunicarea programată
    Dacă intenționați să puneți bariere în jurul vostru, trebuie să fiți, de asemenea, dispuși să respectați cuvântul dvs. și să răspundeți la mesaje atunci când ieșiți din zona. Nu lăsați această alunecare sau altfel aspectele productive ale timpului zonei dvs. vor fi reduse de aspectele negative ale obiceiurilor dvs. de comunicare. Oh, și nu uita să-i sun pe mama ta!

Jocul: Competiția și recompensa

Ce face evenimentele "hackathon" atât de productive? Cum se transformă oamenii în produse viabile în 48 de ore? Poate că este un amestec de caracteristici.
1. Timp anticipat, protejat, planificat pentru o dezvoltare rapidă concentrată
2. Concurența cu ceilalți
3. Recompense în numerar
Hackathonii se sparg din "fluxul normal" al muncii zilnice. Desigur, nu am vrea să lucrăm 48 de ore la rând tot timpul. Dar mentalitățile de productivitate care decurg din acest lucru sunt extrem de importante. Am făcut deja aluzie la importanța focalizării și a timpului neîntrerupt. Cu toate acestea, este un efort demn de a analiza modul în care crearea unor sisteme de concurență și de recompensare personală vă poate ajuta să creșteți eficiența în dezvoltare. Acest lucru vă ajută să setați repere și, firește, să vă instruiți creierul să se adapteze comportamentelor care sunt pline de satisfacții.

Recomandare: dacă lucrați cu un alt dezvoltator, decideți un concurs cu obiective clare și faceți-l orientat în timp. Nu contează cu adevărat care sunt aceste obiective. Ia ceva timp să lucrezi prin ele. Poate că poți concura împotriva ta; practică prin utilizarea sprîncilor ca și competiția dvs. și stabilirea obiectivelor crește eficiența dvs. cu o anumită perioadă de timp. Setați recompense atât pentru că vă aflați într-un mod competitiv, cât și pentru momentul în care finalizați orice sprint concentrat de lucru. Acest lucru vă va ajuta să vă concentrați în timpul sprintului în sine. O recompensă poate fi un lucru fizic (ca o ceașcă de cafea) sau ceva mai puțin beton (cum ar fi un loc de parcare VIP pentru o săptămână sau "timp liber").


Scufundați-vă în Comunitatea Open Source

Vom păstra acest sfat scurt, pentru că beneficiile de aici vor fi evidente. Lumea Open Source este plină de oameni uimitori și talentați care construiesc lucruri care îi ajută pe alții să-și facă mai bine meseria în fiecare zi. Exemple ca cadrele pe care le-am menționat mai sus abia zgâriați suprafața. Iată câteva dintre avantajele de a lucra și de a comunica cu comunitatea open source.

  1. Expunerea la instrumente noi
  2. Soluții gratuite pentru probleme comune
  3. Noi soluții la problemele emergente
  4. O mai bună înțelegere a problemelor pe care probabil că nu le cunoașteți există
  5. Oportunitate de a contribui și de a deveni o parte a ciclului de dare / primire
  6. Think Osmosis: învățarea prin repetare și expunere

Scufundarea în comunitatea open source și învățarea folosirii instrumentelor oferite poate duce la creșterea imediată a productivității, dar, de asemenea, este mult mai probabil ca o altă persoană să vă poată ridica proiectul și să continue să se dezvolte pe acest proiect. Open source permite oamenilor să colaboreze în jurul unei standarde și a unei documentații preexistente. Acest lucru reduce costurile cognitive pentru transferul de proiecte și vă face un dezvoltator mult mai educat; acest lucru se traduce imediat în eficiență mai mare.

Recomandare: Obțineți un cont GitHub și începeți să construiți lucruri cu ajutorul instrumentelor disponibile pe GitHub.


Aceasta este oarecum o reiterare a ceea ce am spus mai devreme - folosiți cadrele open source pentru a rezolva problemele în moduri previzibile, modele și a participa la comunitatea celorlalți care fac acest lucru. Colaborarea și discuția sunt chei foarte importante pentru învățare.


Concluzie

Acest lucru nu înseamnă în niciun caz o listă completă a lucrurilor pe care le puteți face pentru a deveni un dezvoltator de interacțiune rapidă. Lăsați niște note în comentariile lucrurilor pe care le-ați încercat care au funcționat, au eșuat sau au avut puțin până la nici un efect!