Autentisering og abonnement ved bruk av Vipps

Bruker velger å logge inn

Videresendes til Vipps som står for authentisering

Når bruker har logget på, blir h*n sendt tilbake til app og kan jobbe videre

Videre er det også implementert ulike abonnement som bruker kan signere opp til, hvor selvsagt Cownter er premium funksjon.

Final delivery – Cowders

Intro Business Case:

Bilderesultater for the farmer lego

Bonden Emmet er en glad og flink bonde som er opptatt av hvordan det står til med sine jorder. Han er selvsagt opptatt av været men også hvorvidt han må vanne sine jorder gjennom en varm sommer. En annen liten ting Emmet må passe på er farlig ugress, men han er ikke helt sikker på hva som er farlig ugress og ikke. Derfor må han hele tiden kontakte sin nabovenn for å spørre. Han skulle ønske det fantes en enklere måte å finne ut av dette på. En annen liten ting Emmet er opptatt av er å telle kuer.

Men nå er det kommet en ny app fra Cowders som har vekket stor begeistring hos Emmet.
Cowders App gir han god oversikt over jordene med temperatur, luft og jordfuktighet ved hjelp av små sensorer han kan sette ut på jordene sine. I appen kan Emmet få oversikt over jordene sine og se tilstand, dersom det er tørt eller for fuktig vil han se dette i appen ved at det vises en advarsel.

Basert på innhentet data ser bonden i løsningen at det på en lokasjon av jordet har begynt å vokse en spesifikk type ugress. Bonden Emmet kan i løsningen se størrelsen og hvor stort området er og det kalkuleres hvor mye ugressmiddel som trengs. Basert på værdata og hvor mye bonden har på lager planlegges det å gjøre et innkjøp.

Målinger av fukt og temperatur fra både jorden og luften tilsier at det må vannes på jordet. I forhold til vær data er det spådd at det vil regne. Basert på på disse opplysningene får bonden hjelp til å beslutte hvor mye når det skal vannes.

Vekstkontroll:

For å utføre en vekstkontroll kan bonden Emmet bruke mobil appen til å ta bilde av veksten han har funnet, sende inn og få beskjed om dette er ugress eller ikke:

Emmet klikker seg inn på Vekstkontroll
Emmet tar bilde av planten han er usikker på
Emmet får svar fra tjenesten om at dette ser ut som en potensielt farlig ugress og får muligheten til å opprette et problemnotat

I tillegg til Appen kan Emmet logge seg på via sin PC og få tilgang til løsningen gjennom en web-side laget med Blazor. Denne er til og med mulig å installere som en PWA( Progressive Web App) siden den benytter en service worker for caching av appen for rask og fin brukeropplevelse.

Vekstkontroll.

Vår løsning har som mål å bistå bonden med vektkontrol. Målet er å hente inn sensor data, visualisere disse og trigge alerts i løsningen for å hjlepe

Løsningsoversikt – Vekstkontroll

Cownter

En annen viktig funksjon Bonden Emmet liker ved appen er at han enklere kan telle kuer, Emmet bruker ikke tall så han vil heller se hvor mange kuer han har.

Avvik på jordmålinger og ugress i bilder ender opp i Customer Service Hub for oppfølging fra Felleskjøpets fagkonsulenter som vil kunne bistå bonden i å fikse problemene hans.

Avvik i Customer Service Hub via IOT Alerts

Bruk av maskinlæring for å identifisere fargebruk i bilder

Vår løsning som gir bonden anledning til å sende inn bilder til analyse, for å identifisere ugress, inkluderer bruk av Cloudmersive sin ML/AI-baserte bilde-API’er.

Utsnitt fra deres dokumentasjon for API’ene:

Vår bruk av API’et skjer via Logic App som kommer med en hendig ferdig connector.

Responsen fra Cloudmersive kommer som RGB arrays med de 5 mest fremtredende fargene. Dette oversetter og forenkler vi til fargenavn (Red, Purple, Blue, Green, Yellow, Cyan) via Hue i HSL fargemodell. Denne oversettingen gjøres i Function App RGBtoHSL, ref screenshot under.

Claiming Badge

Glossy pixels.

Felleskjøpets standard designbibliotek.

Vi har brukt FKA sitt design på alle brukergrensesnitt i løsningen. 

Gjenbruk av design gir fordel med at det er praktisk med et sentralt sted hvor man kan innhente gjenbrukbare detaljer når man trenger det. FKA sin er laget så pass lett gjenbrukbare og lett tilgjengelig slik at det har vært enkelt å innhente de elementene vi har hatt behov for. 

