+ 381 64 17 39 157 office@cyclopdesign.com
Da li je dizajn korisničkog interfejsa na mobilnim aplikacijama gubljenje vremena i novca?

Da li je dizajn korisničkog interfejsa na mobilnim aplikacijama gubljenje vremena i novca?

Sve je više kompanija koje konstantno menjaju svoj dizajn i menjaju pravac u korisničkom interfejsu. Cilj je izdvojiti se od konkurencije. Mnogi zapošljavaju velike timove UI dizajnera da rade na prilično jednostavnim proizvodima. Kada je reč o mobilnim aplikacijama, može se reći da se više radi o marketinškom triku.

 

UI-dizajn-mobilnih-aplikacija2

 

Tipičan redosled kreiranja aplikacije izgleda otprilike ovako:

  • Koncept razvoja
  • Skiciranje ekrana
  • Crtanje wireframe-ova
  • Definisanje korisničkog iskustva (UX)
  • Dizajniranje korisničkog interfejsa (UI)
  • Razvoj proizvoda

 

UI-dizajn-mobilnih-aplikacija3

 

Napredni i kvalitetni stilovi koje definišu Google i Apple nas teraju da se zapitamo zašto je dizajn korisničkog interfejsa neophodan i zašto zahteva ponekad ceo tim dizajnera. Ukoliko već imamo smernice, zašto nije dovoljno samo poštovati ih, bez nekih značajnih promena u dizajnu? Stilovi i važni parametri su definisani tim smernicama. Bitan element na aplikacijama su ikonice dugmići, ali se nameće pitanje zašto aplikacije na istoj platformi ne koriste jedan tip ikonica.

Aplikacije koje se kreiraju preko platformi su mnogo više dosledne. Što znači da su međusobno slične i da se ne razlikuju od drugih aplikacija. Mnoge kompanije posmatraju aplikacije kao zasebnu celinu. Sve aplikacije u okviru nekog sistema moraju biti u skladu, bez obzira na nedostatke koje imaju IOS i Android. Neke aplikacije koriste back strelice, neki upotrebljavaju hamburger menije, a neki čak i imaju navigacije kao na desktop sajtovima. Mnogi dizajneri konstantno traže nove i uzbudljive načine za navigaciju. Sve ovo može zbuniti korisnike.

 

UI-dizajn-mobilnih-aplikacija4

 

Korisnički interfejs i UX svih aplikacija mora da bude u svom najboljem izdanju uvek. Na kraju krajeva to je način da vidite sadržaj i upoznate se sa određenim brendom i uslugama i proizvodima tog brenda.

 

UI-dizajn-mobilnih-aplikacija5

 

Google-ova najnovija verzija Youtubea je primer efikasno korišćenih stilova. Ikone su podrazumevane, postoji jednostavna navigacija, boje i njihov kontrast su korektni. Bez upotrebe ikakvih trikova i dopuna korisničkog interfejsa, UX je dobar i u skladu sa kompletnim sistemom.

 

UI-dizajn-mobilnih-aplikacija6

 

Loš primer je Snapchat. Aplikacija je nedosledna, nije konzistentna sa dosadašnjim stilom, a umesto toga iz Snapchata su bili više skoncentrisani na vizuelni momenat aplikacije nego na funkcionalnost. Sve je loše uklopljeno sa Androidom, a ima malo razlika između varijante za Android i za IOS. Ovo je tipičan primer preterane želje da budu jedinstveni i samim tim korisnički interfejs, kao i iskustvo nisu dobri.

Nevezano za Snapchat, interesantna bi nam bila informacija o veličini dizajn timova. Da li imaju 10, 20 ili 30 dizajnera. Da li rade na svim ekranima i da li razmišljaju o korisničkom iskustvu. Konstatno lutanje, menjanje stilova u sistemu, može biti zbunjujuće i ovakvu praksu bi trebalo izbegavati. Takođe može smanjiti efikasnost, a povećati cenu i izgubljeno vreme. Korisnički interfejs polako ali sigurno počinje da se zloupotrebljava u marketinške svrhe, a to nikako ne bi smelo da se radi.

Dizajneri korisničkog interfejsa bi trebalo da već definisan korporativni identitet, stilove i brending implementiraju u aplikaciju, dodaju ikonice i kreiraju efikasne langing stranice koje će služiti svojoj primarnoj svrsi. Ovakvim pristupom bi mobilni sistemi bili mnogo funkcionalniji i prilagođeni jedinim osobama kojima su zapravo bitni – korisnicima.

20 razloga zašto posedovanje besplatnog websajta nije najbolja ideja

Ukoliko koristite WordPress neko vreme, verovatno ste primetili da postoji mnogo odličnih tema koje su besplatne, dostupne za preuzimanje i koje mogu biti modifikovane prema vašim željama.

Verovatno se pitate, zašto su mnoge uspešne kompanije potrošile veliki novac na kreiranje sajtova od nule, prema svojim zahtevima i potrebama. Kreiranje besplatnog websajta za vaš brend, kompaniju, usluge nije uvek najbolja ideja. Štaviše, trebalo bi izbegavati.

Razlozi su prilično jasni:

  • Neprofesionalan i nerelevantan dizajn

Kada želite bespatan sajt, morate se suočiti sa kompromisima po pitanju layouta sajta. Možda dizajn neće zadovoljiti vaše potrebe, možda taj dizajn neće biti potpuno intuitivan korisnicima, pa će teže dolaziti do informacija ili sprovesti određenu akciju na vašem sajtu.

  •  Sporo se učitavaju

Najbolja stvar u vezi sa besplatnim sajtovima je uglavnom boja, grafika, poneka animacija. Tako da će zato neiskusni klijenti imati osećaj da dobijaju kvalitetan proizvod za malo para. Međutim ovakvi sajtovi su ograničenje za samo poslovanje. Besplatni sajtovi, koji imaju mnogo elemenata se sporo učitavaju i mogu biti frustrirajući za korisnike.

  • Nisu bezbedni

Kada nemate napisan programski kod od strane nekoga kome verujete, postoji mogućnost da vaš sajt ne bude bezbedan, podložan hakerskim napadima. Ovakve stvari obično izlaze na videlo tek posle nekog vremena korišćenja besplatne teme.

 

