Kako je proces izrade web rješenja izgledao prije 10 godina – a kako danas?

Izrada web rješenja koja uključuju sustav za upravljanje sadržajem (Content Management System - CMS) multidisciplinaran je i kompleksan proces. Sam proces izrade obično je dugotrajan jer se sastoji od mnogo koraka u koje moraju biti uključeni ljudi različitih profila: od UX dizajnera i dizajnera interakcija preko glavnog urednika sadržaja (eng. content strategist) do backend developera. Sami koraci mogu imati više iteracija dok se ne postigne potrebna razina funkcionalnosti i kvalitete. Promotrimo koji su glavni izazovi i problemi s kojima se susrećemo i razmotrimo neka moguća poboljšanja.

ivo cms

Usput rečeno, proces izrade web rješenja moguće je značajno pojednostaviti (a samim time i pojeftiniti) tako da se nađe/kupi gotov predložak i prilagodi konkretnom projektu. To je prihvatljivo za generičke koncepte i dobro definirane niše, npr. kod internetskih stranica za oglašavanje apartmana. Međutim, svatko tko razvija specifični koncept ili želi izgraditi prepoznatljivost branda, neće se ograničiti na gotovu temu.

Kako se to nekada radilo?

Prije više od deset godina, kada smo počeli raditi na prvim web rješenjima, proces izrade, pa čak i profil uključenih ljudi, bio je drugačiji nego danas. Klijent je angažirao dizajnerski studio kojem je web bio tek nekakva novotarija koja treba zadovoljiti formu, a stranice su uglavnom izrađivali grafički dizajneri i programeri.

U procesu odabira dizajnerskog studija klijent je obično zatražio tri varijacije dizajna kao idejno rješenje s naglaskom na vizualni dojam. Nakon odabira, klijent je dostavio često nedostatan feedback na temelju kojih je studio napravio cijeli dizajn u Photoshopu. Neki su studiji već u to vrijeme imali zaposlene “rezače”, pa se taj PSD (Photoshop file) rezao u HTML/CSS nakon završetka faze dizajna. Većina je sadržaja bila dobro poznati “lorem ipsum” privremeni tekst. Nakon rezanja Photoshop datoteke u HTML i CSS predložak, izgled predloška obično nije bio 100% jednak originalnom dizajnu jer je, primjerice, renderiranje fontova u Photoshopu bilo drugačije od renderiranja u tada aktualnim internetskim preglednicima, poput Internet Explorera.

U to je vrijeme treća developerska firma, koja nije nužno bila stručna u web tehnologijama, preuzimala HTML/CSS predložak i implementirala rješenje u PHP-u, ASP-u, ASP.NET-u ili Flashu kako bi klijent mogao samostalno ažurirati sadržaj poput vijesti ili liste proizvoda. Možemo reći da su tako razvijeni sustavi bili svojevrsne preteče CMS-a. Na kraju se već gotova stranica pokazivala klijentu koji često nije bio u potpunosti zadovoljan jer nije sve bilo isto kao u originalnom dizajnu (kreiranom u Photoshopu) pa se proces često znao otegnuti. Neki su klijenti inzistirali na sitnim vizualnim promjenama pa je tako nastao i pojam pixel pushing. I prilikom unosa stvarnog sadržaja moglo se pojaviti puno novih problema, što je također znalo razvući cijeli proces. Jednom kada se stranicu dovelo do zadovoljavajuće razine, objavilo bi ju se i ostavilo u takvom obliku nekoliko godina, nakon čega se prema potrebi redizajnirala od početka.

Što su donijele tehnološke promjene?

