Web aplikacija za naručivanje i dostavu hrane – „ZecKomerc“

Prva gimnazija Sarajevo

Mentor: Melisa Dželo

Učesnici projekta: Goran Zec i Zlatko Simišić

Novembar 2022.

Sarajevo
SADRŽAJ

1. UVOD
2. OPIS PROBLEMA
3. PROJEKTNI TIM
4. POSTOJEĆA RJEŠENJA
5. PROCJENA RIZIKA
6. KLJUČNE TAČKE IMPLEMENTACIJE PROJEKTA
6.1 MAPA KORISNIČKOG PUTA
6.2 WIREFRAME
6.3 VIZUELNI DIZAJN
6.4 BAZA PODATAKA
6.5 DIZAJNIRATI FRONT-END
6.6 DIZAJNIRATI BACK-END
6.7 INTEGRIRATI FRONT-END SA BACK-END
6.8 TESTIRANJE APLIKACIJE
7. LITERATURA
 1. UVOD

„ZecKomerc“ je regionalna web aplikacija za usluge dostavljanja gotove hrane i namirnica po

narudžbi koja bi u svom prvom izdanju bila bazirana isključivo na rad u Kantonu Sarajevo.

Uslužna industrija, industrija u onom dijelu privrede koja stvara usluge, a ne materijalne resurse.
Ekonomisti dijele sve ekonomske aktivnosti u dvije široke kategorije, robe i usluge. Industrije koje
proizvode robu su poljoprivreda, rudarstvo, proizvodnja i građevinarstvo; svaki od njih stvara neku
vrstu opipljivog objekta. Uslužne industrije uključuju sve ostalo: bankarstvo, komunikacije,
veleprodaju i maloprodaju, sve profesionalne usluge kao što su inženjering, razvoj kompjuterskog
softvera i medicina, neprofitne ekonomske aktivnosti, sve potrošačke usluge i sve državne usluge,
uključujući odbranu i administraciju pravde. Ekonomija kojom dominiraju usluge karakteristična je za
razvijene zemlje. U manje razvijenim zemljama većina ljudi je zaposlena u primarnim djelatnostima
kao što su poljoprivreda i rudarstvo.

Kao što svjedoči historija ekonomskog razvoja, evolucija od poljoprivredne do industrijske i konačno
do uslužne ekonomije je prirodan i neizbježan proces za određenu zemlju, pa čak i za cijeli svijet.
Ekonomsko društvo u kojem je dominirala poljoprivreda trajalo je barem do sredine osamnaestog i
devetnaestog stoljeća (naravno, to ne vrijedi za sve ekonomije jer se poljoprivredna ekonomija za
nekoliko zaostalih zemalja održala i duže). Industrijska revolucija, koja je nastala u Velikoj Britaniji
1860-ih, zatim se ponovila u Francuskoj, Njemačkoj, Rusiji i drugim evropskim zemljama, te se dalje
proširila na SAD i Japan u devetnaestom stoljeću, započela je novu eru industrijalizacije svjetskom
ekonomijom dominirale su ove zemlje, u kojima je tradicionalna poljoprivredna ekonomija
postepeno zamijenjena novom industrijskom ekonomijom. Otkako su SAD postale prva zemlja koja je
prešla na „uslužnu ekonomiju” sredinom dvadesetog stoljeća, druge zemlje, a posebno razvijene
zemlje, sada su prešle u uslužne ekonomije. Zajedno sa pojavom interneta i ekonomije dominirana
uslužnoj industriji, dovelo je do automatizacije svakodnevnih aktivnosti, kao što je naručivanje hrane
iz restorana.

Dostava hrane preko interneta je sada postala sastavni dio urbanog načina života. I zato se uposlenici
za dostavu hrane mogu vidjeti tokom dana kako na biciklima nose narudžbe sa majicama i kapama
svoje kompanije. Očigledno je da danas ima ogroman broj ljudi koji naručuje hranu preko interneta i
iz godine u godine taj broj samo raste. [1]

2. OPIS PROBLEMA