izrada-web-sajtova-20razloga

 

  • Skriveni kod

Osim grešaka u pisanju skripti, besplatni sajtovi će najverovatnije sadržati skrivene kodove, koji mogu vam mogu smetati u nekoliko situacija. Nikada ne možete znati da li su vaši podaci “procureli” negde, što ponekad može biti vrlo ozbiljno.

  • Nedostatak tehničke podrške

Samim tim što je nešto besplatno, neće imati tehničku podršku dostupnu klijentima. U slučaju nekog problema, nećete znati razlog.

  • Problemi sa kompatibilnošću

Mnoge besplatne teme će izazvati probleme sa kompatibilnošću sa pluginovima i ostalim ekstenzijama koji će vam biti potrebni za funkcionalnost sajta. Besplatne teme se ne update-uju pa je moguće da u nekom trenutku padne ceo sajt.

  • Nedostatak SEO elemenata

Kada pravite sajt, cilj vam je da on bude dostupan što većem broju ljudi i da što veći broj ljudi čuje za njega. Besplatna tema će zahtevati da ima adekvatne H1 tagove, Meta opise, biće spor za očitavanje i vrlo često neće biti responsive.

 

izrada-web-sajtova-20razloga1

 

  • Neispravni canonical linkovi

Nespravni canonical i recanonical linkovi mogu biti skupa greška i često su deo besplatnih tema sajtova.

 

  • Loše i neefikasne web adrese

Besplatni sajtovi će uvek imati za cilj da reklamiraju kreatora, tako da će domen biti “primer.besplatniwebsajt.com”. Ukoliko hoćete da prezentujete određeni brend, ovo je totalno neprofesionalno.

 

  • Mogućnost zaključavanja podataka

Na pojedinim besplatnim temama, sajtovima, moguće je da dizajneri “zaključaju” sve podatke. U slučaju da želite redizajniran sajt, nećete moći da prebacite podatke sa ovog sajta.

 

  • Nerelevantne reklame

U pojedinim slučajevima besplatni sajtovi mogu da sadrže banere i reklame koje su totalno nerelevatne i nepovezane sa vašim brendom. Ukoliko mislite da je to kompromis, razmislite još jednom.

 

  • 404 stranice

Kod besplatnih sajtova, developeri uvek mogu da ugase vaš sajt. Ne želite da se to desi.

 

izrada-web-sajtova-20razloga2

 

 

  • Vaše informacije su “ranjive”

Kada postavite određene informacije na dashboard besplatnog sajta, postoji šansa da one budu dostupne developerima tog sajta. Te informacije mogu biti prodate konkurenciji ili iskorišćene na nekom drugom sajtu ili nekim drugim okolnostima.

 

  • Building tools

Za razliku od pravog web hostinga, besplatne teme imaju ograničen broj alata koje možete koristiti i nekad nećete moći da unapredite svoj dizajn i samim tim će sajt izgledati još neprofesinalnije.

 

  • Distribucija virusa

Bilo je nekoliko slučajeva gde su virusi distribuirani putem bepslatnih sajtova. Korisnici vašeg sajta su u potrazi za informacijama dobio te viruse i neke skrivene skripte.

 

  • Vaš sajt može postati spisak linkova

Ne želite da vaš sajt bude platforma za deljenje linkova neki igrica, neukusnog video materijala, nelegalnih proizvoda ili nečeg drugog.

 

  • Mali prostor na memoriji

Hosting provajderi besplatnih sajtova obično imaju hiljade i hiljade različitih sajtova i to samim tim ograničava prostor na memoriji na serveru.

 

izrada-web-sajtova-20razloga3

 

  • Limitiran propusni opseg

Propusni opseg košta i besplatni sajtovi će vam ponuditi veoma mali i ograničen propusni opseg. Ukoliko želite da unapredite vaš posao, biće vam potrebno da dodajete stranice, slike, proizvode, tako da tu može biti problema sa besplatnim sajtovima.

 

  • Ograničene mogućnosti dizajna

Vaš sajt mora biti ogledalo vašeg poslovanja. Ne želite da imate sajt, na osnovu koga niko neće znati ništa o vašem brendu.

 

  • ZAPAMTITE – Besplatno nije uvek besplatno

Besplatni sajtovi nisu uvek besplatni. U velikom broju slučajeva su zapravo probna verzija i posle nekog perioda morate platiti da nastavite da ih koristite. U toj situaciji, ukoliko ne želite da gubite vreme i novac na novi dizajn, nećete imati izbora.

Besplatno je često samo paravan za skrivene troškove, koji ponekad mogu biti preveliki. Uvek je bolje investirati u dizajnera ili marketinšku agenciju i to je jedini način da dobijete ono što želite. Cilj ovog teksta je bio da vas upoznamo kakve rizike nosi korišćenje besplatnih tema, besplatnih sajtova i platformi za pravljenje sajtova. Nadamo se da smo uspeli.

 

Lepota ultra-minimalističkog web dizajna

Prethodnih nekoliko godina, bili smo svedoci mnogih trendova koji su se pojavili i zastareli. Dok će nekoliko trendova dizajna oduvek biti evergrin, oni koji generalno utiču na nove trendove koji su se pojavili i koji će se pojaviti.

Jedan vanvremenski trend, koji je možda malo zapostavljen u poslednje vreme je minimalizam. U poslednje vreme se ovaj trend vraća, evoluirajući u još bolji oblik koji dizajneri zovu “ultra minimalizam”.

Kao standardni minimalizam, neuvežbanom oku to može delovati kao dizajn bez nekih ključnih elemenata, koji su zamenjeni praznim prostorom. Međutim, ovaj trend je više od toga. Sposobnost pravilnog odlučivanja koje elemente treba izbaciti, a koje zadržati je sama po sebi sposobna veština i ta osobina čini razliku između vrhunskih i prosečnih dizajnera.

