Kako poboljšati i ubrzati proces izrade web rješenja?

Kako poboljšati i ubrzati proces izrade web rješenja temeljenih na CMS-u?

Nakon što smo se prisjetili kako su se webovi radili prije 10 godina te kako se njihovom razvoju pristupa danas, može se primijetiti kako je napredak golem, ali i da ima još popriličnog prostora za poboljšanje. U ovom ćemo se dijelu baviti upravo time - analizom svega onoga što bismo mogli poboljšati kako bi proces izrade web rješenja temeljenih na CMS-u bio što učinkovitiji.

lukac-cms

Čak i uz bitno poboljšani proces opisan u prvom dijelu, još uvijek postoji i dosta problema. Često se događa da se klijent ne uključi dovoljno (rano) u sam projekt pa očekivanja nisu usuglašena. Velik broj klijenata i dalje očekuje da agencija sama obavi cijeli proces, a da će oni na kraju unositi gotov sadržaj. Usporedimo proces izrade web rješenja s, primjerice, preuređenjem ureda: znamo da ćemo za preuređenje ureda pozvati majstora, ali da je dobro što češće ga obilaziti kako bismo bili sigurni da cijeli proces ide u optimalnom smjeru. Ista je situacija i s izradom web rješenja.

Glavni je problem u samom vođenju procesa koji se uglavnom vodi kao waterfall s pokušajem da se isplanira cijeli proces, da se jasno definiraju koraci između faza i između timova. Kod web projekata velika je mogućnost da će se opseg posla prilagođavati i mijenjati. Čak bih ustvrdio da se to uvijek na kraju i dogodi. To često rezultira neispunjenim očekivanjima i nezadovoljstvom rezultatima. Članak How to ship good design odlično objašnjava mane waterfall pristupa.

Važno je napomenuti da u procesu još uvijek ima dosta gubitaka i rasipanja. U izradu wireframea i trostruke PSD-ove ulaže se mnogo truda i vremena, da bi se na kraju taj trud de facto bacao (premda postoje neki alati za konverziju PSD-a u HTML/CSS, ali to radi samo u idealnim i jednostavnim situacijama). Isto se tako baca i trud uložen u prototipiranje, mada u ovom slučaju neki alati imaju izvoz u HTML/CSS (ali bez ikakvih CMS funkcija).

Klijenti i nedostatak alata usporavaju agilnost

U zadnjih godinu ili dvije dana susrećem se s mnogo agencija koje pokušavaju prijeći na neki agilniji način vođenja projekta, s manje ili više uspjeha. Otpor klijenata i nedostatak pravih alata za podršku tom procesu usporavaju taj pomak.

Web rješenje nije uobičajena softverska aplikacija koja služi ažuriranju suhoparnih podataka, već rezultat rada većeg broja različitih ekspertiza. U konačnici se radi o virtualnom uredu klijenta, o njegovom brendu, njegovom sadržaju, njegovoj osnovnoj djelatnosti (eng. core business). Krucijalno je da se na početku projekta odredi tim koji se sastoji od vanjskih (digitalne, marketinške, prevoditeljske agencije i dr.) i internih resursa. Zaposlenike klijenta potrebno je što ranije uključiti u proces kako bi bili u tijeku i što ranije počeli doprinositi, i to ne samo na početku kad se postavljaju ciljevi, definiraju ciljana tržišta, rade fokus grupe, već i tijekom projekta (davanjem smjernica, kreiranjem sadržaja, testiranjem i slično).

Moguće je objasniti i olakšati klijentima ovakav agilniji način rada. Možemo im pomoći tako da agencije poboljšaju proces, inzistiraju na čestoj (agilnoj) komunikaciji i ponude klijentima alate koji će im omogućiti efikasniji način rada. Primjerice, Invision aplikacija omogućuje cloud-based izradu prototipa na kojima se može uključiti klijenta u proces. Neki od tih alata za prototipiranje podržavaju responzivnost, a neki omogućuju izvoz rezultata u HTML/CSS predloške. S radom u CMS-u može se (i poželjno je) krenuti u ranoj fazi i unositi stvaran sadržaj.

Manje Photoshopa, više CSS-a

Radi efikasnosti nužno je što manje dizajnirati u Photoshopu, a što više u samom CSS-u. Čak ni tri nacrtane dimenzije u Photoshopu (za desktop, mobilne uređaje i tablet) ne pokrivaju sve moguće varijante. Još je dugotrajnije i skuplje izrađivati posebne PSD datoteke za ostale varijacije kao što su jezik, različit sadržaj, podstranice, i dr. Na kraju treba biti svjestan da nacrtano nikad ne može biti istovjetno načinu na koji će se prikazati na webu.

