Tervitan ja soovin sulle head suve jätku! ☀️ 🏖️ 😎
Selles numbris toon sinuni järgnevad ampsud:
📊 Mida õppida Swedbanki tabeli disainist?
🤖 Mida võimaldab Lovable AI?
🎥 Mis eelised on Google Veo 3 mudelil?
🎨 Miks võiksid Flowstep.ai tarkvara proovida?
⚡ Kas sinu veebilehel saab sisu juurde hüpata?
1. Mida õppida Swedbanki tabeli disainist?
Tahtsin enne reisile minekut võrrelda Gold ja Platinum krediitkaartide kindlustuskatteid ning sattusin vastavale tabelile. Silma jäid klassikalised võrdlustabelite kasutajakogemuse mured. Siinkohal mõned ettepanekud, kuidas tabeli kliendikogemust paremaks muuta.
3 soovitust, mida antud tabeli puhul teha:
1. Kaalu zebra-mustri kasutamist – see aitab kasutajal silmadega paremini ridu hoida. Zebra-muster tähendab siis seda, et üle ühe on ridade tasutavärvid veidi erinevad, näiteks üks on valge ja teine helehall.
2. Aita kasutajal järge pidada. Kui kasutaja hiirega tabeli reale suundub, muuda selle taustavärvi või rõhuta vastava rea joont. Järjehoidja on lisaks zebra-mustrile mugav viis lugemise rütmi hoidmiseks tabelis.
3. Kui mõni kindlustuskate puudub, näiteks Gold kaardi puhul rendiauto kaskokindlustus, ära jäta lahtrit tühjaks. Selle asemel kirjuta “Puudub” või kasuta sidekriipsu “-“.
Olen kasutajakogemuse teste läbi viies märganud, et tühjad lahtrid, eriti võrdlevates tabelites, ajavad klientidel tihti “juhtmed sassi” – kes hakkab veebilehte värskendama, sest arvab, et info ei laadinud ära; kes mõtleb, et järelikult valik kehtib mitmele tootele.
Tabelite, eriti mahukamate puhul, tasub silmas pidada, et meie töö disaineritena on hoida kasutajate kognitiivne koormus madalana. Mida raskem on tabelit hoomata, seda suurem tõenäosus on, et kasutaja väsib ja jätab teekonna pooleli, aga seda me ei taha. 🙂
2. Mida võimaldab Lovable AI?
Lovable’ga saad luua veebilehti ja lihtsamat äritarkvara, kasutades algsisendina näiteks teksti, pilti või ka Figma faili.
Mis mulle meeldib on integratsioon Supabase andmebaasiga, GitHub tugi ning võimalus veebilehte oma domeenil avaldada.
Kui võrrelda Bolt.new’ga, millest eelmises numbris kirjutasin, siis hetkel on just veebilehe avaldamise lihtsus Lovable eeliseks. Samas kaardimaksete vastuvõtmise integratsioon Stripe’ga on Bolt.new’s intuitiivem.
💡 Tule UX / UI ja AI disaini koolitusele kui soovid õppida kasutajasõbralikke digilahendusi looma. Lisaks pakume ka mentoritoega koolitusprogrammi täiendõppijatele ja karjääripöörajatele.
3. Mis eelised on Google Veo3 mudelil?
Veo 3 on Google uus AI-videote genereerimise mudel, mis on äge selle poolest, et lisaks liikuvale pildile loob see ka automaatselt tegelaste kõned ja vajadusel juurde taustahelid.
Minul on ligipääs Veo 3 mudelile läbi Canva ja Veed.io tasulise paketi. Veed.io’s on AI Playgroud krediitide süsteem ning Canvas saab luua 5 videot kuus. Lisaks avastasin, et Gemini Pro ärikliendi tasulises paketis on video loomise võimekus lisatud. Seal on piirang 3’le videole päevas.
4. Miks võiksid Flowstep.ai tarkvara proovida?
Flowstep.ai missiooniks on aidata ideest veebi- ja äpidisaine luua. Selle startupi sünnilugu on seotud ka Eestiga ning sellesse on investeerinud mitmed kohalikud äriinglid.
Hetkel on Flowstep üsna algusjärgus, võimaldades luua esmaseid visandeid promptimise teel. Samuti saad genereerida teekonnakaarte, et enne disainimist vajalikud vaated läbi mõelda.
Flowstepis on ka üks vahva nupp – “Next screen”, mis aitab kiirelt, AI-maagiat kasutades, järgmist seotud ekraani luua.
Flowstep on praegu kõigile tasuta kasutamiseks saadaval.
5. Kas sinu veebilehel saab sisu juurde hüpata?
Sisu juurde hüppamise ehk skip to main content link on oluline ligipääsetavuse abiline. Kui veebilehele tulles peab klaviatuurikasutaja (jah, veebilehe navigatsioon peaks toimima ka ilma hiireta) või ekraanilugejaga navigeerija läbima kümneid korduvaid menüülinke enne, kui jõuab sisuni, tekib kasutajal frustratsioon ja võib-olla ka loobumine. 😔
Just selle vältimiseks on loodud lihtne, ent asjalik lahendus: “Skip to main content” ehk “Liigu põhisisu juurde” link.
See link ilmub ekraanile tavaliselt alles siis, kui kasutaja hakkab lehte klaviatuuriga sirvima (nt vajutab Tab-klahvi). Link viib fookuse otse põhisisu juurde, jättes menüüd ja muud korduvad elemendid vahele.
Miks see oluline on?
- Aitab ekraanilugeja- ja klaviatuurikasutajaid kiiremini vajaliku sisuni.
- Vähendab korduvat navigeerimist igal leheküljel.
- Näitab, et veeb on teadlik fookuse juhtimisest.
- Toetab WCAG ligipääsetavuse kriteeriumi “Success Criterion 2.4.1 Bypass Blocks”.
Kas sinu veebis on “Liigu põhisisu juurde” olemas ja toimiv? Proovi ise – ava leht ja vajuta kohe Tab’i. Kui linki ei ilmu või see ei vii põhisisu juurde, on see lihtne, ent oluline paranduskoht, mida disaineri ja arendaja abil ellu viia.
👉 Ligipääsetavusest olen varasemates episoodides kirjutanud:
- Mis on ekraanilugeja ja kuidas see töötab?
- Miks on ALT-tekst oluline?
- Kuidas aitab aria-label ligipääsetavust tagada?
- Ligipääsetavus ja teksti kontrast – mida peaksid disainerina teadma?
- Miks võiksid Alt Text Generator AI-assistenti proovida?
- Millised on TOP probleemid veebilehtede ligipääsetavusega?
Ligipääsetavuse seadus jõustus eelmisel kuul, 28. juunil. Kui sa pole veel kursis, siis tasub tutvuda.
Aitäh, et uudiskirja loed! 🙏 Viska viis 🙌
