Vektor veebis? Veebivektorid!?

Vektor veebis? Veebivektorid!?

Tagasi Reijo Palmiste Kirjutas: Reijo Palmiste 27.september 2017

No halloo – jõudsime lõpuks kohale. Meie illukaikooniseeria viimane postitus! You did it! Nüüd laseme korraks masinad tuttu, kogume mõtteid ja uuel nädalal kisume uuel teemal kaane pealt. Vaatame, mõtleme, kaalume. Millega aga tänases postituses hambaid teritame? Lubasime käia läbi lühidalt veebispektri – mida teevad illustratsioonid veebis ja millised on nende eelised. Sõpru ikoone ei saa samuti unustada, ka neil on oma koht ja ülesanne. Aga! Loodame siiralt, et oled senimaani iga nädal midagi uut teada saanud ja ehk on ka see viimane postitus veidike valgustav. Hit it!

Vaatame korraks tagasi…

Niisiis, jooksev start. Seni oleme seletanud, oianud ja hoiatanud, et illukas on superb lahendus. Hästi, okei, mõistlik. Milline on alternatiiv, milline on see nii-öelda eilne lahendus? Lubage tutvustada seisu, kus veebidisain oli mõned aastad tagasi (ja teatud ringkondades on siiani).

Image example

Voila! Soeta pildipangast üks eriti mage foto, loobi peale labane reklaamtekst, pane nupp külge ja saada edasi arendusse. Eks arendajad siis tegelevad kõigi ülejäänud küsimustega. (Nagu tihtipeale üleüldse kipub olema.) Kogu moos. Valem ju lihtne ja efektiivne, eks? Wrong. Selliseid lehepoegasid on netimeres sadu ja tuhandeid, üht võta teist viska. Neid lehti võib kontrollimatu kiirusega üles panna kuni hakkad hover efekte ja responsive grid‘e juba unes nägema. Mis eristab sellisel puhul nö Teliat Starmanist? Hessi Mäkist? Kõik on ju t ä i e s t i ühte nägu. (Okei, ühe puhul on isuärataval söögipildil burgeripaber punane, teisel valge. Got us there.)

Lisanäitena ikoonimaailmast (või õigemini situatsionist, mis lausa karjub-kisendab ikoonide järgi) võime tuua nimelt sellise lehe.

Screen Shot 2017-09-22 at 16.49.45

Mine vaata, kliki natuke mööda lehte ringi ja mõtiskle. Pime näeb ja kurt kuuleb, mida siin oleks vaja ette võtta. Creditinfole – call us, maybe?

Pehmelt öeldes – kui sa vähegi oma ärist hoolid ja oled huvitatud veebilehe ehitusel kaasa mõtlemast, siis käid ka-aa-auge kaarega mööda pildipanga lahendustest (ja ka templiitide installimisest!). Usalda meid selles. Me teame, mida me teeme ja pildipanga lahendused ei ole just need projektid, mida me teha tahame. (Lisaks kõigele said just täpsemalt teada, kuidas näiteks konkurentide lehti hinnata – kes on mõelnud, panustanud ja hea disaini mõttest aru saanud, kes mitte.) 🤔

Ja lahenduseks on…

Illustration example

Näed, annab sepikut teha küll! Hoopis teine tunnetus. Kujuta veel ette, kui paneksime seal midagi liikuma! Tegemist on lihtsa lahendusega, aga vahe on nähtav. Enne kui nende näidete erinevusest põhjustatud šokk üle läheb – luba, me esitleme sulle ka mõnda tehnilist fakti. Esmalt fotod võivad olla suured ja ilusad. Ohtlik parameeter selles valemis on “suured”. 5 suurt retinakõlbulikku pilti võivad kokku kaaluda näiteks 2,5 megabaiti, plussmiinus 500 kb. Veebimaailmas mõõdetakse selliseid suuruseid autokaaluga – tonnides. See ei pruugi ühele kasvueas ambitsioonikale veebilehele head tõotada. Kaaluhäda annab leevendada erinevate pakendusmeetoditega, aga selle tulemus ei ole alati 100% garanteeritud ning pakendamine tähendab automaatselt kadu kvaliteedis. Kui kogu leht on ehitatud fotode peale, siis fotokvaliteedis järeleandmiste tegemine suunab selle projekti kiirelt hukule. You can take that to the bank. 