Naravno, alati za crtanje, kao što je Photoshop, i dalje su korisni za dizajniranje elemenata koji se koriste na stranici, počevši od logotipa preko knjige online vizualnih standarda do interaktivnih kontrola i ilustracija. Sve manje ima smisla crtati cijele stranice u grafičkim editorima, osim ako se ne radi o vrlo jednostavnoj stranici, ali ovdje ionako ne pričamo o tome.

Postoje dobri alati koji olakšavaju osmišljavanje i testiranje koncepata (na početku procesa papir ili ploča i cloud-based prototipiranje), upravljanje sadržajem (CMS-ovi, servisi za prevođenje, itd), development i integraciju. Ono što nedostaje u cijeloj priči je dodirna točka svim tim različitim aktivnostima. Koraci su još uvijek serijski: kreativna faza, crtanje koncepta, vizualni dizajn, implementacija, punjenje sadržaja, testiranje, dorada. Još uvijek je teško uskladiti i istovremeno izvoditi sve korake na agilan način. Pogledajmo što bi nam moglo omogućiti da to ostvarimo.

Idealan proces

Papir i olovka ili kreda i ploča
Papir i olovka ili kreda i ploča idealni su za konceptualnu fazu.

Zamislimo ovakav proces:

  • Nakon prikupljanja prvih informacija i definiranja ciljeva, formira se tim (kao i do sada).
  • Tim prikuplja što više ostalih informacija nužnih za što bolje definiranje koncepta (faza istraživanja i analitike kao i do sada).
  • Sastaje se na prvoj radionici na kojoj rade na konceptu. Najbolje je koristiti po starom dobrom principu papir i olovku ili kredu i ploču jer to najmanje ograničava maštu i inovativnost.
  • Nakon definiranja i usuglašavanja prvih koncepata, grubi wireframei/prototipovi unose se u sustav (pretpostavimo da CMS ima alat za prototipiranje) s osnovnom informacijskom arhitekturom.
  • Budući da već imaju CMS, u ovoj fazi moguće je migrirati postojeći sadržaj ili unositi novi stvarni sadržaj, slijedeći postavljenu informacijsku arhitekturu novog rješenja.
  • Alat za prototipiranje kompletno je baziran na postojećim web tehnologijama (među ostalima, na Bootstrapu ili sličnom responzivnom grid frameworku) te se vanjske stranice mogu početi dizajnirati preko generiranog responzivnog HTML grida.
  • Iako će dosta blokova u ovoj fazi biti funkcionalno generički, jedan će dio sigurno biti specifičan za projekt pa developeri mogu odmah početi s implementacijom takvih blokova.
  • Web rješenje kreira se zajedničkim snagama svih uključenih istodobno i na istom mjestu što omogućuje agilno vođenje projekta.
  • Svi u timu rade završnu doradu: testiranje funkcija, ujednačavanje izgleda, završavanje unošenja sadržaja, pripremanje za launch.

Zvuči dobro, zar ne? Mislim da je i izvedivo uz zadovoljavanje sljedećih uvjeta:

  • Fleksibilna platforma s wireframing/prototyping mogućnostima i CMS mogućnostima.
  • Agencija koja može odraditi opisani agilni proces.
  • Klijent koji razumije i prihvaća opisani pristup.

Ako pretpostavimo da su i agencija i klijent motivirani za poboljšanje procesa, preostaje nam pronalazak odgovarajuće platforme. Vjerovali ili ne, tržište se već pokrenulo u tom smjeru. Pojavljuju se startupi koji nude izradu prototipa i dizajn web rješenja u cloudu od kojih neki već imaju ponešto funkcija za upravljanjem sadržaja (npr. Webflow i Webydo).

Kreator Webflowa Vlad Magdalin napisao je odličan članak Let’s Redesign Web Design gdje opisuje kako trenutni alati za web dizajn nemaju iste karakteristike kao sam medij weba i to predstavlja problem za produktivnost. Očit primjer je kako se sam CSS kod piše u tekstualnom alatu, sasvim drugačijem mediju od samog internetskog preglednika koji prikazuje taj CSS.

Što Netgen radi po tom pitanju?

Mi u Netgenu uvijek pokušavamo unaprijediti svoj proces. U više od deset godina rada na web rješenjima naučili smo kako biti efikasniji i isporučivati brže i/ili više. Ima prostora da se neki koraci ubrzaju, dok se drugi, povezani s komunikacijom prema klijentu i općenito stvarima specifičnima za projekt, teško mogu ubrzati. Za značajnu optimizaciju potrebno je omogućiti da se većina koraka istovremeno izvodi.

Neka od postojećih rješenja koja idu u tom smjeru uglavnom su alati za wireframing i prototipiranje kojima se dodaju osnovne CMS funkcionalnosti. Mi već koristimo moćan CMS i orijentirani smo na kompleksne projekte u kojima su nam nužne sve CMS funkcionalnosti, što druga rješenja čini neadekvatnima.