Proces je u međuvremenu prilično evoluirao. Pojavile su se nove specijalizacije, uključeno je više različitih profesija, a i sama je metodologija napredovala. Neke su stvari postale jednostavnije, no neke su se i zakomplicirale:

  • Web standardi pomogli su da se smanji razlika između pojedinih preglednika, što je ubrzalo “rezanje”, ali je pojava mobitela i tableta uvela mnogo više dimenzija ekrana zbog čega su nastali responzivni i adaptivni načini implementacije, što je “rezanje” pak usporilo. Pozitivna je činjenica da se više ne traži identičan izgled na svim preglednicima. Za različite browsere i verzije browsera primjenjuju se rješenja adekvatna mogućnostima  (tzv. progressive enhancement pristup).
  • Poimanje weba kao ozbiljnije platforme za brendiranje, prodaju i općenito komunikaciju s kupcima te pojava više dimenzija ekrana koji se koriste (mobile, tablet, TV) potaknuli su većinu marketinških agencija da ne gledaju na web rješenje kao na samo još jednu kompliciraniju ilustraciju; web je ipak dinamičniji i interaktivniji medij od papira, s puno većim mogućnostima prilagodbe krajnjem korisniku.
  • Iz istih gore navedenih razloga te zbog tražilica koje su postale svakodnevica (čitaj: SEO) više se pažnje počelo pridavati samom sadržaju.
  • Pojavili su se CMS-ovi koji su omogućili bolje i lakše upravljanje sadržajem.

Kako radimo danas?

responzivno tablet mac macbook

Proces naručivanja i izrade web rješenja konstantno se prilagođava promjenama nastalim kao posljedica tehnološkog napretka. Ispred nas je još dug put do idealnog procesa; današnji su koraci kombinacija zastarjelih metodologija te inovativnih praksi i široke palete dostupnih alata:

  • Naručitelj nije zadovoljan s postojećom web stranicom pa traži nekoga tko će je učiniti responzivnom ili je jednostavno vizualno osvježiti.
  • Naručitelj skuplja ponude više digitalnih ili web agencija i vjerojatno će tražiti idejno (besplatno) rješenje kako bi testirao sposobnosti svake pojedine agencije. Većina će ozbiljnih kandidata odbiti takav način rada jer su u tu svrhu izradili svoj portfolio. Već je duže vrijeme poznato da je kvalitetan dizajn web stranica posljedica procesa, a ne sposobnosti dizajnera da osmisli rješenje iz vedra neba.
  • Već na prvim sastancima s potencijalnim kandidatima postaje jasno da je u većini slučajeva za responzivan (re)dizajn potrebno proći cijeli proces ispočetka. Nekim se klijentima to neće svidjeti, ali je u tom slučaju iznimno važno da agencija ustraje pri svojoj metodologiji jer inače rezultat projekta neće biti zadovoljavajući.
  • U inicijalnom koraku projekta — fazi upoznavanja — agencija bi trebala savjetovati klijenta da jasno definira poslovne ciljeve koje novo web rješenje mora ispuniti. Pri tome bi se trebala uspostaviti i metrika uspješnosti definiranjem ključnih pokazatelja uspješnosti (eng. key performance indicators – KPI) kako bi se mogli ocijeniti rezultati (re)dizajna.
  • Faza upoznavanja obuhvaća i utvrđivanje ciljanih skupina korisnika koje se definiraju uzimajući u obzir različite geografske, demografske, socio-ekonomske i ponašajne parametre. Često se događa da klijent ima pogrešne pretpostavke o korisničkim potrebama, stoga je korisno obaviti razgovore s predstavnicima ciljnih skupina.
  • Nakon što se prikupe sve informacije o projektu, klijentu i njegovim korisnicima, izvodi se planiranje informacijske arhitekture i analiza sadržaja na postojećoj web stranici – potrebno je utvrditi koliko se postojeći model sadržaja preklapa s novim modelom i koje su obveze klijenta u pripremi novog sadržaja.
  • Planiranje je najbolje započeti na papiru jer je to najbrži (i najjeftiniji) način za filtriranje i razradu početnih ideja. Već se na ovom koraku mogu testirati koncepti i uočiti potencijalni problemi redovitim testiranjem koncepta s krajnjim korisnicima.
  • Nakon utvrđivanja glavnog koncepta, prelazi se na wireframing alate (npr. Axure, UXPin ili Balsamiq). Koncept ovisi o vrsti projekta, a moguće je razraditi ga na dva najčešća načina: mobile-first ili desktop-first. I u ovom se koraku često radi dosta pretpostavki i rad se temelji na funkcionalnostima umjesto da se bazira na korisničkim potrebama utvrđenim inicijalnim razgovorom s korisnicima i redovitim testiranjem koncepta.
  • Nakon izrade wireframea ponekad je potrebno dizajnirati nekoliko tipičnih stranica u najčešće tri veličine (mobile, tablet i desktop) da bi se dizajn odobrio. Često su dovoljne i samo dvije veličine (mobile, desktop) dok se ostale ugađaju poslije. Nakon nekoliko iteracija dizajn se odobrava, a često je popraćen i ubacivanjem naknadno utvrđenih funkcionalnosti.
  • Vizualni i informacijski dizajn je gotov. Sljedeći je korak odabir CMS-a, bilo da se radi o poznatom i raširenom rješenju ili sustavu razvijenom i korištenom unutar pojedine agencije. Vizualni dizajn se potom implementira kao frontend dio CMS-a. Postoje različiti pristupi, a mi u Netgenu primjenjujemo dizajn u CSS-u na HTML kod, koji se generira iz CMS-a, što nam bitno ubrzava proces izrade. Pojedine agencije imaju drugačiji pristup: gotovi HTML/CSS predlošci implementiraju se u vanjski dio CMS-a.
  • Nakon završetka implementacije rade se završna testiranja, provjere i dorade za nekoliko veličina ekrana i uređaja.
  • Klijenta se obučava kako uređivati sadržaj putem CMS. Često se događa da se, nakon što klijent počne unositi stvarni sadržaj, pojave sitniji nepredviđeni slučajevi koji se rješavaju u hodu jer je nemoguće predvidjeti kakav će sve sadržaj biti unesen na web stranice.