Svaki piksel mora biti pažljivo urađen da bi proizveo optimalne rezultate. Negativan prostor mora biti dosledno primenjen. Uz stručno znanje tipografije i oko za izbor kvalitetne kombinacije boja, samo su neke od kvalitetnih sposobnosti koje mora imati kvalitetan dizajner da bi uspešno napravio ultra minimalistički sajt. Kako izgledaju ovakvi sajtovi? Uglavnom su jako lepi. Između ostalog, uverite se sami.

 

Cole Townsend

 

izrada-web-sajtova-minimalan-dizajn1

 

Sang Han

 

izrada-web-sajtova-minimalan-dizajn2

Tim Brack

 

izrada-web-sajtova-minimalan-dizajn3

 

Dennis Adelmann

 

izrada-web-sajtova-minimalan-dizajn4

Brian Nathan Hartwell

 

izrada-web-sajtova-minimalan-dizajn5

 

Velvet Hammer

izrada-web-sajtova-minimalan-dizajn6

 

Kerem Suer

izrada-web-sajtova-minimalan-dizajn7

Rob Wootten

 

izrada-web-sajtova-minimalan-dizajn8

 

We ain’t plastic

izrada-web-sajtova-minimalan-dizajn9

 

 

Ryan Paonessa

izrada-web-sajtova-minimalan-dizajn10

 

 

Jessica Caldwell

 

izrada-web-sajtova-minimalan-dizajn11

 

Buero

izrada-web-sajtova-minimalan-dizajn12

 

 

Socket Studios

 

izrada-web-sajtova-minimalan-dizajn13

 

Michiel de Graaf

izrada-web-sajtova-minimalan-dizajn14

 

Alessandro Scarpellini

 

izrada-web-sajtova-minimalan-dizajn15

Piet Oudolf

 

izrada-web-sajtova-minimalan-dizajn16

Mislite manje – Dizajnirate bolje

Mislite manje – Dizajnirate bolje

Dobro dizajniran korisnički interfejs je rezultat niza ključnih odluka koje ne samo da moraju biti bazirane na intuiciji, već moraju biti estetski lepe i prijatne za korisnike. Tako da, ukoliko donesete pametne odluke možete olakšati sebi rad, uštedeti vreme i kao produkt, imati kvalitetan proizvod.

Američki psiholog Barry Schwartz je napisao knjigu koja se zove Paradoks izbora, koja eliminiše izbore koji izazivaju anksioznost. On je tvrdio da moramo imati standarde i kriterijume a da ne brinemo o mogućnostima da postoji nešto bolje. Knjiga je bila usmerena potrošačima, ali se sva ova pravila mogu primeniti i u dizajnu.

 

1.Ograničite promenjive

Ako uzmemo u obzir sve moguće promenljive koje mogu doprineti jednom verodostojnom konceptu, postaje jasno da je potrebno unapred ih definisati i ograničiti. Smanjenjem količine izbora, učinićete proces donošenja odluka lakšim.

Redukovanjem mogućnosti izbora, nećete smanjiti originalnost. Naša pretpostavka je da je stvaranje koncepta oko unapred definisanih pravila ograničenje, ali dizajneri mogu uspostaviti svoja pravila i imati potpunu kontrolu nad njima.

 

Skaliranje i prostor

Svaki aspekt UI dizajna treba biti podređen sistemu koji promoviše određeni ritam i pomaže i održavanju doslednosti u toku projekta. Jedan takav sistem je modularna skala, koja može olakšati skalu od bilo kog odnosa za merenje ili podešavanje veličine elemenata ili negativnog prostora u sastavu.

 

izrada-web-sajta-facebookads2

 

 

Smanjenje promenljivih elemenata u grid sistemu, tipografijam vertikalni razmak i prihvatljiv raspored pruža zadovoljavajuću estetiku i ritam. Projektovanje UI je daleko lakše.

 

Grid

Grid sistemi su sjajni za organizaciju sadržaja horizontalno i umeju da olakšaju sam proces UI dizajna. Bez obzira na to, gridovi se obično dizajniraju bez mnogo muke. Ono što većina dizajnera ne shvata je da je bolje kreirati grid sistem koji je podređen sadržaju.

 

izrada-web-sajta-facebookads3

 

Ovo znači da je idealno imati jasnu predstavu o rasporedu sadržaja unapred, tako da će adekvatan raspored sadržaja, bolje oslikavati isti i poslati jasniju poruku korisnicima. Ovde ne mislimo o ograničavajućim faktorima kao što su logotip određene širine ili slike i elementi sa fiksnim, unapred definisanim razmacima.

Tip sadžaja je takođe bitan faktor. Postoji velika razlika između osmišljavanja sadržaja za prodavnice, novinske članke ili blogove i splash stranice. Tako da je važno koristiti šablone i razlučiti razliku između različitih tipova sadržaja.

Što više budete razumeli koncept poslovnog sadržaja i sva ograničenja unapred, lakše ćete odabrati grid sistem i doneti pametniju odluku.

 

Tipografija

Ukoliko nas pitate, tipografija je najbitniji deo UI dizajna, jer u 95% može biti pokretačna snaga komunikacije. Nepisano pravilo je da UI nikad ne bi trebalo da sadrži više od dve familije fontova i nekoliko jačina. Naravno, pravila mogu varirati od situacije do situacije i mogu se menjati u opravdanim situacijama.

 

Boje

Lako je igrati se i eksperimentisati sa paletama boja. Mali raspon nijasni može imati dobar efekat u davanju vizuelnog izgleda. Uprkos tome dug je put od ideje, do odabira palete boja koja će postići dosledan vizuelni efekat. Sve što je potrebno za početak je 5 svatcheva.

 

izrada-web-sajta-facebookads4

 

 

Većina brendova treba da koristi primarnu boju i nekoliko neutralnih boja, ili čak boja suprotnih tonova. Ne treba nam 15 nijansi boja, naročito ne na samom početku. Bolje je započeti sa malim brojem, pa polako širiti.

 

Slike

Kako ugraditi slike u UI dizajn. I to zavisi od konteksta sadržaja. Ukoliko imamo grubu predstavu o tome koji je kontekst sadržaja, možemo stvoriti polaznu tačku za naše slike i definisati oblik, veličina, tretman.