U prošlosti mušterije su morali unaprijed praviti rezervacije da bi sjeli i uživali u svojoj omiljenoj hrani
koja je bila dostupna samo višoj klasi stanovništva. Jela bi često dugo potrajala za napraviti,a
trpezarije bi bile krcate i bučne. Mnogim ljudima nije smetalo takvo okruženje čak su ga i preferirirai,
ali uvjiek je bila ogromna kolićina koji su ostali nezadovoljani. Sa industrijalizacojom pojavili su se
restorani sa fokusom na brzinu pravljena hrane nego na iskustvo i atmosferu („fast food“), ti
restorani su se dokazali da su veoma profitabilni.

U trenutnom modrenom načinu života, gdje se za zadovoljavajuću platu poslovi postali zahtjevniji i
složeniji, a slobodno vrijeme se skratilo, nastalo je ogromno tržište za dostavu hrane putem
jednostavne i efikasne aplikacije.

Usluga dostave hrane donekle je slična kurirskoj službi u kojoj naručenu hranu iz restorana
dostavljaju do gosta bilo osoblje restorana ili uposlenici kompanije za naručivanje hrane. Ovo očito
ovisi o mediju putem kojeg kupac šalje svoju narudžbu. Narudžbe se mogu izvršiti putem poziva,
mobilnih aplikacija i putem web-portala restorana direktno ili putem restoranove aplikacije. Često se
kupcu naplaćuje naknada za dostavu, a ponekad se čak i ona ukida, ovisno o količini narudžbe. Usluga
dostave hrane također uključuje dostavu namirnica iz supermarketa. Tehnološki napredak dodatno je
učinio usluge dostave hrane brzim i efikasnim, čineći klijente sretnim.

U regionu postoji nekolicina softvera koji svoje usluge izvršavaju na sličan način ali zbog svog niskog
cjenovnika i široke ponude, izvijesno je da će ZecKomerc u kratkom roku preuzeti prvo mjesto na
tržištu bez prevelikog ometanja od trenutne konkurencije. ZecKomerc ima sniženje na dostavu za
studente, prenzionere i lica sa invaliditetom jer je moralna obaveza svih nas da pomognemo onima
kojima je potrebno i osiguramo da budućnost naše zemlje ostane u sigurnim rukama vođenim
pametnim odlukama.[2]

3. PROJEKTNI TIM

ZecKomerc su napravili Zec Goran i Zlatko Simišić, učenici Prve gimnazije u Sarajevu i polaznici
izbornog područja informacionih tehnologija. U vezi ovog projekta, Goran Zec je bio vođa dok je
Zlatko Simišić preuzeo ulogu glavnog inžinjera i testera. Projektni plan je urađen u tandemu a za
dijagram se pobrinuo Goran. Zlatko je zadužen za kreaciju FrontEnd ove web aplikacije a Goran je
napravio BackEnd. Zbog malog raspona tima, sve su uloge podijeljene na Zlatka i Gorana. Zlatko je
izvršio analizu potrebnog vremena i financijskih resursa. Oba člana ovog projektnog tima su
međunarodno licencirani i iskusni softverski inženjeri.

4. POSTOJEĆA RJEŠENJA

Upotreba mobilnih uređaja je gotovo sveprisutna, do 97% za zapadne zemlje, od kojih 85% korisnika
sada koriste pametne telefone. Postoji preko 400 miliona aktivnih web stranica i web aplikacija (od
preko 2 milijarde koliko ih postoji) i preko 8,9 miliona dostupnih mobilnih aplikacija. Prosječna
odrasla osoba dnevno provede 3 sata i 43 minute na svom mobilnom telefonu, na društvenim
mrežama, e-pošti, zabavi, vijestima i online kupovini. Sve u svemu, ovo vrijeme i iskustvo doveli su do
visokih očekivanja u pogledu onoga što potrošači očekuju od interakcije s brendovima na webu.
Korisnici očekuju visoku performansu, personalizaciju, fleksibilnost, sigurnost i još u svim svojim
online iskustvima.