Milline on korrektselt vormistatud illukate maht? Peaaegu nähtamatu. Sama õhuke, kui see lihamaterjal, mida Rakvere Ameerika peekoni pähe müüb 👀.  Brauserikeeles tähendab see umbes 50kb per kärss 🐽. Siiasinna 250kb kataks ära ilusti viis illustratsiooni. See on pea, et 10 korda väiksem maht kui fotogaleriil! Ja mis on nende juures kõige parem – võime lisada animatsioone! Amazing, ikr. Illustratsioon veebis on põhimõtteliselt üks suur pusle. Miks? Sest kõik need pisikesed pusletükid on meile koodis ligipääsetavad. See omakorda tähendab, et võime neid tükikesi lennutada, käänata ja väänata nii kuis Jumal juhatab. Üleüldine tehniline võimekus kasvab tänapäeval hüppeliselt ja see on üks viisidest, kuidas saame seda otse brauserisse tuua. Feast your eyes:

Wolf example

Näitena kasutame järjekordselt suurepärast Wolf3D-d. Liikumist ja kõike seda, millest me seni rääkinud oleme saad näha otse nende lehelt: wolf3d.io

Tõmbame otsad kokku!

Aga haarame natuke kaugemalt: disain – see on tervik. Eesmärgiks on pea alati kanda sõnumit – mõjutada sind kui disaini tarbijat. Teisisõnu soovib ta istutada su pähe mingi mõtte või idee. Ta mõjutab sind kasutades kõiki oma osi, a la pilte, illustratsioone, ikoone, värve ja kõike muud, aga eelkõige teksti. Tekst on sama palju disaini osa, kui on teksti taustavärv. Loeb see, mida sa ütled, kuidas sa seda ütled ja mis on selle teksti toetavad elemendid või millele on tekst toetav element.

Teatud mõttes algab (mittestaatiline!) disain UX-i loomisest, User Experience’st, kasutajakogemusest. Läbi selle võime väita kindlalt, et välja on joonistunud kaks erinevat suunda. Umbes selle kümnendi algul kujunesid kiiresti välja nö kuulikindlad lahendused, The Default Solutions, so to speak. Need on laialt kasutuses ja kasutajale tuttavad, ristipõiki-läbisegi ära testitud. Võib öelda, et need on ohutud lahendused: luues netipanka on kindlasti oluline tekitada kasutajas turvatunne – seda aitavad teha juba tried and tested lahendused.

Teine rada on juba kõvasti vähemkäidum. The Leap of Faith. Need UX’st kooruvad lahendused on uued ja kasutajale tundmatud. Oma värskuse tõttu on nad ka hulga riskantsemad. Neid lahendusi luuaksegi just seetõttu, et murda kivistunud dogmasid ja leida järgmine samm disaini arengus. Sel teel kompavad kõik vaid ainult taskulambiga. Suur osa protsessist on eksperimenteerimine ja pikk edasi-tagasi tammumine. Läbi nende raskuste leitakse varem või hiljem variant, mis edestab hüpetega mainstream varianti. See on tee läbi mille firmad edestavad konkurente ning võidavad turuosasid ja auhindu. ⬅️  Mõtteainet tulevikuks.

Rada number 2 on see, mida üritame OKIAs läbida iga uue projektiga. Meie töö loomus, nö occupational hazard on, et peame kogu aeg vaatama kaks kuud tulevikku. Mis on järgmine asi, mille peame omandama, millised on uued tehnoloogiad, mida rakendada ning millised asjad võime tööriistakastist juba pensile saata. Seisatamine ja lillelõhna nuusutamine päädib vaid sammaldumise ja õietolmust ummistunud jahutussüsteemiga. Juba vanarahvas teadis, et veerevale kivile sammal peale ei hakka. Alustame värskeid projekte alati puhtalt lehelt – kõik algab küsimusega: kuidas seda paremini teha? Iga uus projekt on võimalus astuda koos maailmaga üks samm edasi ja teha midagi kasvõi juuksekarva võrra paremaks. Kõik väikesed asjad kuhjuvad ja moodustavad suurema terviku.

Ja pealegi, olles juba 17 aastat turul, ei saa me endale lubada midagi sellist, mis on juba tehtud-nähtud-proovitud. Me peame olema alati ühe taseme võrra üle. 💪

OKIA out!

(Nagu alati, tšeki meie eelnevaid postitusi ja Dribbblet. Muid tegemisi saad jälgida veel Facebookist ja Instagramist✌️ )