Ograničavajući svoje slike, promenljive će sprovoditi bolju konzinstetnost i biće lakše upravljanje slikama na duže staze. Isto važi i za ikonice.

 

izrada-web-sajta-facebookads5

 

 

2.Kreirajte uputstvo pre nego što počnete dizajn

Kako UI projekat raste konceptualno, postaje sve važniji za kreiranje i održavanje konzistentnosti u samoj stilizaciji. Na ovaj način će se usostaviti princip dizajna koji će biti podređen projektu, održavanje ritma i doslednosti. Ako smo definisali promenljive ranije, onda je dobro dokumentovati ih. Buduće donošenje odluka će biti lakše ukoliko definišete uputstvo i imate jasne principe na osnovu kojih ćete donositi odluke.

U zavisnosti od projekta, stvaranje uputstva je luksuz i često je namenjen za kasniju upotrebu. To je razlog zašto većina uputsva budu završena isto kad i sam projekat i to je dobra praksa. Postoji mnogo objašnjenja zašto je izrada uputstva i dokumentacije dobra, a najbitnija je ta što upustvo može pomoći u praćenju doslednosti tokom kasnijeg rada na projektu.

Kreiranjem uputsva na samom startu ne znači da ono mora biti kompletno. Baš naprotiv. Kako projekat napreduje, uputstvo i stilski vodiči će napredovati, ali će biti jasniji i pomoćiće vam u dizajniranju i razvoju projekta.

 

3.Modularni sistemi, prioritet i adaptacija

U modularnim sistemima, layout može biti podeljen na ključna područja. Moduli se mogu koristiti više puta u različitim rasporedima. Korisnički interfejs se tretira kao deo sistema, a ne kao stranica sa nekim šablonom za dizajn.

Ovo je sjajna metodologija koja čini UI dizajn znatno lakšim, ali da bi bili efikasniji, moramo definisati prioritet ključnih oblasti i prilagoditi sve ostalo oko njih. Ovo će osigurati vizuelnu povezanost.

Identifikujte ključne oblasti

Dizajn bi morao da bude podređen važnim delovima. Prioritet svake oblasti je određen sadržajem i funkcionalnošću u okviru interfejsa i to je zagonetka koju moramo rešiti.

 

Fokusirajte se na ključne oblasti

Kada identifikujete ključne oblasti i odredite prioritet, onda je vreme da se fokusirate na njih i radom na određenim finesama ih implementirate u sam korisnički interfejs. Ideja ključnih oblasti je da one budu intuitivne, ispunjavaju sve korisničke zahteve, pre nego što počnete da se bavite dizajnom manje bitnijih područja.

 

4.Dizajnirajte sajt koji će da radi za sve

Hiljadama godina unazad dizajneri nastoje da urade jednu stvar – učine da njihov dizajn efikasno komunicira sa korisnicima. Mi smo stalno u ponovnom stvaranju i smišljanju novih načina za bolje komuniciranje sa korisnicima.

Pristupačnost

Širem auditorijumu ovo zvuči kao težak i obiman posao. Po najnovijim standardima, jako je bitno da pristupačnost sajta bude dobra. Primeri za ovo mogu uključivati zahtev o minimalnoj veličini fonta, kontrastima između pozadine, sadržaja i klikabilnih sekcija.

Pristupačnost nije samo definisanje smetnji u korišćenju sajta, već služi i definiše kako će sajt izgledati kod korisnika zastarelih uređaja i pretraživača koji ne podržavaju određene funkcionalnosti.

 

5.Koristite već isprobane i testirane šablone

Činjenica je će korisnicima biti draži intuitivan interfejs koji je u skladu sa drugim, koje sami korisnici koriste godinama unazad. Čim počnete da odstupate od šablona za dizajn, morate se suočiti da će biti potrebno neko vreme da takav dizajn postane intuitivan korisnicima.

Postoji vreme i mesto za stvaranje originalnih UI šablona, ali ne bi trebalo odstupati od određenih uobičajnih tehnika, jer su one uspešne sa razlogom.

Što se više upoznajete sa uspešnim šablonima dizajna, dizajneri će lakše donositi odluke. Ne možemo nužno znati šta se može raditi, a šta će se raditi u budućnosti i kuda će nas web trendovi dovesti.

 

Zaključak

Neki od ovih pristupa možda neće redukovati razmišljanje dizajnera ili vidno unaprediti dizajn. Ali svakako usvajanjem gornjih saveta možete dizajniranje vašeg korisničkog interfejsa učiniti lakšim i bržim.

Beskonačno skrolovanje, Paginacija ili “Učitaj još” dugme?

Koji je najbolji UX šablon za prikazivanje proizvoda na ecommerce sajtovima – paginacija, beskonačno skrolovanje ili “učitaj još” dugme? Testirali smo ova tri načina za učitavanje proizvoda, kako na desktop uređajima, tako i na telefonima?

Paginacija je i dalje najomiljeniji način za prikazivanje novih proizvoda na sajtu i podrazumeva se na svakoj e-commerce platformi. Svakako naše istraživanje je pokazalo da je “load more” dugme u kombinaciji sa lazy loadingom rezultira najboljim korisničkim iskustvom. Beskonačno skrolovanje može biti nezgodno, zbog mobilnog telefona naročito. Međutim, nije sve tako crno i belo, jer pojavljivanje svakog metoda zavisi od konteksta stranice.

 

Zaključci testa

Tokom našeg obimnog istraživanja funkcionalnosti ecommerce sajtova, liste proizvoda i filtera, nekoliko test parametara su protiv paginacije. Paginacija je spora i ume obeshrabriti korisnika za dalje pretraživanje liste proizvoda. Kao rezultat, kod paginacije korisnici provode mnogo više vremena na prvoj strani nego na ostalima, za razliku od “load more” dugmeta ili lazy loada.

 

 

izrada-web-sajta-pagination1

 