Napominjem da su popisani koraci vrlo okvirno opisani. Konkretan proces ovisi o agenciji, specifičnom klijentu, projektu i sl.

Općenito gledano, proces izrade klijentu prilagođenih web rješenja danas je u mnogim stvarima bolji nego prije, a poboljšali su se i alati (wireframe alati, programski jezici za web, standardi, alati za development u pregledniku, CMS-ovi, web fontovi, i dr.). Proces je fokusiran na ono što je klijentu bitno s obzirom na njegove ciljeve. Pokušava se zadovoljiti i poslovne i korisničke potrebe, a ozbiljnije agencije imat će unaprijed definirane ključne KPI-eve i sl. Mnogo se pažnje posvećuje UX-u, koji je pak je vrlo često pogrešno shvaćen pojam. Mnogi smatraju da se radi o dizajniranju lijepih sučelja, dok se, međutim, UX (eng. User eXperience) tehnike koriste upravo za ono što im samo ime govori: optimizira se korisničko iskustvo, a vizualni je doživljaj samo dio cijelog iskustva, dok je mnogo važnija percepcija korisnosti i jednostavnosti.

U sljedećem dijelu, koji će biti objavljen za nekoliko dana, pogledat ćemo što bismo mogli poboljšati u današnjem procesu izrade web rješenja. Stay tuned!

Dodatak: Bacite oko na drugi dio teksta – Kako poboljšati i ubrzati proces izrade web rješenja temeljenih na CMS-u?

ponuda

