1. Sovi ensin, mitä laskuri lupaa käyttäjälle
Esimerkkimme laskee verkkoprojektin työvaiheiden hinnat yhteen. Jokaisella rivillä on työn nimi, tuntimäärä ja tuntihinta. Käyttäjä voi lisätä ja poistaa rivejä.
Ennen toteutuksen hyväksymistä kirjoita asiakkaan kanssa auki kolme asiaa:
- Mitä tulos tarkoittaa? Onko se suuntaa antava hinta-arvio vai yrityksen hyväksymä tarjous? Käyttöliittymän tekstin pitää vastata sovittua tarkoitusta.
- Mistä luvut tulevat? Syöttääkö kävijä tuntihinnan itse vai valitseeko hän palveluita asiakkaan hinnastosta?
- Mitä laskennan jälkeen tapahtuu? Näkeekö kävijä vain tuloksen vai voiko hän lähettää tarjouspyynnön?
Tässä harjoituksessa käyttäjä syöttää luvut itse ja näkee verottoman työmääräarvion. Laskuri ei lähetä tietoja, tallenna niitä eikä tee tilausta. Jos asiakkaan versioon tulee veroja, alennuksia tai vähimmäisveloitus, sovi niiden laskentasäännöt ja esitystapa erikseen.
Rajaus ratkaisee myös työmäärän. Sähköpostiin lähetettävä tarjous, asiakasrekisteri ja maksaminen ovat lisätoimintoja, joilla on omat tarkistuksensa. Ensimmäisen version ei tarvitse sisältää niitä kaikkia.
2. Laske oikeat vastaukset ennen kuin testaat ohjelmaa
Älä päättele laskurin toimivuutta siitä, että se näyttää järkevän summan. Kirjoita muutama esimerkki ja laske niiden vastaukset erikseen.
Käytetään seuraavia havainnollistavia työvaiheita. Tunnit ja hinnat eivät ole suositus asiakasprojektin hinnoitteluun.
| Työvaihe | Tunnit | Tuntihinta | Odotettu summa |
|---|
| Suunnittelu | 4 | 80 € | 320 € |
| Toteutus | 12 | 80 € | 960 € |
| Testaus ja julkaisu | 3 | 80 € | 240 € |
| Yhteensä | 19 | | 1 520 € |
Muuta tämän jälkeen suunnittelun tuntimääräksi 4,5. Sen rivisumman pitää olla 360 euroa ja kokonaisuuden 1 560 euroa. Poista sitten toteutusrivi: jäljelle jää 600 euroa.
Näillä kokeilla tarkistat jo kolme eri asiaa: yhteenlaskun, desimaalien käsittelyn ja rivin poistamisen vaikutuksen. Pyydä tekoälyä tekemään samoista tapauksista automaattiset testit. Säilytä itse lasketut odotusarvot, jotta testit eivät vain toista ohjelman mahdollista virhettä.
Sovi myös, missä kohdassa rahasummat pyöristetään. Jos käytätte rivikohtaista pyöristystä, tarkista erikseen tapaus, jossa rivin laskettu hinta sisältää sentin murto-osia. Pelkkä kahden desimaalin näyttäminen ei vielä kerro, miten ohjelma laskee summan.
3. Kokeile myös syötteitä, joita et itse käyttäisi
Kävijä saattaa tyhjentää kentän kirjoittaakseen uuden luvun, liittää arvon toisesta ohjelmasta tai painaa väärää näppäintä. Laskurin pitää kertoa ymmärrettävästi, jos syötteellä ei voi laskea.
| Kokeilu | Mitä tarkistat |
|---|
| Tyhjä tuntimäärä | Laskuri pyytää puuttuvaa arvoa eikä esitä keskeneräistä laskelmaa valmiina. |
| Nolla tuntia | Rivisumma on nolla, jos nolla on sovitusti sallittu. |
| Negatiivinen tuntimäärä | Kenttä näyttää selkeän virheen, jos negatiivisia arvoja ei sallita. |
Desimaali 4,5 | Suomenkieliseen käyttöön sovittu desimaalimuoto toimii. |
| Teksti numerokentässä | Virheellinen arvo ei päädy tulokseksi tai muutu huomaamatta nollaksi. |
| Sovitun ylärajan ylittävä luku | Käyttäjälle kerrotaan sallittu raja. |
| Viimeisen rivin poistaminen | Laskuri joko estää poistamisen tai näyttää ymmärrettävän tyhjän tilan. |
Kun virheellinen arvo on korjattu, virheilmoituksen pitää poistua ja tuloksen päivittyä. Tarkista myös, ettei vanha summa jää näkyviin tavalla, joka näyttää uuden syötteen oikealta vastaukselta.
Jos laskuri myöhemmin lähettää tietoja palvelimelle, selainkenttien tarkistukset eivät riitä: vastaanottavan palvelimen pitää tarkistaa syötteet uudelleen. Selainpuolen rajoitukset voidaan ohittaa. Tämä ero kuvataan myös OWASP:n syötteiden validointiohjeessa.
4. Käytä laskuria puhelimella ja näppäimistöllä
Avaa esikatselu oikealla puhelimella. Syötä kaikki luvut, lisää työvaihe ja poista toinen. Katso, pysyvätkö kenttien nimet ja lopputulos luettavina myös näppäimistön ollessa auki.
Tee sama tietokoneella käyttämättä hiirtä. Siirry kentästä toiseen sarkaimella ja käytä painikkeita näppäimistöllä. Näetkö koko ajan, mikä kenttä tai painike on valittuna?
Jokaisella kentällä pitää olla ymmärrettävä nimi, kuten ”Tunnit” tai ”Tuntihinta”. Kentän sisään kirjoitettu esimerkkiteksti katoaa syötettäessä, joten se ei yksin korvaa kentän nimeä. Nimen tulee myös olla ohjelmallisesti yhdistetty kenttään. W3C:n lomakeohje näyttää tähän käytännön toteutustavat.
Tarkista erityisesti virhetilanne pienellä näytöllä: löytääkö käyttäjä ongelmallisen kentän ja ymmärtääkö hän, miten sen korjaa?
5. Selvitä, tarvitseeko laskuri palvelinta tai salaisuuksia
Tämän esimerkin kertolaskut ja yhteenlasku voidaan tehdä selaimessa. Niitä varten ei tarvita tekoälypalvelua, API-avainta tai käyttäjätiliä. Tekoäly auttaa rakentamisessa, mutta sen ei tarvitse osallistua laskurin käyttöön.
Selaimelle toimitettua koodia ja tietoja voi tutkia. Älä siis sijoita sinne salaisia avaimia tai hinnastoa, jonka asiakkaasi haluaa pitää luottamuksellisena. Myöskään selaimen näyttämään summaan ei pidä luottaa maksun tai sitovan tilauksen perusteena ilman palvelimen omaa laskentaa.
Jos projektiin lisätään tarjouspyyntölomake, testattava kokonaisuus kasvaa. Tarkista silloin ainakin tietojen vastaanotto, virhetilanne ja se, että onnistumisviesti näytetään vasta palvelimen vahvistuksen jälkeen. Testaa nämä keksityillä tiedoilla.
Tämä tarkistuslista auttaa rajaamaan ensimmäistä projektia. Se ei yksin ole koko sovelluksen tietoturva-auditointi.
6. Pyydä tekoälyltä rajattu korjaus ja tarkista se itse
Kun löydät virheen, anna tekoälylle täsmällinen tapa toistaa se. Esimerkiksi:
Tarjouslaskurin tuntikentässä arvo 4,5 aiheuttaa virheen. Tuntihinta on 80 euroa, joten odotettu rivisumma on 360 euroa. Toista ongelma ja selvitä syy. Korjaa suomalaisen desimaalipilkun käsittely muuttamatta muuta laskentasääntöä tai ulkoasua. Lisää testi tälle tapaukselle sekä tyhjälle ja negatiiviselle arvolle. Kerro, mitä muutit, mitä testejä ajoit ja mitä et voinut varmistaa.
Korjauksen jälkeen tee sama koe selaimessa uudelleen. Kokeile myös aiemmin toiminutta kokonaislukua ja rivin poistamista. Näin huomaat, jos yhden ongelman korjaus rikkoi toisen toiminnon.
Vibekoodarin Git- ja debuggausosuudessa harjoitellaan juuri virheen paikantamista, korjauspyynnön tekemistä ja toimivaan versioon palaamista. Jos ensimmäinen versiosi syntyy mutta korjaaminen jää arvailuksi, katso kurssin sisältö ja etenemistapa.
7. Hyväksytä julkaistava versio ja sovi ylläpidosta
Anna asiakkaalle esikatselulinkki ja muutama valmis testitapaus odotettuine tuloksineen. Pyydä häntä vahvistamaan laskentasäännöt ja käyttäjälle näkyvät tekstit. Pelkkä ulkoasun hyväksyminen ei vielä varmista, että laskuri vastaa asiakkaan tapaa hinnoitella.
Käy ennen luovutusta läpi nämä asiat:
- Laskuri on kokeiltu asiakkaan varsinaisella sivulla, ei vain erillisessä esikatselussa.
- Julkinen osoite ja HTTPS toimivat, ja laskuria voi käyttää kirjautumatta ylläpitoon.
- Asiakkaan kanssa on sovittu, kuka hallitsee julkaisupalvelua ja maksaa mahdolliset jatkuvat kulut.
- Toimiva versio on tallessa ja tiedät, miten palautat sen epäonnistuneen päivityksen jälkeen.
- On sovittu, kuka muuttaa hintoja, korjaa virheitä ja hoitaa jatkokehityksen.
Kun hinnastoa myöhemmin muutetaan, aja samat laskentatestit uudelleen uusilla odotusarvoilla. Tarkistuslista palvelee myös ylläpitoa.
Haluatko ottaa tällaisen projektin osaksi asiakastyötäsi?
Laskurin tekeminen asiakkaalle koostuu useasta opeteltavasta taidosta: rajaat tarpeen, ohjaat tekoälyä, tarkistat laskennan, korjaat virheet ja julkaiset hyväksytyn version. Tässä artikkelissa sait tarkistusrungon. Oman projektin toteutuksessa tarvitset myös käytännön tavan tehdä nuo vaiheet.
Vibekoodari on suomenkielinen AI-koodauskurssi, jossa käsitellään projektin määrittelyä, Git-versionhallintaa, debuggausta, automaattisia testejä, nettisivun julkaisua ja turvallisuustarkistuksia. Voit soveltaa näitä taitoja yhteen rajattuun laskuriin tai muuhun asiakkaan verkkotyökaluun.
Jos sinulla on mielessä asiakas ja pieni toteutettava tarve, tutustu Vibekoodari-kurssiin, sisältöön ja hintaan. Arvioi kurssia sen perusteella, auttaako sen työnkulku sinua viemään juuri tämän projektin ensimmäisestä versiosta luovutukseen.