Uusi sovellusprojekti - Näin se toimii

Moi! Minä olen Aija, olen Simplifiedilla päädevaajana. Sain tehtäväksi tehdä sovelluksen, joka toimii lisäpalveluna nykyisille asiakkaillemme. Tämä oli myös loistava tilaisuus kertoa käytännössä, miten me tehdään sovelluksia. Tämä on osa 5, uudet osat julkaistaan täällä blogissa, sekä uutiskirjeessä (johon voit liittyä tekstin lopussa).

Tervetuloa seuraamaan sovellusprojektia!

Kertaus edellisistä osista

Aiemmin kirjoittelin UI/UX-suunnittelusta, eli siitä miltä haluamme sovelluksen näyttävän, ja miten käyttäjä kulkee sovelluksessa.

Nyt meillä on siis ideoitu sovellus, jolle on määritelty sopiva alusta, rakennettu tietokanta ja tehty valintoja mm. ulkoasun, värien ja sivujen rakenteen suhteen.

Seuraavaksi olisi aika herättää sovellus eloon, eli puhua logiikasta. Nyt sovellus on vielä käytännössä staattinen kuva, jolla ei voi tehdä mitään. Eli seuraavaksi katsotaan, miten sovellus saadaan tekemään asioita, kun käyttäjä klikkailee nappuloita.

Logiikka pähkinänkuoressa

Kuten nytkin nettisivuilla ollessasi, painaessasi navigaation linkkiä, nappulaa tai nettisivuilla olevaa linkkiä, jotain tapahtuu. Eli sinä siirryt toiselle sivulle tai toiseen osioon sivustoa. Sovellusten logiikka toimii samalla tyylillä, mutta on tietysti tilanteesta riippuen enemmän tai vähemmän monimutkaista.

Jos tätä osuutta ei tehtäisi, sovellusta voisi vain katsoa, mutta sillä ei voi tehdä mitään. Ei kovin hyödyllistä.

Logiikka, tai toiminnallisuudet, ovat ne, jotka esimerkiksi:
1) Siirtää käyttäjän sivulta tai näkymältä toiselle
2) Näyttää, tallentaa, muokkaa tai poistaa tietokannassa olevaa tietoa
3) Muuttaa sovelluksen näkymää
4) Näyttää tai piilottaa elementtejä
Ja paljon muuta.

Välillä tätä näkee kuvattavan myös niin, että tietokanta on luuranko, UI/UX on iho tai vaatteet ja logiikka on lihakset.

Miltä se näyttää Flutterflowssa

Low-code työkaluissa on tässäkin suuri ero perinteiseen ohjelmointiin, koska "koodaus" tapahtuu puhekielellä (Natural language). Tämä on varmasti suurin ero perinteisen ja Low-code kehityksen kanssa, toisessa kirjoitetaan koodia, ja toisessa käytetään tavallista kieltä.

Ylhäällä esimerkkinäkymä Ruby-ohjelmointikielestä, kun luodaan käyttäjätiliä, ja alla GIFinä, miltä se näyttää Flutterflowssa.

Katsotaan vähä tarkemmin:

Ensin valitaan triggeri, eli milloin tapahtuu. Kun sivu latautuu, kun klikataan, ku tuplaklikataan?

Valitaanko suora toiminto (action) vai tarvitaanko ehdollista toimintoa (Jos tämä on totta, tee näin, mutta jos tämä on totta, tee näin).

Sitten valitaan mitä tehdään. Tässä esimerkissä luodaan uusi tieto tietokantaan (create document).

Seuraavaksi kerrotaan sovellukselle, millainen dokumentti luodaan. Tässä ollaan luomassa kurssia, ja kerrotaan että Kurssin nimi - tieto otetaan tietystä sovelluksen input-kentästä. Muutenhan sovellus ei tietäisi, minkä niminen kurssi on vaan antaisi kaikille kursseille saman nimen tai jättäisi nimen tyhjäksi.

Eli = Ota kurssin nimi käyttäjän täyttämästä kentästä "CourseName". Ja siitä toimintoketju yksi kerrallaan muodostuu, kunnes kaikki tarvittavat toiminnot on suoritettu ja tämä flow on valmis.

Miten suunnitella oman sovelluksen logiikkaa

Nyt kun näit, miten logiikka toimii tässä sovelluksessa, voit miettiä, miten oma sovelluksesi toimisi. Mitä käyttäjä haluaa sovelluksessa tehdä? Jos hän haluaa vaikka lisätä reseptin, laskea tarjouksen laskurilla tai ottaa kuvan tehdystä remontista, tämä prosessi on käytännössä ketju yksittäisiä tietokanta- ja logiikkatapahtumia.

Voit miettiä logiikkaa näin: Kun painan tästä napista, niin tämä tapahtuu. Kun haluan muokata tätä tietoa, painan tästä, jolloin tätä tapahtuu. Kun haluan nähdä tämän tiedon, painan tästä, jolloin tämä lista päivittyy näin.

Toisinaan logiikka saattaa olla hyvinkin kompleksista!

Tähän vaiheeseen mennessä annetut esimerkit ovat vielä hyvin yksinkertaisia, mutta tässäkin sovelluksessa esimerkiksi kyselyn logiikka menee jo aika monimutkaiseksi.

Täytyy tietää, mikä käyttäjä täyttää kyselyä, mihin tuntiin kysely liittyi, mihin kysymykseen hän vastasi oikein ja mihin väärin ja paljonko hänen kokonaispisteensä olivat, sekä miten käyttäjä kulkee koko kyselyn läpi ylipäätään. (Kun ensimmäiseen kysymykseen on vastattu, laske pisteet ja näytä käyttäjälle seuraava kysymys, paitsi jos tämä oli viimeinen kysymys, näytä sitten käyttäjälle hänen lopulliset pisteensä, tallenna tulokset tietokantaan tälle käyttäjälle ja ilmoita kyselyn omistajalle, että kyseinen käyttäjä on tehnyt kyselyn näillä pisteillä.)