U web aplikaciji, korisnik stupa u interakciju s aplikacijom putem pretraživača, što omogućava razvoj
višekanalne aplikacije koja komunicira sa različitim ciljnim platformama uključujući pametne telefone,
laptope, tablete ili desktop računare. Dobro dizajnirane web aplikacije su također osjetljive, što znači
da su tečne prema veličini ekrana i uređaju koji se koristi.

Imamo različite vrste web aplikacija, a to su:

Statične web aplikacije- ove web aplikacije

- Ove web aplikacije sadrže unaprijed učitani sadržaj koji se šalje u korisnikov
preglednik, ne nudeći personalizaciju. Zbog nedostatka interaktivnosti, neki ljudi ne
smatraju statične web stranice „aplikacijama“.

Dinamične web aplikacije

-Dinamičke web aplikacije koriste obradu na strani servera i klijenta za generiranje koda u
realnom vremenu, što omogućava promjenu prikaza stranice svaki put kada se stranica
osvježi ili doda novi unos. Uobičajeni primjer je blog.
Ekomerc aplikacije

-Dinamična web aplikacija koja podržava kupovinu baziranu na pregledniku. Web

aplikacija za e-trgovinu upravlja bazom podataka proizvoda, narudžbi i plaćanja. Čak i velikani
poput Amazona podržavaju i web i mobilne aplikacije za kupovinu.

Portal web aplikacije

-Dinamična web aplikacija omogućava korisnicima da se prijave u zaštićeno ili

zatvoreno područje za usluge, nepovezane aplikacije ili veze. Čest primjer portala je
Google, koji pruža usluge za pretraživanje, e-poštu i još mnogo toga.

Web aplikacija sistema za upravljanje sadržajem

-Sistem za upravljanje sadržajem( Content manager system ,CMS ) omogućava

korisnicima da kreiraju sopstveni sadržaj bez tehničkog znanja. Primjeri CMS-a bi bili
WordPress.com (za kreiranje sadržaja bloga) ili Canva (za kreiranje dizajnerskog
sadržaja).

Progresivne web aplikacije

-Progresivna web aplikacija (PWA) je web stranica koja podsjeća i ponaša se kao
mobilna aplikacija. I razvoj mobilnih aplikacija i prakse web razvoja dolaze u igru kada se gradi
progresivna web aplikacija.[3]

5. PROCJENA RIZIKA

Pri ovako visokom nivou usluge, procijenjujemo da gotovo nema rizika jer je ZecKomerc napredniji od
svake slićne aplikacije na našim prostorima u mnoštvu aspekata pri kojim je najzapaženija cijena i
efikasna brzina usluga ove aplikacije i njenih dostavljača. Postoji minimalni rizik od nedostatka
dostavljača u burnim satima kao i rizik od snižene zarade ukoliko marketing kampanja ne bude
uspješna. Nije vjerovatno da će doći do toga zbog, našeg pažljivo određenog plana rada. Stručno
obučeni IT inženjeri Zlatko i Goran su mjesecima provodili analizirajući prethodno napravljene
aplikacije za uslugu, ne samo za hranu i namirnice, nego i druga podrućja usluga kao, na primjer,
prijevozna sredstva, da bi napravili algoritam koji će omogućiti najbolju uslugu sa najmanjim brojem
grešaka.
 6. KLJUČNE TAČKE IMPLEMENTACIJE PROJEKTA

Dizajniranje web aplikacije prvo počinje razumijevanjem „user interface“ (UI) i „user experience“ (UX)
– uključujući kako su oni povezani i kako svaki od njih utječe na izbor dizajna u ovoj fazi razvoja web
aplikacije.

Izgledom web aplikacije i pitanjima dizajna kao što su boje, fontovi, smještaj i cjelokupni dizajn bavi
se „user interface“ (UI). Dizajn „user interface“ fokusira se na razvoj interface-a koji je estetski
ugodan za korisnika.

Načinom na koji korisnik komunicira s aplikacijom kroz detaljno razumijevanje onoga što korisnik želi
i osjeća upravlja „user experience“ (UX). UX dizajn je otvoren i postavlja pitanje u svakoj fazi šta
korisnik može poželjeti, trebati i osjećati – i kako se može poboljšati i smanjiti trenje u iskustvu.

