Case studies
LIN TRGOVINA
Website & E-commerce
CASE STUDY
GENERALNI OPIS
Lin Trgovina dugi niz godina nudi veliki asortiman različitih proizvoda u svojim trgovinama. Njihova postojeća web trgovina "svezakucuidom.com" je zastarjela dizajnom i funkcionalnošću. Tvrtka je trebala novi i svježi izgled, nove funkcionalnosti te responzivnu stranicu kako bi poboljšali iskustvo, što postojećih što novih, kupaca. Stari sustav nije mogao pratiti potrebe koje su se javljale te je odlučeno da se napravi redizajn i da se pređe na sigurniji i bolji sustav koji se konstantno razvija. Tako smo došli do Magento CE sustava koji prati dobar glas i široko se koristi.
Od samoga početka smo nailazili na izazove poput "razbacane" postojeće baze od preko 50 000 artikala, podijeljenih u preko 450 kategorija. Prilikom "prebacivanja" stare baze na novi sustav, odradili smo i reorganizaciju kategorija te smisleno smanjili broj kategorija za ~ 50.
Novi sustav je također morao omogućiti lakši unos novih proizvoda, multikategoriziranje proizvoda, lakše provođenje cijelog proces od narudžbe do kupovine, kako na stranici za kupca tako i za administratora u sustavu.
Magento CE nam je, uz manje preinake i dorade, sve to omogućio. Uz standardne mogućnosti dodali smo fiskalizaciju, napravili posebne module za prikaz odredenih grupa proizvoda (npr. najnoviji i najprodavaniji moduli), ugradili WSPay payment gateway. Nadalje, vrlo bitna stavka je bila ažuriranje stanja i cijena artikala, za što smo napravili poseban modul preko kojeg administrator lako ažurira oboje.
Responzivni dizajn
Razviti mobilni prikaz za web trgovinu s preko 50 000 artikala nije bilo lako. Trebalo je prilagoditi i omogućiti korisniku jednostavan i intuitivan prikaz artikala, spajanja na sustav, pregleda košarice i artikala za usporedbu i, najbitnije, postupak narudžbe. Odlučili smo se za pristup fiksirane navigacije kako bi korisnik u bilo kojem trenutku imao pristup svim kategorijama, kao i ključnim elementima poput pregleda košarice, profila, artikala za usporedbu te mogućnosti da se registrira.
Mobilni prikaz "sakriva" sve sekundarne akcije koje bi mogle smetati u pregledavanju artikala, a one se mogu pozvati klikom na određene elemente, poput filtera proizvoda. Ovim pristupom korisnik može nesmetano pretraživati artikle te po potrebi pozvati filtere, sortiranje ili slično.
Proces narudžbe je pojednostavljen radi malog prostora kojim se raspoaže na mobilnim uređajima.
CUSTOM APP
MAGENTO APPLIKACIJE
Prilagodba prikaza narudžbi
Administratorski dio sustava za prikaz narudžbi je velika tablica podataka, te smo na zahtjev klijenta napravili prilagodbu prikaza narudžbi s posebnim podacima te ,radi njihovog lakšeg procesuiranja, pozadinskim bojama koje označavaju stanje narudžbe.
Klijent je imao potrebu za brzim prikazom broja narudžbe i kopiranja narudžbe, pa smo mu omogućili da jednim klikom miša to i dobije.
Prilagoba prikaza proizvoda
Obzirom na količinu narudžbi i brzinu njihovog procesuiranja klijentu je bilo vrlo bitno imati samo određena polja na prikazu proizvoda. Napravili smo prilagodbu prikaza koji prikazuje samo klijentu bitne informacije, te sliku samog proizvoda.
Fizskalizacija
Zbog nedavne promjene zakona u Hrvatkoj, prema kojemu sva plaćanja kreditnim karticama se tretiraju kako gotovinsko plaćanja, pa adekvatno tome moraju biit fiskalizirani, morali smo implementirati fiskalizaciju u Magento. Na sreću kolege iz Inchooa su već napravili odrešenu verziju Magento modula za fiskalizaciju, pa nismo morali raditi od početka. Zbog toga što je od trenutka kada su kolege napravile navedeni modul izašlo par novih verzija Magenta, morali smo napraviti određene preinake i dorade, da bi ga mogli implementirati. Zbog toga što Fina kod storno računa očekuje račune u minusu pri fiskalizacija, morali smo prilagoditi i credit memo sistem u samom Magentu.
Online plaćanje
Za plaćanje kreditnim karticama, odabrali smo WsPay payment gateway sustav, jer su najpovoljniji, imaju kvalitetan sustav, koji se lako implementira, te smo također partnerske firme. Pored plaćanja kreditnim karticama, potrebno je bilo implementirati i plaćanje paypal-om, što u pravilu nije problem, jer Magento već ima implementirano paypal plaćanje. Nažalost, u Hrvatskoj je malo drukčija stvar. Paypal ne priznaje Hrvatsku valutu kao sredstvo plaćanja, tako da je bilo potrebno implemetirati konverziju iz kune u Euro prilikom slanja cijene prema paypalu.
AQUAESTIL
Website, design, custom application
CASE STUDY
GENERALNI OPIS
Ovaj projekt je bio pravi izazov. Već nakon prvog tehničkog sastanka dogovorili smo u kojem smjeru ćemo ići, dobili smo zeleno svjetlo za korištenje modernih tehnologija te smo dobili zadatak napraviti nešto "Vau".
Nakon zašarane ploče, išaranih shema i dobrih ideja, odlučili smo raditi dizajn s 2 strane. 2 dizajnera, 2 unikatna dizajna, jedan projekt.
Nakon tjedan dana rada i puno internih ideja, imali smo 2 prijedloga dizajna koji smo odlučili prezentirati klijentu, s obzirom da su se klijentu sviđala oba dizajna, ali u svakom je bilo nešto posebno, zajedno smo došli do zaključka kako ćemo uzeti najbolje iz svakog primjera i napraviti treći. Možemo reći da je klijent bio zadovoljan jer je rekao: "To je to! Svaka čast!"
Prilikom razvoja stranice koristili smo se modernim tehnologijama koje će tek zaživjeti u punom sjaju. Sve grafike i ikone su SVG radi bržeg učitavanja stranice a i mogućnosti animiranja.
Pored dizajna, veliki izazov je bio i napraviti kvalitetno korisničko sućelje za adminisrtraciju kompletne baze podataka svih proizvoda koji su trebali biti prikazani na stranici.
Responzivni dizajn web stranice
Kod pripreme i izrade samog dizajna imali smo na umu da se stranica mora prilagoditi svim uređajima. Svjesni te činjenice, koristili smo "Mobile First" pristup kod razvoja stranice. To je tehnika razvoja gdje je primarni fokus mali ekrani (ugl. mobitel) te se postupno sadržaj prilagodava većim ekranima.
Glavni izazov je bio prikazati toliko proizvoda s podkategorijama na malom ekranu. Obzirom na vrlo kvalitetne fotografije proizvoda, odlučili smo prikazati jedan proizvod u redu na malim standardnim ekranima, dok se postupno s povećanjem veličine ekrana povećava i broj prikaza proizvoda.
Glavni izbornik na "mobilnoj verziji" je sakriven, te se aktivira na dobro poznati "hamburger menu" ikonu (☰). Stavke u glavnom izborniku koje sadžavaju podizbornik naglašene su znakom "+" kako bi se korisniku sugeriralo da se tu nalazi podizbornik.
SET IKONA
Obzirom da nismo bili zadovoljni sa ikonama koje smo imali na raspolaganju na internetu, kolega dizajner je nacrtao vlastite ikone, koje su na kraju dale posebni touch stranici. Set ikona možete vidjeti ovdje...
CUSTOM APLIKACIJE
JOOMLA EKSTENZIJE (dodaci)
ASORTIMAN
Izradili smo kompletnu komponentu za unos Aquaestil asortimana sa 7 kategorija, te s podkategorijama. Svaki proizvod je morao imati sve opise, nazive, itd. na više jezika. Izrada baze podataka za navedenu komponentu nije bila laka. Koliko su proizvodi iz različitih kategorija različiti, toliko su i slični, tako da je potrajalo dok smo našli najbolji omjer tablica i polja, tako da baza bude što više optimizirana, a opet funkcionalna.
Zbog toga što je jako puno proizvoda i još više slika proizvoda, a mnoge su bile neoptimizirane, morali smo raditi automatsku obradu slika u samoj komponenti.
Pored samog unosa proizvoda, morali smo povezati proizvode, zato što se neki mogu kombinirati, poput tuš kada u pravana.
DISTRIBUTERI
Izrađena je komponenta za unos i prikaz svih Aquaestil distributera na interktivnoj karti. Administratorski dio komonente na jednostavan i brz način omogućava dodavanje novih ili uklanjanje nepostojećih distributera.
Karta ima mogućnost filtriranja po državi i/ili gradu. Filtriranje grada ovisi o odabranoj državi te je time olakšano korištenje i filtriranje distributera.
U komponentu je također ugrađen i Google GeoCoding, tako da se ne bi moralo za svakog distributera ručno unositi geografska dužina i širina za prikaz na karti.
PRETRAŽIVANJE
Izradili smo modul za pretraživanje asortimana po specifičim parametrima. Modul nudi mogućnost pretraživanja kada i tuš kada po obliku, mogućnosti ugradnje te dimenzijama.
Modul je tako izrađen da se odabirom prvih parametara broj mogućnosti kod dimnezija automatski smanjuje kako bi pretraživanje bilo što točnije i brže.
PORTAL ZA MLADE
Website, design, custom application
CASE STUDY
CENTAR ZA MLADE
Projekt koji smo odradili za Carpe Diem (udruga za poticanje i razvoj kreativnih i socijalnih potencijala djece, mladih i odraslih) s velikim "guštom" jer je direktno utjecao na informiranje naših sugrađana.
Nakon 2 do 3 kraća sastanka, imali smo glavne smjernice - portal mora biti veselih boja, pun informacija, lako dostupan i najbitnije responzivan, jer će portal najviše gledati mladi ljudi sa svojih mobitela.
Imajući te informacije na umu, dogovorili smo razvijati ovaj projekt s 2 strane. 2 dizajnera,2 skice, 2 unikatna dizajna, jedan projekt i jedan sretan klijent. Već nakon prve iteracije dizajna s klijentom, došli smo do rješenja koje je prihvaćeno. Čak smo imali i nadimak za dizajn oko kojeg smo se složili, nazvali smo ga "šuma".
U konstantnoj komunikaciji s klijentom, dorađivali smo određene detalje i funkcionalnosti. Uz intenzivno testiranje portala na svakojakim uređajima (da, čak su korišteni i neki "ancient" uređaji) projekt je relativno brzo i uspješno završen.
Responzivan dizajn
Prilikom pripreme i izrade samog dizajna, imali smo na umu da se stranica mora prilagoditi svim uređajima. Svjesni te činjenice, koristili smo "Mobile First" pristup kod razvoja stranice. To je tehnika razvoja gdje je primarni fokus mali ekrani (ugl. mobitel) te se postupno sadržaj prilagodava većim ekranima.
Izbornik je sakriven kako ne bi oduzimao dragocjeni prostor te se aktivira na "hamburger menu" ikonu (☰). Takoder smo radi iskorištavanja prostora odlučili maknuti slike prilikom listanja vijesti na naslovnoj stranici.
Kalendar događanja je bio izazov zbog količine informacije koju prikazuje. Filteri su sakriveni u izbonik koji se poziva odabirom "Filteri" te je prikaz događanja postavljen na današnji dan. Ostavili smo male dijelove prethodnog i sutrašnjeg dana kako bi korisnika naveli na "swipe" te ukazali da može listati dane micanjem prsta lijevo/desno po ekranu. U slučaju da korisnik ne primjeti tu funkcionalnost, postavili smo strelice lijevo/desno kako ne bi bilo zabune.
CUSTOM APP
JOOMLA EKSTENZIJE (dodaci)
KOMPONENTA ZA DOGAĐANJA
Izrađena je komponenta za događanja prema naputcima klijenta, tamo gdje standardne mogućnosti Joomla CMS-a nisu bile dovoljne. Komponenta ima mogućnost kreirati "događaj" koji sadrži ime, vrijeme početka, vrijeme završetka, lokaciju s interaktivnom kartom preko koje je moguće odrediti položaj, opis, generiranja poveznica prema društvenim mrežama (facebook, twitter, google+) te podatke o organizatoru. U komponentu je ugrađena i mogućnost generiranja link nakojem se može dobiti iCal format. Komponeneta također ima opciju da se određeni događaj ponavlja u određenim intervalima, što ju čini vrlo korisnom pogotovo kad se neki događaj ponavlja na tjednoj ili mjesečnoj bazi.
KOMPONENTA ZA PRIJAVU DOGAĐANJA
Ova komponenta je izravno povezana s komponentom za događanja. Nakon što korisnik na stranici prijavi događaj, administrator ima sve potrebne informacije da objavi taj događaj na stranici i to može učiniti jednim klikom. Naravno, ima i mogućnost editiranja iste prijave ako nedostaje neka informacija ili ako želi nešto promjeniti. Ova komponenta uvelike pomaže jer korisnici imaju mogućnost dojaviti događanja za koje administratori možda ne znaju, što ovaj portal čini izuzetno korisnim i privlači posjete.
DRAFT DOBROVOLNIKOV
Website, design, custom application
CASE STUDY
GENERALNI OPIS
Definitivno izuzetno poseban projekt. Pored činjenice da je trebalo napravit funkcionalni portal u vrlo kratkom roku od samo mjesec i pol dana, ovo je bio naš prvi međunarodni projekt. Zadatak je bio napraviti portal na kojemu će organizacije moći pronaći potrebne volontere, ta omogućiti komunikaciju među volonterima. Najveći izazov u početku je bio kako realizirati konstantnu komunikaciju sa klijentom i koje alate koristit za te potrebe. Za komunikaciju pri izradi dizajna, odabrali smo cloud rješenje UXPin. UXPin nam je omogućio kontinuirani feedback od strane klijenta, tako da smo uspijeli u kratkom roku odraditi kompletni dizajn sa kojim je klijent bio jako zadovoljan, unatoč činjenici da nas dijeli preko 700Km.
Osim dizajna i komunikacije, izazov je bilo u kratkom roku isprogramirati sve funkcije i mogućnosti portala, te odraditi testiranje prije puštanja u produkciju. Portal je morao sačinjavati komponentu za pretraživanje i ažuriranje edukacijskih programa, te detalja istih. Najveća komponenta na portalu je dio vezan uz bazu podataka volontera, za koju je trebalo napraviti administracijski dio za ažuriranje iste, te front dio koji bi koristili volonteri za međusobnu komunikaciju, te organizacije za pronalazak volontera i komunikaciju sa njima.
Responzivni dizajn
Prilikom pripreme i izrade samog designa, imali smo na umu da se stranica mora prilagoditi svim uređajima. Svjesni te činjenice, koristili smo "Mobile First" pristup kod razvoja stranice. To je tehnika razvoja gdje je primarni fokus mali ekrani (ugl. mobitel) te se postepeno sadržaj prilagodava većim ekranima.
Glavni izbornik na "mobilnoj verziji" je sakriven, te se aktivira na dobro poznati "hamburger menu" ikonu (☰). Zaglavlje stranice koje uključuje ikonu za izbornik, logotip te pretraživanje se na mobilnom prikazu pokazuje kada se korisnik krene vraćati prema vrhu stranice. Na taj način zaglavlje ne smeta i ne zauzima dragocjeni prostor na uređajima s malim ekranima (ugl. mobiteli) a opet korisniku daje mogucnost da otvori izbornik ili pretraživanje na brz i laki način.
Obzirom na vrstu projekta, većina podataka je prikazana u tabličnom prikazu što je predstavljalo problem. Obzirom na iskustva iz prijašnjih projekata, povratnih informacija i razgovora s klijentom, odlučili smo ostaviti tablice u punoj širini i ne preslagivati ih vertikalno. Postavili smo indikatore koji sugeriraju korisniku da pomakom prsta lijevo/desno može pregledati sve podatke u tablici koji u tom trenutku nisu vidljivi na malom ekranu.
CUSTOM APP
JOOMLA APPLIKACIJE
APLIKACIJA ZA OBRAZOVANJE
napravili smo Joomla komponentu, koja omogućuje unos edukacijskih programa kroz administraciju stranice, te ispis istih na portalu. Posjetitelji na portalu također mogu ostaviti svoj komentar na edukacijski program, te prijaviti se za isti. Obzirom da se radi o bazi podataka edukacijskih programa, morali smo narpaviti i modul za pretragu programa prema određenim paarametrima.
APLIKACIJA ZA VOLONTERE
Napravili smo Joomla komponentu, koja ima tri vrste korisnika, te prema tome različite vrste korisnika vide različite dijelove komponente. Administratori vide sve, te unose i ažuriraju bazu podataka volontera kroz administraciju stranice. Organizacije i volonteri imaju pristup drugom dijelu, koji je također zaštićen sa loginom. Organizacije mogu pretraživati volontere , vidjeti njihov profil i komunicirati sa njima. Volonteri imaju mogućnost nadopunjavati svoj profil.
JOB CLUB FOR YOUTH
Website, design, custom application
CASE STUDY
GENERALNI OPIS
Udruga CARPE DIEM iz Karlovca je pokrenula projekt"JOB CLUB FOR YOUTH", te su nam jos jednom povjerili svoj projekt. Projekt je bio financiran kroz EU fondove, tako da je ostarta bilo određenih pravila kojih smo se morali držati.
Projekt je bio specifičan zbog toga što je dio web stranice, koji je bio namjenjen javnosti, bio jedna stranica, običan single page web, dok je ostatak trebao biti kompletan portal, odnosno mini web apliacija. Kroz taj dio voditelji projekta su trebali moći voditi sve korisnike i infomracije o njima, te sami su sami polaznici projekta morali moći doči do potrebnih informacija i podataka, ključnih za sudjelovanje u prpjektu.
Pored voditelja projekta i polaznika, aplikaciju su koristili i poslodavci i HZZ (Hrvatski zavod za zapošljavanje). Poslodavcisu imali mogućnost pregleda polaznika i njihovih CV i video CVa. Dok je HZZ koristio određeni dio aplikacije za potrebe vođenja evidencije konzultacija polaznika, koje je HZZ preuzeo nakon odrađene edukacija u Centru za mlade.
OPĆI I SPECIFIČNI CILJ PROJEKTA "JOB CLUB FOR YOUTH":
Smanjiti broj nezaposlenih mladih ljudi u gradu Karlovcu te povećati njihovu socijalnu uključenost, dok je njegov specifični cilj razviti usluge za nezaposlene mlade kroz koje će stjecati vještine traženja posla i dodatna znanja potrebna na tržištu rada.
GLAVNA CILJNA SKUPINA:
96 Nezaposlenih mladih iz grada Karlovca
PROJEKTOM JE PLANIRANO POSTIĆI SLJEDEĆE REZULTATE:
troje predstavnika civilnog društva je educirano za rad s mladima nezaposlenima, kreiran je i primijenjen plan rada kluba za zapošljavanje, 96 nezaposlenih mladih steklo je vještine traženja posla, najmanje 10 stručnjaka-volontera uključeno je u rad s nezaposlenim mladima, uspostavljena usluga za bolje povezivanje tražitelja posla i poslodavaca
Responzivni dizajn
Prilikom pripreme i izrade samog designa, imali smo na umu da se stranica mora prilagoditi svim uređajima. Svjesni te činjenice, koristili smo "Mobile First" pristup kod razvoja stranice. To je tehnika razvoja gdje je primarni fokus mali ekrani (ugl. mobitel) te se postepeno sadržaj prilagodava većim ekranima.
Kod prilagodbe stranice mobilnim uređajima, znali smo da je fokus stranice postojeći ili budući sudionik projekta te smo u pri plan stavili obrazac za spajanje ili registraciju.
Glavni izbornik na "mobilnoj verziji" je sakriven, te se aktivira na dobro poznati "hamburger menu" ikonu (☰).
Obzirom na vrstu projekta, većina podataka je prikazana u tabličnom prikazu što je predstavljalo problem. Nakon razgovora s članovima udruge i već tada postojećim sudionicima, došli smo do zaključla da je bolje ostaviti tablice u punoj širini i ne preslagivati ih vertikalno. Postavili smo indikatore koji sugeriraju korisniku da pomakom prsta lijevo/desno može pregledati sve podatke u tablici koji u tom trenutku nisu vidlljivi na malom ekranu.
Kod prikaza materijala koji su polaznici mogli preuzimati, koristili smo "Accordion" pristup.
CUSTOM APP
JOOMLA EKSTENZIJA "Job Club For Youth"
Profil nezaposlenog sudionika
Potrebnoo je bilo napraviti korisničko sučelje kroz koje su mogli sudionici unositi svoje podatke vezane uz CV, detalje obrazovanja, zapisivat bilješke tokom edukacije, te rezultate pokušaja zapošljavanja za vrijeme trajanja projekta. Iste stvari su morali moći administratori pratiti i uređivati po potrebi. Napravljena je također posebna sekcija gdje su sudionici mogli preuzeti dokumente vezane uz edukaciju. Na prvoj strani, nakon logina, "Dashboard", sudionici su imali listu obavijesti koje su im voditelji edukacija moglu ostaviti, te vidjeti kada imaju iduću edukacija i preuzeti kompresirane(zip) materijale za istu.
Poslodavci
Poslodavci su također imali login u aplikaciju, te se njihovo sučelje moralo razlikovati od sučelja sudionika. Poslodavci su mogli pretraživati sudionike projekta i pregledavati njihove profile.
Hrvatski zavod za zapošljavanje
Nakon završene edukacije u Centru za mlade, sudionike je nestavio pratiti HZZ, za tu potrebu, morali smo napraviti mogućnost da se osoblje HZZ-a može ulogirati u administraciju aplikacije, ali da nema sva prava i mogučnosti u aplikaciji. Također smo napravili posebni dio aplikacije, kroz koji je HZZ mogao bilježiti zabilješke vezane za konzultacije sa sudionicima u toku praćenje.
Web stranice sa aplikativnim riješenjima
Autostransport Karlovac
- Joomla CMS
- Responzivni dizajn i programiranje
- Joomla komponenta za autobusne linije
- Online plaćanje kreditnom karticom
Restoran Panorama
- Joomla CMS
- Responzivni dizajn i programiranje
- Joomla CMS modul za jednostavno ažuriranje dnevne i tjedne ponude jela, slanjem excel tablice na određenu email adresu.
Autokuća Novosel
- Joomla CMS
- Responzivni dizajn i programiranje
- Joomla komponenta za unos i ažuriranje rabljenih vozila, te sinkronizaciju istih sa Njuškalo portalom
CROPEX
- Joomla CMS
- Responzivni dizajn i programiranje
- Joomla komponenta za grafički prikaz i pretragu podataka vezanih za trgovanje na burzi
Your Croatia Holiday
- Booky - vlastita aplikacija za upravljanje smještajnim kapacitetima u turizmu
- Responzivni dizajn i programiranje
- Upravljanje smještajnim kapacitetima
- Pretraživač raspoloživosti
- Plaćanje kreditnim karticama
Borghetto Villas
- Booky - vlastita aplikacija za upravljanje smještajnim kapacitetima u turizmu
- Responzivni dizajn i programiranje
- Upravljanje smještajnim kapacitetima
- Pretraživač raspoloživosti
- Plaćanje kreditnim karticama
Istria Villas
- Booky - vlastita aplikacija za upravljanje smještajnim kapacitetima u turizmu
- Responzivni dizajn i programiranje
- Upravljanje smještajnim kapacitetima
- Pretraživač raspoloživosti
- Plaćanje kreditnim karticama
Dea salon
- Joomla CMS
- Responzivni dizajn i programiranje
- Joomla komponenta za rezervaciju i upravljanje terminima
Sunčani dom
- Joomla CMS
- Dorada postojećeg dizajna i programiranje
- Prilagodba dizajna za mobilne uređaje
- Joomla komponenta za upravljanje nekretninama
- Povezivanje sa Dimedia nekretnine aplikacijom.
- Joomla modul za pretraživanje nekretnina
Gimnazija Karlovac
- Joomla CMS
- Responzivni dizajn i programiranje
- Joomla kompoennta za ažuriranje učenika i pretraživanje istih po razredima
- komponenta za prikaz digitalizirane baštine
Ostale reference