Beskonačno skrolovanje ponekad rezultuje beskrajnim očitavanjem, korisnik se bolje upoznaje sa stranicom, ali uz mogućnost očitavanja stotine i stotine proizvoda. Ukoliko je dobro implementirano, skrolovanje može biti dobro korisničko iskustvo. Korisnik može samo skrolovati kroz proizvode, bez mnogo zadržavanja i prekidanja. Nije potrebna interakcija, proizvodi se samo pojavljuju, kako se skroluje stranica.U ovom slučaju, beskonačno skrolovanje je dobro ukoliko nemate mnogo proizvoda, ali pošto korisnici nisu privrženi skrolovanju, proizvodi će im samo primicati bez fokusiranja na iste.

 

izrada-web-sajta-pagination2

 

 

 

Beskonačno skrolovanje otežava pristup korisnika footeru u nekim sajtovima. Ovo je jedna od najvećih mana benskonačnog skrolovanja. Rezultati se stalno učitavaju, korisnik se približava dnu liste, korisnik će videti footer na sekundu do novih rezultata. Ovo može biti problematično jer se u footeru često nalaze neki ključni linkovi, navigacija, kategorije ili kontakt podaci.

Na nekim sajtovima smo testirali “load more” dugme. Samo 8% vodećih ecommerce sajtova koristi ovo dugme. Ovo dugme je jednostavno za dizajn, neće zbuniti korisnika i kao takvo čini jednostavan interfejs. Korisnik vidi više proizvoda ukoliko sajt sadrži “load more” dugme, nego recimo ukoliko sadrži paginaciju. Zbog aktivne interakcije sa korisnikom (što nije slučaj sa beskonačnim skrolovanjem), korisnik će čitati sadržaj, upoznati se sa proizvodima i dobiti više informacija.

 

izrada-web-sajta-pagination3

 

 

izrada-web-sajta-pagination4

 

Jedna od prednosti “load more” dugmeta je ta da se lista proizvoda povećava, umesto što rezultati bivaju zamenjeni kao kod paginacije. Tako korisnici mogu upoređivati proizvode na celoj listi.

Pa, koji metod onda treba koristiti? Idelno bi bilo korišćenje više kombinacija “load more” funkcionalnosti. Testiranje je pokazalo da nijedan metod nije savršen. Napravićemo neke varijante i podeliti sa vama u nastavku teksta:

  • Za kategorije – kombinacija “load more” i lazy loadinga.
  • Za pretragu “load more”, dodatak broja prikazanih rezultata bi bio idealan.
  • Na mobilnim telefonima “load more”, ali podrazumevano, učitavajte manje proizvoda.

“Load More” za kategorije

U našem istraživanju na ecommerce sajtovima, pronađli smo optimalno rešenje za učitavanje novih proizvoda u kategorijama. “Load more” u kombinaciji sa lazy loadingom ima za cilj prikazivanje dodatnih proizvoda. Prikažite 10 – 30 proizvoda inicijalno, onda lazy loadom dodajte još 30 proizvoda, onda dodajte “load more” dugme. Ovo dugme pokazuje kada treba prekinuti korisnika i na taj način redukuje vreme i resurse na serveru.

Primetićete da je broj proizvoda za učitavanje ograničava. Testovi pokazuju da idelan broj proizvoda zavisi od konteksta sajta i industrije. Za liste sa specifičnim proizvodima (hardver, elektronika) koristite manje proizvoda. Istraživanja su pokazala da korisnici mogu učitavati više proizvoda ukoliko imaju više vizuelnih elemenata.

 

izrada-web-sajta-pagination5

 

Na ovaj način stranice se brže učitavaju jer veoma malo broj proizvoda se u početku očitavaju. Što je još važnije za male i srednje kategorije, lazy loading će obezbediti korisniku pretragu korisnika bez prekidanja. Za duže liste, korisniku će koristiti “load more” dugme, koje čini listu lakšom za nastavak pretraživanja i daje korisnicima lak pristup footeru i daje im trenutak za razmatranje filtera koji su bolji od kontinuiranog skrolovanja kroz stotinu proizvoda.

Slabosti lazy loadinga i beskonačnog skrolovanja su konstantno povećavanje kapaciteta stranice, što povećava vreme učitavanja. Ukoliko korisnik skroluje do dna, videće footer, ali će se očitavati proizvodi. Novi proizvodi će se pojaviti na listi, footer će nestati. Sa kombinacijom “load more” dugmeta, dobićete pauzu i ograničenje za lazy load. Takođe, korisnik u svakom trenutku vidi footer i ima mu pristup. Lazy load će nastaviti da očitava proizvode, samo će postojati prazan prostor na dnu stranice.

“Load more” za rezultate pretrage

Zbog otvorenosti pretrage potrebno je imati više rezultata od kategorija. U našem testiranju korisnosti, stotine rezultata pretrage nisu redak prizor, a na masovnim ecommerce sajtovima, upiti za pretragu često vraćaju hiljade rezultata.

Rezultati su takođe poređani po značaju. Dakle peti rezultat pretrate je obično važniji korisniku od desetog rezultata. To znači da bi korisnici otpočetka trebalo da istražuju rezultate pretrage, ali ih treba ohrabriti da provere više rezultata. Beskonačan skroling nikad ne bi trebalo koristiti za rezultate pretrage upravo zbog ovoga. Ukoliko ima manje rezultata pretrage, onda se može upotrebiti lazy loading.

 

izrada-web-sajta-pagination6

 

 

 

Da bi se stvari prešle na viši nivo, broj proizvida može da se dinamički prilagođava na osnovu relevantnosti rezultata pretraživanja. Većina pretraživača će rangirati svaki rezultat sa relevantnošću i vratiti proizvode po prioritetu.

 

“Load more” dugmići na mobilnim telefonima

 

izrada-web-sajta-pagination7

 

izrada-web-sajta-pagination8

 

U našem istraživanjima, koristili smo i mobilne sajtove. Došli smo do zaključka da paginacija može biti teška za kliktanje na mobilnim uređajima. U međuvremenu, beskonačno očitavanje je efektno kada je potrebno pretražiti mali broj elemenata. Međutim, kao što smo već pomenuli, teško je pristupiti footeru u kome se nalaze bitni linkovi kao što su “desktop site”, “Faq” ili “Dostava”.

 