FKA designbiblioteket gir oss:

  • Farger
  • Typografi
  • Størrelser og mellomrom
  • Ikoner

Disse elementene er implementert i vår løsning:

  • Vår web-side som er bygd med Blazer.

  • Samme design elementene er brukt i React-native.
Glossy pixels

CI/CD yaml

  • Bruker bygg i DevOps med trigger på commit i GitHub repo for å bygge servicen; Yaml script

Release trigger som legger rett ut i prod

Deilig med CI/CD, da får man litt tid til å drikke kaffe også, mens MS og GIthub jobber.

  • Release av static webpage på commit fra github
Power of the shell

“Near-Time”-data fra bonden

Et gammelt indiansk ordspråk lyder som følger (ikke verfisert): “Før du rekker å få sende en lang beskjed via røyksignaler, kan det allerede være for sent”. Dagens bønder har behov for oppdaterte data fortløpende og i vår løsning for vekstkontroll har vi tatt i bruk teknologi som understøtter dette behovet.

Sentralt i løsningen finner vi en Event Hub som kan ta imot data fra IOT sensorer eller fra bildeanalyse. Event hub’en kan videre supportere mange konsumenter av data som følger strømmen i sin egen hastighet.

Som i vår løsning skissert over så inkluderer dette Stream Analytics for analyse og aggregeringsformål, arkivering til andre datalagringstjenster slik som Azure Table Storage eller en .NET Core app som direkte konsumerer og behandler strømmen av data fortløpende.

To enkle Stream Analytics Queries som går leser fra Event Hub og sender data inn i et PowerBI dataset (cowders-sensor2) og til Table Storage (cowderstreamoutput) for historikkformål

Claiming badges

“Right Now” for designet og implementasjonen av en Near-time løsning

Følge opp IOT Alerts i Customer Service HUB og sensordata i PowerBI for Felleskjøpets fagkonsultenter

Bondens sensorer sender inn kontinuerlige målinger av jordfuktighet, lufttemperatur og luftfuktighet.

Dersom jordfuktigheten går over 70 eller under 5 vil en IOT Alert opprettes i Dynamics Customer Service HUB og knyttes til bonden via sensorens id.

På samme måte vil bilder bonden sender inn til ugressanalyse sendes videre som en IOT Alert til Customer Service HUB for mulig videre oppfølging av Felleskjøpets fagkonsulenter.

Active IOT Alerts med Soil Deviation og Anomalys for ugress

IOT Alertene opprettes i Dynamics ved hjelp av Logic Apps sin Common Data Service-Create Record action.

Logic App som oppretter IOT Alert for ugress
Logic App som oppretter IOT Alert ved uønsket fuktighetsnivå i jorda

Sensordataene sendes til PowerBI via Eventhub og Stream Analytics og fagkonsultenter vil kunne bruke dashboardet til å følge med på sensormåligene ute hos bonden.

PowerBI dashboard med sensordata ment for interne fagkonsulenter

Claiming badges

Cameleon and Hi 5

Blazor appen vår bruker et responsivt design og god kodestandard gjennom bruk av HTML5 tags.

Viser bruk av HTML5 tags og mobilvisning.
https://youtu.be/K7h0Kq6u1Zw
Chameleon for responsivt design
Bruk av HTML5 tagger i løsningen.

Cowders React Native App – Teknisk

Cowders mobil app er utviklet på React Native for å kunne lage en app som kan distribueres gjennom App Store for iPhone/IPad og Google Play for Android telefoner. Vi bruker også Expo som gir oss en rekke vanlige funksjoner og tjenester en bruker i en App. Videre kan også Expo brukes til å deploye apper til App Store/Play Store. Vi sikter på å kunne gi dommerne tilgang til appen slik at de skal kunne installere den på sin egen telefon. Expo er også tatt i bruk for å nå kamera og til pålogging gjennom Vipps.

Link til bruk av Kamera gjennom React Native og Expo: https://github.com/Cowders2021/cowzor-native/blob/master/pages/Camera.tsx

Appens hovedmeny, midlertidig sådan

Videre bruker vi React sit context API for State Management i appen, dette gjelder for en rekke av de ulike løsningene i appen, hittil værdata, notifikasjoner, men her vil sensordata og ikke minst den viktige Cownter funksjonen.

Link til vår bruk av React Context API: https://github.com/Cowders2021/cowzor-native/tree/master/contexts

Til denne posten claimer vi:

Go Native siden det er en Native app for Android og iPhone
Hipster for å bruke expo, react context api, delvis også for å bruke Blazor i desktop app (Vil bli bedre beskrevet i egen post)
moderne rammeverk, react native, context api, expo