Plan nam je kreirati alat za upravljanje blokovima i prikazima (layout and block management) baziran na CMS-u koji koristimo, koji bi se po mogućnostima približio alatima za prototipiranje. Cilj nije napraviti idealan alat za sve moguće web projekte (to bi ipak bio prevelik zalogaj), već alat koji će ubrzati cijeli proces na složenijim projektima na kakvim sami radimo.

Ako se bavite izradom web rješenja, kako izgleda vaš trenutni proces? Što je po vama najveći izazov kod unaprjeđenja procesa i uvođenja agilnijeg pristupa? Bi li vam pomogao alat za kreiranje prikaza i blokova integriran s CMS-om s kojim biste mogli prototipirati s pravim sadržajem te brže implementirati rješenje?

Posebna zahvala za pomoć oko pisanja ovog podužeg članka Maji Nebes, Marku Dugonjiću, Igoru Vrdoljaku i Vjeranu Vlahoviću. Ne propustite ni prvi dio članka – Kako je proces izrade web rješenja izgledao prije 10 godina – a kako danas?

Pravila ponašanja

Na Netokraciji za vas stvaramo kvalitetan, autorski potpisan sadržaj i zaista se veselimo vašim kvalitetnim, kontruktivnim komentarima. Poštujmo stoga jedni druge prilikom komentiranja držeći se sljedećih pravila ponašanja:

  • Ne budite 💩: Nema vrijeđanja, diskriminiranja, ni psovanja (osim ako nije osobni izričaj, ali onda neka psovka bude općenita, a ne usmjerena prema nekome)
  • Samo kvalitetna rasprava, manje trolanja: Ne morate se ni sa kim slagati, ali budite konstruktivni i doprinesite raspravi! Svako trolanje, flameanje, koliko god "plesalo" na granici, leti van.
  • Imenom i prezimenom, nismo Anonymous 👤: Autor sadržaja stoji iza svog sadržaja, stoga stojite i vi iza svog komentara. Koristimo ime i prezime (Hrvoje Lončar) ili barem ime i inicijala (Hrvoje L.) te pravu email adresu. Kako koristimo podatke koje tamo ostavljate? Bacite oko na našu izjavu o privatnosti.

Sve ostale komentare ćemo s guštom spaliti, jer ne zaslužuju svoje mjesto na internetu.

Komentari

  1. Ivica Kartelo

    Ivica Kartelo

    21. 12. 2015. u 10:03 pm Odgovori

    Evo mi pada na pamet naziv “Lean Web-up” po onom “Lean Start-up” (Slično Scrum načinu projektiranja). Da u ponudu stavite takvu suradnju – od najprečeg pa prema gore. Lako je kad je klijent znalac, ali ako nije, onda je klijent na potezu odmah, da pokaže koliko će dinamike unijeti u najpotrebniji dinamički site, pa onda dodavati, mjenjati, ukidati, sve isponova, nema veze, prilagoditi se razvoju klijenta. Jer, ma kakav vi projekt napravili, on uvijek ovisi o posadi koja je na njemu zaposlena nakon isporuke.

    I drugo pitanje: koliko su društvene mreže promjenile klijente i ulagače u web projekte?

    • Ivo Lukač

      Ivo Lukač

      21. 12. 2015. u 11:33 pm Odgovori

      Poštovani g. Kartelo, određeni broj agencija već neko vrijeme forsira takav način rada, ali se uglavnom radi o agencijama s reputacijom ili agencijama koje dugo rade s klijentima, stvar je povjerenja.

      Što se tiče drugog pitanja, neznam na što točno ciljate, ali ono što mogu reći o sprezi između webova i društvenih mreža je da su se webovi počeli mijenjati radi društvenih mreža. Npr, naslovnice su postale malo manje bitne, a pojedine stranice na koje se dolazi preko društvenih mreža su postale bitnije.
      Ono što mi se čini da nedostaje je sustav ili način kako upravljat pričom, ne samo jednom stranaicom ili postom. Priča je iznad svega toga i živi po raznim sustavima (webovi, društvene mreže, newsletteri, itd) pa ju je teško kontrolirati….

  2. Bojan Janjanin

    Bojan Janjanin

    23. 12. 2015. u 7:59 am Odgovori

    Ivo, bravo za članak 🙂 Mislim da je fleksibilnost ključna riječ, i kod dizajnera, i kod developera, i kod klijenata, i svih drugih uključenih u proces. Način izrade se iz godine u godinu mijenja i važno je ići u korak s vremenom, jer bez prilagodbe nema kruha. Osim što se prilagođavamo novim metodama, prilagođavamo se i projektu, jer je svaki projekt specifičan i dolazi uz jedinstvene prepreke. Ključno je pronaći balans između potreba korisnika, klijenata, dizajnera, developera…

    Dotakao si se nekih tema o kojima sam pisao prije par godina na http://www.netokracija.com/5-razloga-zasto-vasa-stranica-mora-biti-responzivna-40223 i jako mi je drago da se o tome piše (na našem kutu WWW-a). Za mene je prvi i najvažniji korak klijentu približiti proces kreiranja stranice od prvog do zadnjeg koraka. Kao što si i sam napisao u prvom dijelu članka, prije deset godina, stvari su bile sasvim drugačije i klijent često nije imao značajnu ulogu u procesu. Na žalost, često nisu ni korisnici. Danas je od presudne važnosti da u proces uključimo i klijenta i korisnike, koliko je god to moguće. Na meni je da klijenta educiram i objasnim mu važnost svih koraka u procesu (discovery, analysis, dizajn, development…) i važnost iteracija i to mi je često najveći izazov.

    Što se tiče CMS-a, za mene je od samog CMS-a važniji način kojim radim(o) prototipe. U grafičkom editoru provodim manji dio vremena, a u tekstualnom editoru veći – prototip je po meni najbolji kada ga možemo koristiti slično kao i konačan proizvod, u pregledniku, uz interacije. Front-end prototip mi skraćuje konačno vrijeme izrade jer sam sa njime već dobar dio developmenta obavio.