izrada-web-sajta-pagination9

 

Najbolja solucija je da imate jedno “load more” dugme na kraju liste proizvoda. Mobilna tehnologija ima nekoliko jedinstvenih ograničenja:

  • Manji je ekran – Zato što je mobilni ekran mnogo manji, elementi liste će zauzeti veliki deo ekrana, sa dva ili tri elemenata koja će se videti u listi. Svakako 50 elemenata bi zauzelo veliki prostor na ekranu mobilnog telefona. Zato moramo da skrolujemo mnogo više na mobilnom uređaju nego na desktop računaru.
  • Ograničenja skrolinga – Na touch ekranu korisnik može skrolovati samo prevlačenjem prsta. Kontrast sa desktop računarom gde korisnik tipično ima nekoliko mogućnosti za skrolovanje, kao uz pomoć miša, tastature.
  • Sporo skrolovanje – Osim toga u našim testovima pokazana je manja kontrola na pomeranjem liste proizvoda. S jedne strane, neki korisnici skroluju isuviše sporo prevlačenjem prstiju preko ekrana. Isto tako, neki korisnici će skrolovati brže i propustiti proizvode na taj način.
  • Java Script događaji – Java Script događaji mogu biti izostavljeni na nekim ekranima na dodir, što znači da je lazy load ne može biti dobro realizovan. S toga proizvodi ne mogu biti učitani dok korisnik ne zaustavi skrolovanje.

Zbog ovih razloga preporučujemo vam učitavanje 15 – 30 proizvoda na mobilnim ekranima pre nego što postavite “load more” dugme i onda očitajte proizvode odjednom.

Back dugme

Tokom testiranja posmatramo tehničku implementaciju učitavanja nove stranice i očekivanja korisnika prilikom očitavanja stranice. Dinamičko učitavanje sadržaja kao što su pop up prozori, filteri i ostali elementi često utiču na očekivanja korisnika kako dugmići rade.

“Load more” metod zahteva pažljivo razmatranje ponašanja “back” dugmeta. Važno je kada korisnik poseti određenu stranicu proizvoda, da se vrati na isto mesto nakon toga. Izostanak back dugmeta je greška, jer sprečava korisnikov povratak sa stranice proizvoda na stranicu liste proizvoda.

 

izrada-web-sajta-pagination10

 

izrada-web-sajta-pagination11

 

izrada-web-sajta-pagination12

 

HTML API istorijat omogućava nam da zadovoljimo očekivanja korisnika. Pogotovo zato što history.pushState() funkcija pomaže u pozivanju promene URLa bez ponovnog učitavanja stranice, tako odgovara ponašanju back dugmeta shodno očekivanjima korisnika. Imajte na umu da ako nemate tehničke resurse da podrže odgovarajuće ponašanje back dugmeta, preporučujemo vam da ne eksperimentišete sa lazy loadom, već da se držite standardne paginacije.

 

“Load More” ne bi trebalo da bude prioritet

Iako je debata”Load More” vs “Beskonačno učitavanje” u odnosu na paginaciju, aktuelna godinama, metod učitavanja proizvoda ne bi trebalo da bude prva stvar koju većina ecommerce sajtova implementira.

Tokom istraživanja smo dokumentovali dosta ozbiljnih UX problema na većini ecommerce sajtova.

Sve ovo ne znači da je lazy load loš. Primetili smo da se može promeniti vidljivost i informacije o proizvodima. Ne treba biti na vrhu liste promena ubacivanje ovog dugmeta, ali bi ovo dugme svakako poboljšalo korisničko iskustvo.

 

“Load more” protiv “paginacije”

Ukratko “load more” dugme rešava probleme koje prouzrokuje paginacija. Sa druge strane kombinacija lazy loadinga i load more dugmeta se čini kao pravilan izbor.

Međutim “Load More” tasteri rade posao bolje samo kada je problem sa “back” dugmetom rešen u pretraživaču. Navešćemo tri situacije za korišćenje ovih elemenata:

  • Za kategorije koristiti kombinaciju “load more” dugmeta i lazy loadinga. Neka maksimalan broj proizvoda kada će se pojaviti dugme “load more” bude 50 – 100.
  • Za rezultate pretrage, koristite “load more” dugme, ali podesite prag prikazivanja rezultata na 25 – 75.
  • Na mobilnim uređajima, koristite “load more” ali podesite prag prikazivanja na 15 – 30.
Upotreba Carousela na mobilnim E-Commerce sajtovima.

Upotreba Carousela na mobilnim E-Commerce sajtovima.

Da li vam se ovaj naslov u startu čini skeptičnim? Do ovoga su dovela određena istraživanja. Ukoliko pitate bilo koga, rećiće da su karouseli nepotrebi na sajtu i da predstavljaju anti-obrazac i da ih ne koristite. Ali možda nije sve tako crno i belo.

Koristeći prave podatke, ovaj članak ima za cilj bolje razumevanje argumenata koji su protiv korišćenja karusela i da li karuseli zaslužuju reputaciju koju su stekli do sad. Pozabavićemo se time tačku po tačku. Takoše, u ovom tekstu ćemo vam dati par primera kako da koristite karusel u budućnosti.

 

izrada-web-sajta-karusel1

 

Osvrnimo se na neke od najposećenijih e-commerce sajtova za mobilne telefone. Većina njih ima karusele, najčešće na početnoj strani i na stranici sa proizvodima. Da li je to nešto loše? Da li je na ovaj način korisnicima učinjena usluga i da li će sajtovi biti bolji ukoliko nemaju karusel? Sprovešćemo malo istraživanje o ovoj temi.

Pogledajmo podatke koji su nam dostupni. U početku smo bili radoznali i zapitali smo se, šta naši podaci pokazuju.

 

Zašto se koriste karusel slajderi?

Karusel slajderi su mnogo više od prikazivanja marketinških informacija na početnoj stranici. Fokusiraćemo se na dizajniranje za mobilne stranice, pozabavićemo se problemom prikazivanja balansiranih informacija, na malim ekranima. To znači da je neophodno voditi računa i o horizontalnom i vertikalnom položaju ekrana. Karuseli se koriste da bi se povećala količina informacija i održao kontekst bez primoravanja korisnika da skroluje stranicu ili klikće i ide na novu.