6.1 MAPA KORISNIČKOG PUTA

Mapa korisničkog puta je vizualizacija toka korištenja web aplikacije. Prikazuje korisničko iskustvo i
stavlja klijenta na čelo i u centar razmišljanja. Mapiranjem svakog koraka korištenja, lakše je
razumjeti motivaciju, potrebe i izazove koje korisnici doživljavaju.

6.2 WIREFRAME

Wireframes su digitalni, pojednostavljeni vizualni koncepti buduće aplikacije. Oni postavljaju

strukturu, hijerarhiju i odnos između elemenata koji čine proizvod. Možemo zamisliti Wireframe kao
"nacrt" za aplikaciju, front end i back end, kako će mobilna aplikacija izgledati i kako će raditi.

Wireframe može uključivati grafičko dizajniranje pozadinske baze podataka kako bi se imao vizualni
tok rada na koji se može referencirati u kodiranju ili može uključivati testne dijelove koda da se vidi
kako funkcionišu.

6.3 VIZUELNI DIZAJN

Vizualni dizajn je metoda dizajna koja se fokusira na estetiku stranice ili aplikacije. U ovoj fazi,
dizajneri korisničkog sučelja kreiraju mockupove koji pokazuju kako će aplikacija izgledati, birajući
elemente korisničkog sučelja uključujući fontove, sheme boja, ikone, oblike, dugmad, veličine i
proporcije elemenata ekrana, ilustracije i još mnogo toga. Gdje je primjenjivo, ovo će također
uključivati elemente dizajna pokreta kao što su animacije i prijelazi na ekranu.

Ali više od faktora ‘izgleda i osjećaja’, dizajn je prvenstveno vođen faktorom ‘upotrebljivosti i
funkcionalnosti’ UX-a, koji ima za cilj divno i korisno korisničko iskustvo.

6.4 BAZA PODATAKA

Baza podataka (također server) je spremište za web aplikacije. Baza podataka je također odgovorna
za prikupljanje, čuvanje, obradu i upravljanje podacima i obezbjeđivanje sigurnog pristupa tim
podacima. U ovoj oblasti, odluka je relativno jednostavna, sa tržištem baza podataka koji su skoro
zarobljeni sa dva MySQL-a, sa drugim opcijama uključujući MongoDB i PostgreSQL.

6.5 DIZAJNIRATI FRONT-END

Front-end je dio aplikacije koju vidi korisnik. Frontend je razvijen pomoću HTML-a, CSS-a i JavaScript

Popularne front-end opcije za razvoj uključuju Bootstrap, Foundation i JavaScript samo koji uključuju
React, Angular, Vue i Backbone.

6.6 DIZAJNIRATI BACK-END

Backend razvoj uključuje bazu podataka, server i kod web aplikacije.

Popularne opcije za razvoj back-end uključuju Ruby on Rails, Node.js, Flask, Django, Laravel, Swift i
Flutter.

6.7 INTEGRIRATI FRONT-END SA BACK-END

Proces integracije API-ja pomaže u povezivanju front-end-a sa back-end API-jima kako bi se

omogućila razmjena podataka.

6.8 TESTIRANJE APLIKACIJE

Testiranje pomaže da se osigura da aplikacija radi kako se očekuje (pozitivno testiranje) i da može
podnijeti neočekivane uvjete (negativno testiranje).
Testiranje počinje tokom razvoja – testovima jedinica, komponenti i integracije – i nastavlja se kroz
razvoj prema korisničkom iskustvu, gdje testiranje zatim uključuje specifične povratne informacije
korisnika.[3]

7. LITERATURA

[1] “Service industry”; The Editors of Encyclopaedia Britannica

https://www.britannica.com/topic/service-industry

[2] ”The history, evolution and principles of services marketing: poised for the new millennium”; Martin C.L.

https://www.emerald.com/insight/content/doi/10.1108/02634509910301133/full/html

[3]” A 15-Step Guide on How to Build a Web App”; Akash Lomas

https://www.netsolutions.com/insights/how-to-build-a-web-app/