4 Kuinka tehdä latausajat tuntuu nopeammin
Riippumatta siitä, kuinka hyvin suunniteltu käyttöliittymäsi voi olla, jossain vaiheessa, käyttäjiä joutuvat odottamaan jotain ladattavaksi.
Latausaika voi vahingoittaa yleistä kokemusta. Käyttäjien odottaminen liian kauan sovelluksen lataamiseen voi tehdä käyttäjistä kärsimättömiä. Jos käyttäjät saavat sen, he luopuvat sivustostasi ja menevät muualle. Onneksi on olemassa muutamia asioita, joita voit tehdä nopeuttaaksesi käyttäjän tunnetta ja saada heidät tuntemaan, että sisältösi latautuu nopeammin kuin se.
1. Älä koskaan anna käyttäjiä odottamaan antamatta heille palautetta
Jos käyttäjän yhteys on hidas, sivustolle voi kestää jonkin aikaa sisällön täyttämiseksi. Käyttäjän odotusaika alkaa siitä, kun he aloittavat toiminnon, ja pahimmassa tapauksessa on, ettei heillä ole mitään osoitusta siitä, että sivusto on saanut sen.
Kun sivustosi epäonnistuu ilmoittamasta käyttäjille, että jonkin aikaa tarvitaan jonkin toiminnan loppuun, käyttäjät eivät useinkaan ajattele, että se ei saanut pyyntöä, ja he yrittävät uudelleen. Paljon ylimääräisiä hanat ovat johtaneet palautteen puutteeseen. Jotta ihmiset onnistuisivat, meidän on ilmoitettava, että jotain tapahtuu, tarjoavat visuaalista palautetta.
2. Vältä staattisia etenemisindikaattoreita
Staattisia progressiivisia indikaattoreita ovat ne, joilla ei ole siirrettävää kuvaa tai tekstiä, kuten "Ladataan ..." tai "Odota ..." osoittamaan, että pyyntö on vastaanotettu. Vaikka kaikki palautteet ovat parempia kuin mitään, staattiset indikaattorit ovat huono UX. Käyttäjillä ei ole mitään indikaattoria, että sisältöä ladataan, joten he eivät ole varma, onko prosessi todella jumissa.
3. Käytä animoituja latausindikaattoreita
Psykologiset tutkimukset odotusaikasta osoittavat, että käyttäjän keskipiste alkaa siirtyä yhden sekunnin kuluttua odottamaan ilman mitään palautetta. Käyttäjän epävarmuuden vähentämiseksi käytä edistymisindikaattoria mihin tahansa toimenpiteeseen, joka kestää kauemmin. (Huomaa: animaation käyttöä ei suositella kaikille, jotka lataavat alle yhden sekunnin, koska käyttäjät voivat tuntea olevansa ahdistunut siitä, mitä vain pyyhkäisi näyttöön ja pois näytöstä).
Infinite-lastauspiirejä kohtuullisen nopeaan toimintaan
Yksinkertaisin animoitujen indikaattoreiden muoto on lastausruuvi. Tällainen visuaalinen palaute vain kertoo, että käyttäjän on odotettava, mutta ei sano, kuinka kauan he odottavat. Yleensä sinun pitäisi käyttää tällaista edistymisindikaattoria nopeisiin toimintoihin (2-10 sekuntia).
Keskipisteestä säteilevien harmaiden linjojen kiekko on tavallinen lähestymistapa.
Spinnerien lataamista käytetään usein yhdessä pull-to-refresh -elimen kanssa. Se toimii välittäjänä käyttöliittymän kahden valtion välillä ja auttaa käyttäjiä ymmärtämään, mitä tapahtuu, kun näyttö muuttuu.
Apple Mail -sovellus iOS: lle
Prosentuaalinen animaatio pitkäaikaiseen toimintaan
Kierteet eivät ole oikea tapa osoittaa pitkäaikaista kuormitusta. On paljon helpompi odottaa jotain, jos tiedämme, milloin se tapahtuu. Siksi pitkäaikaisille toiminnoille annat käyttäjille selkeän osoitteen siitä, kuinka kauan he tarvitsevat odottamaan. Yleisenä sääntönä peukaloina käytä prosenttimääräistä animaatiota pidemmille prosesseille, jotka kestää 10 sekuntia tai enemmän.
Kuvahinta: Behance
Vaihtoehtoisesti voit antaa yleisen aikataulun operaatiolle. Älä yritä olla tarkka, yksinkertainen, "Tämä saattaa kestää minuutti" voi riittää ilmoittamaan käyttäjälle ja kannustamaan heitä odottamaan sitä.
Ohjelmistopäivityksen asennus Mac OS X: ssä
4. Käyttäjän käsitys ajasta
Kuinka nopeasti sisältötyyte on käyttäjän mielessä. Yritettäessä luoda nopeampi käyttökokemus voit lyhentää havaittua aikaa eikä varsinaista aikaa. Tätä varten voit täyttää odotusaikoja käyttämällä sisältöä, animaatioita tai toimintoja, joita käyttäjä voi suorittaa.
Edistyspalkit
Etenemispalkki antaa käyttäjille odotuksia siitä, kuinka nopeasti toimi käsitellään. Se, miten etenemispalkki liikkuu, vaikuttaa siihen, miten he tuntevat kuormitusajan. Jotta etenemispalkki tuntuisi nopeammalta käyttäjille, voit käyttää yksinkertaisia tekniikoita:
- Etenemispalkin ei pitäisi koskaan pysähtyä, muuten käyttäjät ajattelevat, että sivusto on jäätynyt. Huonoin mahdollinen tapaus on, kun etenemispalkki lähestyy 99% ja yhtäkkiä pysähtyy. Useimmat käyttäjät turhautuvat tällä käyttäytymisellä.
- Voit piilottaa pienet viivästykset etenemispalkissa siirtämällä sitä hetkessä ja tasaisesti.
- Siirrä etenemispalkkia hitaasti alussa ja kiihdytä sitä loppuun, jotta käyttäjät saavat nopean lopputuloksen.
Kuvahinta: Dribbble
Skeleton-näytöt
Odotusaika on oikea aika skeleton näytöille (eli väliaikaisille tietosäiliöille). Luurangonäyttö on olennaisesti tyhjää versiota sivusta, johon tiedot ladataan vähitellen. Se tarjoaa vaihtoehdon perinteisille animoituneille indikaattoreille. Sen sijaan, että näyttäisivät abstraktin widgetin, luurangonäytöt luovat ennakoinnin siitä, mitä tulee, ja tekee käyttäjän keskittymisestä edistymiseen odotusajojen sijaan.
Skeleton-kuvat latautuvat nopeasti, koska se on pieni kuva, joka koostuu usein yksinkertaisista muodoista. Nämä tekniikat voidaan ottaa entistä paremmin mobiilisovelluksissa, koska luurantamalli voidaan tallentaa paikallisesti yhdessä sovelluksen tietojen kanssa. Facebookin iOS-sovellus näyttää käyttäjille harmaita lohkoja ja viivoja, jotka edustavat kuvia ja tekstiä sovelluksen lataamina. Kun se lakkaa, kuvat ja teksti näkyvät tilapäisten säiliöiden sijaan. Tämä ei ole nopeampaa kuin kuormausnäyttö, jossa on kiekko, mutta käyttäjän mielessä se tuntuu siltä kuin se on.
Taustaoperaatiot
Toinen nopeusmaailma, jota voit käyttää, on taustatieto. Taustatoimintoihin pakatut toiminnot tarjoavat kaksi etua - ne ovat käyttäjän näkymättömiä ja tapahtuvat ennen kuin käyttäjä todella pyytää niitä. Anna käyttäjille muitakin asioita keskittymään prosessiin meneillään taustalla. Hyvä esimerkki tästä on lähettää kuvia Instagramiin. Heti kun käyttäjä valitsee jakamasi kuvan, se alkaa ladata. Sovellus kehottaa käyttäjiä lisäämään otsikkoa ja tunnisteita, kun kuva lähetetään taustalle. Kun käyttäjät ovat valmiita painamaan "Jaa" -painiketta, lataus on valmis ja heidän kuvansa on mahdollista jakaa heti .
Edistyksellinen kuvien lataus
Koska nykyaikaiset sovellukset ja sivustot lataavat yhä enemmän kuvia, on hyvä ajatella niiden latausprosessia, koska se vaikuttaa suorituskykyyn ja käyttökokemukseen. Epätarkkuustehon avulla voit luoda progressiivisen kuvien latausvaikutuksen.
Yksi hyvä esimerkki on Medium, joka hämärtää postikuvakansiin sekä kuvia sisällön sisältöön, kunnes kuva on täysin ladattu. Ensinnäkin se lataa pienen epäselvän kuvan (pikkukuva) ja siirtyy sitten suureen kuvaan. Pienoiskuvat ovat hyvin pieniä (vain muutamia kilotavuina), jotka yhdistettynä epätarkkaan vaikutukseen mahdollistavat paremman paikanvarauksen kuin kiinteän värin korvaamatta hyötykuormaa.
Keskikoko käyttää epätarkkuutta edistyksellisen kuvien latausvaikutuksen luomiseksi
Visuaalinen häiriötekijä
Yritä aina odottaa miellyttävämpää, jos et voi lyhentää linjaa. Jotta ihmiset eivät kyllästyisi odottamassa jotain, tarjota heille häiriötä. Hieno animaatio voi häiritä kävijöitä ja tehdä niistä sivuuttaa pitkiä latausaikoja.
Animoitava splash screen. Kuvahinta: Ramotion (Dribbble)
Kuvahinta: Vimeo