izrada-web-sajta-karusel2

 

Kontekst je jako bitan za karusele. Jako je bitno ne preterivati sa karuselima. Na našim sajtovima se oni nalaze na jednom mestu, kao galerija slika ili na stranici sa proizvodima. Na stranici o informacijama proizvoda karusel služi da korisniku da više vizuelnih informacija o proizvodima. Na početnoj stranici se karusel može koristiti kao jedan od navigacionih elemenata i sadržati call to action dugmiće.

 

izrada-web-sajta-karusel3

 

Činjenice protiv karusela

Argumenti protiv karusela se svode na sledeće:

  • Korisnici nemaju nikakvu interakciju sa karuselima.
  • Ukoliko postoji interakcija, postoji samo na prvom slajdu.
  • Nisu pristupačni
  • Automatsko prikazivanje elemenata u karuselu je loše za korisnike.

 

Korisnici nemaju interakciju sa karuselima

Argument – Istraživanja su pokazala da samo 1.07% korisnika klikne na sadržaj koji se nalazi na karuselima i ima marketinški karakter. Pregled slajda se ne može nazvati interakcijom. Računa se klik.

Naše iskustvo  – Korisnici stupaju u interakciju kada je galerija slika proizvoda prikazana u karuselima. Pokazano je da 72% korisnika prođe kroz karusel barem jednom, 23% korisnika zumira karusel. Dakle 23% korisnika je kliknulo na slajder da bi dobilo više informacija.

 

Ukoliko postoji interakcija, postoji samo na prvom slajdu.

Argument – Pretpostavljamo da su karuseli efikasni i da je potrebno imati više slajdova. Istraživanja pokazuju da na drugi slajd klikne samo 3.1% korisnika. Te rezultate nismo očekivali.

Naše iskustvo – Korisnici na drugu sliku na stranici sa opisom proizvoda, klikću u 15.7%. Najmanje 64% korisnika gleda dalje od drugog slajdera.

 

izrada-web-sajta-karusel4

 

izrada-web-sajta-karusel5

 

Nisu pristupačni

Veliki problem, ali rešiv. Ovaj argument nije protiv korišćenja karusela, već je protiv načina na koji se on upotrebljava. Nije nemoguće da karusel bude dostupan, samo je to u praksi veoma retko. Svakako naša trenutna implementacija upotrebe karusela je bazirana na pristupačnosti.

Nije to greška u karuselima generalno, već u odluci na koji način ćete ih koristiti. To nije argument vezan za efikasnost karusela, pa se nećemo mnogo baviti tim problemom.

 

Automatsko prikazivanje elemenata u karuselu je loše za korisnike

Ovaj argument je baziran na činjenicu da automatsko prikazivanje elemenata u karuselu se suprotstavlja interfejsu. Sa ovim se slažemo, ukoliko dizajnirate karusel, izbegavajte automatsko pojavljivanje elemenata.

 

Zaključci na osnovu istraživanja

Pažnja – ovaj odeljak se odnosi na neke naše zaključke i neka naša istraživanja. Tako da uzmite ove podatke sa određenom dozom rezerve.

Metode istraživanja

Podaci korišćeni u ovoj analizi potiču iz nekoliko e-commerce sajtova koji smo mi radili. Da bi smo se pozabavili rezultatima, potrebni su nam sledeći podaci:

  • Učestalost interakcije korisnika i karusela
  • Učestalost interakcije korisnika sa slajdovima posle prvog

 

Definisanje interakcije

Postoji četiri načina interakcije korisnika i karusela:

  • Prevlačenje levo ili desno, na ekranima pametnih telefona.
  • Korišćenje strelice za kretanje levo i desno po slajderu.
  • Tapkanje oznake na dnu slajdera
  • Tapkanje na slajdu radi zumiranja.

Važna napomena je da se ovo odnosi na namernu interakciju. Slučajne interakcije se ne računaju.

 

Rezultati

Jedinstveni rejting interakcije

Prvi podatak koji nam je trebao je koliko često korisnici mobilnih uređaja imaju interakciju sa karuselom. Gledali smo jedinstvene interakcije.

Podaci pokazuju da oko 72% posetilaca stranice ostvaruju interakciju na neki način sa karuselima. Slike su bile jasni favorit za interakciju, jer 55% korisnika klikne bar na jednu sličicu.

 

Tipovi i odnos interakcije

Naši podaci pokazuju da su kontrole sličice najpopularniji način za interakciju sa karuselom.

izrada-web-sajta-karusel6

 

Zumiranje je drugi najpopularniji tip interakcije. Zumiranje je slično po tome što ima najviše klikova od bilo kojih drugih interakcija – a i možete da dodirnete karusel bilo gde da bi ste ga pokrenuli. Moramo da imamo u vidu da je ponekad zumiranje i slučajno. Mada, nivo angažovanja je visok, tako da je nerealno da je sve slučajno. Čak 23% posetilaca zumiraju.

Prebacivanje sa slajda na slajd je najmanje popularan način za komunikaciju korisnika i karusela.

 

izrada-web-sajta-karusel7

 

Totalni rejting interakcije

Rezultat od 72% korisnika koji interaguju sa karuselom, ne ide u prilog tvrdnjama da karusel nije potreban na sajtu.

 

Prosešan broj interakcija istog tipa

Korisnici koji imaju interakciju sa sličicama će to kliktati na sličice češće nego na druge elemente. U proseku korinik kada koristi karusel će kliknuti na 6 sličica.

 

izrada-web-sajta-karusel8

 

Nizak nivo zumiranja pokatuje da korisnici zumiraju proizvod samo kada su zainteresovani.

Istraživanja su pokazala da korisnike najviše angažuje strelica i prelaz sa slajda na slajd. Kombinacija ovih elemenata sa nekom mikrokonverzijom kao što je “dodaj u korpu” dugme, može biti zanimljivo.

 

izrada-web-sajta-karusel9

 

Opadanje interakcije