Odgovori

Tvoja e-mail adresa neće biti objavljena.

Popularno

Intervju

Želimo li primati plaće na Revolut treba nam “pravi” Revolut Bank, direktor Mirkes otkriva koji su planovi u Hrvatskoj

Je li Revolut zaista sada prava banka u Hrvatskoj, možete li na njega primiti ili isplatiti plaću i zašto uopće postoji ogranak Revolut Bank, saznali smo u razgovoru s njihovim direktorom, a nismo propustili provjeriti ni situaciju s HNB-om.

Startupi i poslovanje

Podravka i Human predstavili novu Coolinariku, evo što su napravili 10 godina od zadnjeg redizajna

Prva stranica kojoj se svi u regiji okrećemo kada su u pitanju recepti više neće biti ista. Coolinarika je od danas progresivna web aplikacija koja postaje znatno pametnija, a za sve to bilo je potrebno protresti čak milijune podataka.

Startupi i poslovanje

APIS IT dokapitalizacijom Grada Zagreba postaje drugi hrvatski IT jednorog, vrijedan preko milijardu dolara?

Dokapitalizacijom APIS IT-a Vlada bi potvrdila da ne samo da podržava vodeće hrvatske startupe nego ih i stvara, nastavno na potpisivanje deklaracije 'EU Start-up Nations Standard of Excellence' - koje su planirali učiniti.

Što ste propustili

Startupi i poslovanje

A koliko vama fali godina do dobne diskriminacije?

Kako je jedna Facebook objava prokazala tužno stanje generacijskog jaza u (domaćoj) digitalnoj i tech industriji...

Novost

Uspješni hackathonac Boris Tomaš kandidirao se za gradonačelnika Varaždina

Sudionik i mentor na mnogim hackathonima i docent FOI-ja Boris Tomaš otisnuo se u političke vode kandidaturom za gradonačelnika.

Startupi i poslovanje

“Vrijeme je da prestanemo veličati ‘ludnicu na poslu’. Haj’mo samo razvijati jako kvalitetan proizvod ili uslugu!”

Ljudi više ne mogu odraditi posao - na poslu… Jeste sami bili u toj situaciji ove godine, ovaj mjesec? Ako čitate ovo, vjerojatno ste dio digitalne zajednice, visoko-kompetitivnog IT sektora i možda vam se takve okolnosti događaju i na dnevnoj bazi. Tako ne bi trebalo biti.

Društvene mreže

Što učiniti kad dobijete negativan komentar na društvenim mrežama?

Odgovoriti na njega? Obrisati ga? Ignorirati? Postoji li uopće univerzalan način rješavanja ovakvih situacija? Provjerite u novoj epizodi Netokracija Podcasta.

Novost

Rimac Kampus: Od Matine ideje na fejsu 2013. do stvarnosti u 2023.

Nove dobre vijesti iz Rimac Automobila! Hrvatska tvrtka danas je predstavila nove detalje o kampusu koji bi se trebao izgraditi do 2023. godine.

Startupi i poslovanje

Infobip akvizirao Shift: Ivan Burazin će kao član uprave jačati odnose s developerima

Ovom akvizicijom Shift postaje podbrend Infobipa i nastavlja rasti i razvijati se unutar domaće tehnološke tvrtke - ali što Infobip zapravo planira sa Shiftom i koju ulogu u svemu ima sam Ivan Burazin?