Komentari

  1. Milenijal

    Milenijal

    18. 12. 2015. u 11:50 am Odgovori

    Najveća razlika između nekad i danas je da se nekad sajt mogao napraviti za 1000 do 1500 EUR a danas takav isti košta 8000 EUR. Uz iso znanje i funkcionalnost.

      • Pero

        Pero

        20. 12. 2015. u 2:18 pm Odgovori

        @Ivo u pravu si. Znanje se povećalo za 30% a cijene za 500%. Da te podsjetim da su najpoznatiji i najprofitabilniji sajtovi nastali u tom dobu. Možda nas možeš podučiti po čemu su današnji sajtovi tipa Airbnb, Groupon, Snapchat, Instagram itd bolji od tadašnjih Amazon, Google, Facebook itd (osim fancy add-on funkcija).

        Ja koliko vidim C, PHP i C# imaju iste funkcije i principe, samo je add-onova više i programski framework je napredniji, rekao bih čak brže je raditi sa današnjim nego nekadašnjim kada si sve morao sam pješke.

        • Ivo Lukač

          Ivo Lukač

          21. 12. 2015. u 10:35 am Odgovori

          Bok Pero,

          Gledaš samo sa developerske strane. Znanje se povećalo puno puno više od 30%. Mnogo se više vodi briga o sadržaju, konverziji, korisničkom iskustvu i procesima, interakcijskom dizajnu i dizajnu sučelja, SEO/SEM, integracijama sa društvenim mrežama, integracijama sa srodnim sustavima tip CRM/ERP/PIM itd.
          Prije 10 godina skoro pa ništa od toga nije bilo ili je bilo tek u začecima.

        • Ivo Lukač

          Ivo Lukač

          21. 12. 2015. u 10:38 am Odgovori

          Btw. ovdje se govori i izradi klasičnih webova na temelju CMS-ovima, a ne na aplikacijama specifične namjene. I Airbnb i Groupon i Snapchat i Instagram i Google i Amazon i Facebook su web aplikacije za specifičnu namjenu, a ne content webovi.

  2. goran

    goran

    19. 12. 2015. u 11:08 am Odgovori

    Nekako mislim, no možda sam u krivu da gotove aplikacije tipa wordpress su dožvjele vrhunac. Bio sam veliki zagoravatelj gotovih riješenja no riješenja koja nude kostur (framework) aplikacije su se u ovih 10g. isto razvijale. Nije se samo tehnologija na nižim (tehnološkim) razinama razvijala, razvijali su se i frameworci (viša razina) koji iskorištavaju te tehnologije.

    Kad se izradi kostur aplikacije, osnova biznis logike, dalje se fokusira na daljni razvoj biznis logike, za razliku od gotovih riješenja u kojema uvijek morate raditi kompromise između biznis logike i gotovog riješenja.
    I koliko god se takva riješenja trudila odvojiti gotovu funkcionalnost od biznis logike (Magento) još uvijek su predaleko da bi pružala isključiv fokus na biznis logiku.
    Možda se i tu nešto promjeni i gotova riješenja se razvijaju:)

    Naravno ne pričam o manjim projektima, no danas uključivanje third party library u napredne frameworke (frontend i server side) je stvar konfiguracije ne kopanja i debugiranja po kodu, što mi pak sad “crklo”:)

    Tako da mislim sa developerske strane, u zadnjih 10g ima velikih promjena., danas bi se trebalo i za ozbiljnije projekte sa manjim budgetom ostvariti pa čak i prednosti ako bi se krenulo za izradom custom sofware temeljnog na nekim od naprednih frameworka.

    Možda godine iskustva pa se čini to sve subjektivnom no bila bi laž reči da danas razvoj custom software nije poprilično automatiziran, nešto što prije par godina nije postojalo a kamoli danas. Na kraju to znači da se developeri mogu fokusirati na ono što stvarno važi, biznis logika.

    • Ivo Lukač

      Ivo Lukač

      20. 12. 2015. u 11:01 am Odgovori

      Bok Gorane,

      Mi koristimo takav CMS već 10 godina, koji je više framework nego gotova aplikacija. To je kao traktor ili kamion s kojim možeš svašta napravit, ali je to za već postotak klijenata preskupo. Da li su CMS-ovi ala WordPress doživjeli vrhunac ne znam, ali se slažem da se danas može puno toga napravit na framework razini jer ima jako puno opensource-anih, a dobrih stvari za korištenje.

      Inače u ovom članku se manje orijentiram na developersku stranu priče, odnosno, ona je samo dio priče 🙂

  3. M.

    M.

    19. 12. 2015. u 6:59 pm Odgovori

    Sve je to super, ali kad se u poslu konstantno susrećeš s klijentima koji ne žele gledati wireframeove jer im oni ništa ne znače, nego hoće vidjeti dizajn, puno toga pada u vodu. Još uvijek gotovo svima je važnije vidjeti lijepu sliku i na njoj button nego zaista dobro utvrditi wireframe, potpisati ga i zapečatiti, pa tek onda krenuti u dizajn.

  4. Bruno

    Bruno

    21. 12. 2015. u 8:00 pm Odgovori

    Kužiš, sad nas je M. nakurio i čekamo drugi dio članka 😉
    Svaka pohvala za ovaj prvi.
    Odlična rasprava, količina znanja i retorika u komentarima.

  5. Damir Petek

    Damir Petek

    11. 01. 2016. u 10:28 pm Odgovori

    OK ekipo… sad malo mi koji trebamo ” guglat” što je SEO ili CMS ala Drupal…. koji mislimo da danas većina Vas uzme Word press ili Jomla template i slaže ih kao lego kockice sa modulima (većinom free opcije) i onda to proda kao exellentni autorski uredak. Jer mi korisnici nemamo pojma. kao što se vidi iz ovog texta.
    Bavim se turizmom i želim imati jedan ozbiljan portal . Ne želim uložiti 100-200 000 eur u eksperiment u kojem će svi zaraditi, a jedni rizik ću imati ja kao korisnik. Na kraju svi imate perfektne storije gdje je trebalo raditi drugačije ( od keywords preko title i description … preko loših veza na socijalne mreže ili neozbiljnih blogova i priloga na fb koje su uradile moje djelatnice koje doduše imaju tu generacijsku prednost da mogu prihvatiti aktualnost trenutka lakše od mene koji sam “stari djed” i kojemu pojmovi poput startUP inkubatora ne govore ništa osim da su nekada u inkubatorima uzgajali piliće.. .
    Sama pomisao da cijelu inovaciju poslovanja trebam povjeriti ljudima koji govore za mene nemuštim jezikom. Danas sam im ja poslodavac sutra neki team iz Indije a prekusutra rade u portalu za lokalne lovačke novine i stalno prodaju istu storiju.
    Pitanje za Vas postoji li neko tko može zajedno sa mnom prihvatiti rizik poslovanja ili ste vi samo “šusteri” koji pravite komotne (pitanje) i “izglancane” cipele i baš vas briga da li će ih neko stvarno kvalitetno iskoristiti i voljeti nositi i po kiši i po snijegu…. u kazalištu ili na nogometnoj utakmici.
    Smrznem se kad mi kažu da trebamo napraviti strukturu turističkog portala koja mora imati minimalno 15-20 različitih propila zaposlenika (ODJELjENJE INFORMATIČKE TEHNOLOGIJE : web design-er, web programer, administrator informatičkih sustava ODJELJENJE ZA WEB MARKETING, ODJELJENJE ZA RAZVOJ PRODUKTA, ODJEL PRODAJE, ODJEL RAČUNOVODSTVA I FINANCIJA, ako k tome dodate čovjeka za ljudske resurse , pravni support, kontakni centar, ljudi za kontakte na puno jezičnih opcija itd. Mogu nabrajati još dosta relevantnih stručnih profesija za funkcioniranje jednog posla u kojem je centar jedan turistički portal. Ove vaše stručne debate na poznatu temu mi više dođu kao UMJETNOST RADI UMJETNOSTI (lar pur lar) nego kao prezentacija ozbiljnih partnera za posao putem portala, …. ili se možda varam. No do sada nisam sreo ekipu koja bi napravila korak od teorije k praksi i ponudila podjelu rizika…
    Možda je promašena tema, tada oprostite .
    pozdrav ekipi od generacije “pedeset i neke”
    Damir

    • Ivo

      Ivo

      18. 01. 2016. u 11:44 am Odgovori

      Gosp. Petek,

      Moram primjetiti da ste malo pomiješali stvari. Korištenje specijalizirane usluge od strane vanjske firme i traženje partnera u poslovnom poduhvatu nije isto. Je li recimo tražite od firme koja vam vodi knjigovodstvo da vam ne naplaćuje usluge da bi podijelili vaš poslovni rizik? Što nije normalno da firma plaća usluge za koje nije specijalizirana da bi radila što bolje svoj core business.

      To vas ne sprečava da vi ne tražite i ne nađete firmu koja želi raditi na taj način, da ne naplaćuje svoj posao za neku udjel u vlasništvu ili profitu vašeg posla 🙂

      Želim Vam mnogo uspijeha u tome.

    • Eko

      Eko

      18. 01. 2016. u 12:04 pm Odgovori

      Zamislite dodjete u pekaru i kupite kruh. I sad trazite da prodavac u pekari bude odgovoran ako vam kruh padne u blato na pola puta do kuce. Daj ne filozofirajte. Ne pokrecite nista s obzirom da se uzasavate na pomisao da morate radit.

Odgovori

Tvoja e-mail adresa neće biti objavljena.

Popularno

Startupi i poslovanje

Zašto više nije dovoljno biti dobar developer u Hrvatskoj (i zašto ‘freelance’ nije rješenje)

CEO-i Rentlija, Neuralaba, Bornfighta i Locastica u Labinu su razgovarali o tome kako učiniti zaposlenike sretnima, ali i o freelancerima te - podjeli zarade.

Startupi i poslovanje

Taxify, konkurent Uberu, stiže u Hrvatsku: Traže se vozači i Country Manager

Taxify je aplikacija za naručivanje taksi prijevoza, porijeklom iz Estonije, a danas dostupna u gotovo 30 zemalja u Europi, Africi, Južnoj Americi te Australiji. Sudeći prema aktivnim oglasima za posao, uskoro stiže u Hrvatsku.

Digitalni mediji

Učimo o podcastu od domaćih snaga: Podcast inkubator i Surove strasti

Opasnost nije u novim stvarima, već u našem strahu da kad ne znamo - istražujemo, pitamo i učimo. Podcast je na naše prostore došao da ostane, samo je pitanje kada ćete vi naći vremena da saznate o čemu se tu zapravo radi.

Što ste propustili

Društvene mreže

Po Instagram profilu Josipa Budimira nikad ne biste zaključili da je on – gradonačelnik

OK, dobro, možda i biste, jer mu upravo to stoji u biografiji. Ali i usprkos tome, prije biste zaključili da je riječ o jednom od onih pokušaja humora kada neki pametnjaković u biografiju stavi da je direktor Facebooka. Što zapravo i nema smisla ako ste na Instagramu.

Novost

Zbog promocije softvera za varanje u Fortniteu dobili tužbe u stvarnom svijetu

Epic Games se ne šali, u stvarnome svijetu tuži osobe za varanje u video igri, a podrška zajednice za ovo je ogromna.

Startupi i poslovanje

Peter Looker uz 30-godišnje iskustvo i veze u SAD-u želi pomoći hrvatskim tvrtkama u usponu

On je američki poduzetnik čiji su proizvodi u 30 godina obišli mnoge strane svijeta, ali se sa svojim iskustvom i znanjem odlučio smjestiti u Europu. Što je Petera namamilo u našu regiju?

Sponzorirano

Studija slučaja: Kako po prvi put organizirati studentsku praksu u manjoj tvrtki?

Nije jednako organizirati studentsku praksu u timu od stotinu ljudi i u malim tvrtkama gdje često ne postoji jedna osoba ili cijeli tim koji će se samo praktikantima baviti cijelo ljeto.

Društvene mreže

Twitter zbunjuje one koji ga ne koriste, zato opaska ‘retweets ≠ endorsements’ nije dovoljna

Mnogi korisnici Twittera u svoju biografiju dodali su objašnjenje “retweets ≠ endorsements”. No, u pojedinim slučajevima, posebice ako je politika upletena, to neće biti dovoljno da se ogradite od sadržaja koji dijelite - posebice ako taj sadržaj dođe pred oči onih koji Twitter ne koriste.

Prikaz

Za moje sestrične: Dan u životu community managera u Remedy Entertainmentu

"Vida, ne možemo vjerovati da si već deset mjeseci u Finskoj, a mi još uvijek nemamo pojma što ti zapravo radiš", rekle su mi sestrične. Za njih, a i za sve ostale, slijedi moj tipičan radni dan u Remedy Entertainmentu.