Ukoliko iskoristimo podatke koje smo prikupili moćićemo da vidimo kakva je mogućnost opadanja interakcije.

Sličice

U slučaju gledanja u sličice, postoji verovatnoća od 69% da će korisnik gledati sledeću sliku. Preciznije se rezultat može pokazati uz rejting opadanja interakcije. Upkos mogućnosti da se sličice vide proizvoljnim redom, većina korisnika će ih gledati redom.

izrada-web-sajta-karusel10

 

Strelice

Za svaku strelicu na koju se klikne, postoji linearan odnos, približan eksponencijalnom modelu. Postoji verovatnoća od 76% da će korisnik ponovo kliknuti na strelicu da bi video sledeći slajd.

 

izrada-web-sajta-karusel11

 

 

Prelaz sa slajda na slajd

I ovaj tip interakcije se može izraziti linearno, jer kada korisnik klikom na ekran pređe sa jednog slajda na drugi, postoji 64% mogućnosti da će to uraditi opet.

izrada-web-sajta-karusel12

 

 

Zumiranje

Na isti način možemo predstaviti i zumiranje.

izrada-web-sajta-karusel13

 

Razmatranja

Marketing karusel protiv karusela sa slikama

Vrste karusela koje koristimo su drugačiji. Ovo može predstavljati veliki problem za zaključke. Dve vrste karusela mogu biti vizuelno povezane, a na osnovu našeg istraživanja smo došli do zaključka da je osnovni model uspešan. Naš cilj ovog istraživanja je bio da se utvrdi da li je ideja o upotrebi više karusela i više slajdova pogrešna. Podaci govore da nije.

Korisnici mogu biti izloženi takozvanom banerskom slepilu (banner blindness – svima se desilo da ne vidimo ništa na sajtu od suvišnih banera) u slučaju marketinških karusela. Ali takođe, ovi karuseli mogu obezbediti više dodatnih informacija korisnicima. Postoji mnogo razloga zbog kojih bi ovakav marketinški karusel sa banerima bio neefikasan. Mi ponekad koristimo ovakve karusele na našim sajtovima.

 

izrada-web-sajta-karusel14

 

Mobilna interakcija ili desktop interakcija

Karuseli o kojima pričamo se odnose na mobilne uređaje. Postoji mogućnost da mobilni korisnici ostvaruju interakciju sa karuselima više nego sa desktop uređajima. Razlog ovome može biti lakoća interakcije, koja je pogodnija sa mobilnih telefona i tableta, nego sa računara.

 

Kriterijumi za procenu uspešnosti karusela

Uspeh karusela se meri različitim kriterijumima za uspeh. Kriterijum se ogleda u tome, da li korisnici vide sve slike, da li prelaze na sledeće slike i da li postoji nekakva konverzija na osnovu njih.

 

Koraci za budućnost

Ovi podaci su nama, a nadamo se i vama otvorili oči i pokazali da su nam karuseli još uvek potrebni. Postoje neki koraci za budućnost i sad ćemo vam ih pokazati:

  • Potrebno je sprovesti slična istraživanja na ostalim tipovima karusela. Bilo bi zanimljivo uporediti neke druge karusele, možda one sa banerima ili nekim drugim slikama ili informacijama.
  • Bilo bi zanimljivo istražiti kako interakcija sa karuselom utiče na dalje korišćenje sajta i generalno korisničko iskustvo. Da li će korisnik kupiti proizvod ukoliko ostvari kvalitetnu interakciju sa karuselom.
  • Voleli bi smo da istražimo nivo interakcije sa karuselom zavisno od uređaja. Da li korisnici više gledaju karusele na mobilnim telefonima, tablet računarima ili desktop računarima.
  • Podaci pokatuju da je prelazak sa slajda na slajd najmanje korišćena vrsta interakcije. Predstavljajući dodatne kontrole, korisnici imaju nametnuto rešenje za interakciju, tako da su veće šanse da odaberu taj metod.

Zaključak

Počeli smo ovaj članak tako što smo razmišljali o tome kako korisnici mobilnih uređaja upotrebljavaju karusele. Postoje razlike izmešu vrsta karusela.

Većina podataka ranijih istraživanja se odnosila na karusele sa banerima. Ovi podaci podržavaju tvrdnju da su je stepen interakcije sa ovakvim karuselima mali – oko 1%.

Naše istraživanje je pokazalo malo različite rezultate. Korisnici reaguju na karusele i stopa interakcije je velika. Tako da stopa interakcije zavisi od tipa karusela i od njegovog cilja.

Karuseli imaju mnogo oblika i veličina. Neki mogu biti efikasni, drugi manje efikasni. Potrebno je mnogo više podataka, pre nego što se dođe do zaključka. Korisnik ne zna šta da očekuje od slajdova, pa ih neće ni prelistavati. Ukoliko korisnicima stavite do znanja šta je sledeći slajd, korisnik će radije prelistati isti.

 

Pitanje – Da li treba koristiti karusel?

Nemojte koristiti karusele da bi ste dodali sadržaj na ekranu. Razmislite o karuselu, kao elementu koji ima svoju namenu i svoj cilj, a cilj mu je da obezbedi dodatan sadržaj u određenom kontekstu. Koristite karusel kada je vertikalni prostor ograničen.

Nemojte koristiti karusel ukoliko je potrebno korisniku da vidi ceo sadržaj. Može se desiti da korisniku promakne sadržaj na drugom, trećem i drugim slajdovima ukoliko ne vidi karusel. Takođe, nemojte koristiti karusel, ukoliko slajdovi nisu zanimljivi. Prvim slajdom treba pokrenuti korisnika da klikne na sledeći slajd i tako u krug. Kao i ostatak sajta i karusel mora angažovati korisnike. Ukoliko korisnici ne ostvaruju interakciju sa slajdovima, ne mora da znači da je karusel kriv, već njegov sadržaj.

Ne postoji  jedinstven odgovor na ovo pitanje. U određenim situacijama, odgovor je ne, u pojedinim je odgovor da. Univerzalan odgovor na ovo pitanje bi mogao da glasi – Ukoliko je neophodan vašim korisnicima – koristite ga.

Pin It on Pinterest