Vegard

Ferdig spill

idefase

første skisse

første prototype

andre prototype

leveranse

spillets gang

Vi lagde spillet "Outrun the Undead". Et asymmetrisk spill ment for 4 spillere, hvor én starter som Zombie (undead) og de tre andre som overlevende.

De overlevende har i oppgave å løse noen gitte oppgaver for å tilslutt få informasjon om hvor de må flykte til (safezone) for å vinne. I appen blir de veiledet gjennom dette. Samtidig må de gjemme seg og bevege seg smart rundt på spillområdet for å unngå å bli sett og tatt av zombien(e).

Zombiens rolle er å gjøre om alle de overlevende til zombier ved å være nær dem, og vinner ved å klare dette før noen har rukket å komme seg til safezone.

Videoen under inneholder både en onboarding-del som vi viste til alle spillerne ved spillets start, samt en runde spilt med playtestere.

Vi kalte spillideen vår for "Pantelotteriet" og spillet går ut på samle og pante flere panteflasker enn de andre spillerne, før spillet er over.

Samle panteflasker gjør man ved å trille terning for å bevege brikken sin rundt på stiene på spillbrettet og lande på spesifikke felter. De ulike feltene gir blant annet panteflasker avhengig av hvor mange runder ut i spillet man er, gjør at man må trekke sjansekort som både kan ha positive eller negative utfall, og buff/debuff felt som gjør deg raskere/treigere på neste flytt (kaste to ganger eller halvere antall øyne på terningen).

Panteflaskene hjelper deg i midlertid ikke vinne før du har kommet deg til en av butikkene i kanten av brettet og pantet dem, men det er tid du ikke får brukt på å samle enda flere flasker. På den måten får spillet et "risk vs reward" element. Dette forsterkes av at flere av de negative hendelsene straffer hardere jo flere panteflasker man bærer på, samt at spillerne kan forsøke å stjele fra hverandre om de lander på samme felt. Bildet under er en tidlig prototype av spillbrettet.

Og disse bildene er fra den ferdige prototypen vi leverte (brett og brikker, og sjansekort).

Planen

I uke to av introkurset til html og css var oppgaven å lage en nettside med et innhold som har sterk relasjon til internettet og internettets historie. Vi jobbet i grupper på to og to, og jeg samarbeidet med Peter.

Vi ble fort enige om at det hadde vært kult å vise fram utviklingen til "noe", på en scrollbar side med en form for tidslinje. Jeg startet deretter med å skisse litt basic layout, men gikk raskt over på å bygge ut inholdsstrukturen i html etter å ha konferert med arbeidspartner og fått tommel opp på at tenkt løsning så bra ut. I tillegg startet jeg ganske tidlig med å finne ut hvordan jeg kunne programmere denne tidslinja.

Koden

Tidslinja lot seg løse med to callback-funksjoner og tre vanlige funksjoner. Av de tre vanlige funksjonene så er den første for å regne om avstand scrollet av "main"-elementet på siden, til prosent på tidslinja. Nummer to for å flytte scrolle-indikatoren tilsvarende distanse scrollet. Og den tredje for å markører på tidslinja tilsvarende plasseringen til de ulike avsnittene eller "artiklene" i hovedinnholdet. De to callback-funksjonene er: en for å for å fylle inn artikkel-ID og tilhørende markør-ID i den tredje funksjonen, når nettsiden lastes inn. Og en (som ikke kom med på skjermbildet) for å kjøre den andre funksjonen når vinduet scrolles, og dermed oppdatere plasseringen til indikatoren.

En forbedring på koden kunne vært å legge til en event handler for når vinduet endrer størrelse, og en til callback-funksjon knyttet til denne som kjører alle de tre funksjonene på nytt. Dette da målene på tidslinje-elementene ikke stemmer overens lenger når andre elementer på siden skaleres om, og må derfor regnes ut på nytt.

Screenshot fra ferdig resultat.

Her kan du se resultatet. (funker best i FireFox, og ikke i chromium-browsere. - hehe). ...og her er link til repository:

I den første uka i HTML/CSS-introkurset, fokuserte jeg lite på selve innleveringa og brukte heller tiden min på å utforske og teste så mange som mulig av layout-systemene som finnes i CSS, samt hvordan bygge HTML koden på en fornuftig måte. Dette gjorde at jeg forkastet det jeg hadde og startet på nytt, mange ganger.

Det jeg tilslutt sendte inn som innlevering er kun et første dykk ned i layoutsystemet CSS Grid, og er egentlig ikke veldig representativt for arbeidet den uka.

Her er et repository med innleveringen:

Om appen

Det ferdige resultatet etter de tre ukene er nå en prototype for appen "naboden" - en app som tilrettelegger for deling av felleseid hageutstyr (eller det man måtte ønske) innad i borettslag, nabolag og velforeninger.

Dette gjør den blant annet ved å gi alle medlemmer av laget/foreningen oversikt over hva som til enhver tid finnes og er tilgjengelig av utstyr, samt lar dem booke gjenstander fram i tid. Den inneholder også en side/funksjonalitet som lar brukerne legge inn og stemme opp nye innkjøpsforslag. I tillegg til dette så er appen tenkt å fungere som en nøkkel til laget/foreningens bod der dette utstyret oppbevares.

Som konsept så vil det enkelt kunne tilpasses hver enkelt brukergruppes behov, da det er tenkt at laget/foreningen og dets styre, selv administrerer utvalget i sin bod. Med vår tildelte ting: "hageutstyr", så kom vi likevel frem til at appen vil være mest aktuell for nabolag med beboere som møter disse tre kriteriene:

begrenset oppbevaringsplass (mye hageutstyr tar ofte stor plass)

Har (litt) hage

Har (basert på kriteriet over) lav bruksfrekvens av relevant utstyr

Noe som betyr områder med hovedsakelig rekkehus eller flermannsboliger.

Prosess og resultat

Jeg føler jeg kan si at prosessen har gått ganske smud. Samarbeidet vårt var bra, og vi hadde god progresjon gjennom de to siste ukene.

Når jeg ser på forbedringspotensial så er noe av det som gjelder nå, som jeg også føler har gått igjen i de fleste tidligere prosjekter jeg har gjort, at jeg mener jeg burde ha brukt mer tid på skissering og ideutvikling. Både i starten av prosjektet, men også underveis - hvis bare for å bli sikrere på at det vi endte opp med var den beste løsningen.

En annen ting er at vi gjerne skulle ha brukt litt mer tid på å jobbe med UI og visuell profil. Vi snakket om at vi begge syntes utseende vi endte opp med var nokså kjedelig og jeg føler det ble mer et resultat av at vi var litt pressa på tid mot slutten av prosjektet, enn at det var noe som var veldig gjennomtenkt. Kanskje er det litt stramme vi endte på det mest fornuftige med tanke på appens funksjon, men igjen som i avsnittet over, så hadde det vært fint og tryggende å ha testa flere varianter.

Når det kommer til brukertesting, så er terskelen min for å gå opp til fremmede og spørre om de har tid til å teste (den uferdige og janky) tingen jeg har laget - helt ærlig - fortsatt ganske så høy. Men det hjelper at jeg har fått se verdien av å gjøre det, samt det at jeg har opplevd hvor stor snarvei det kan være sammenlignet med å selv prøve å gjøre den umulige oppgaven som er å forutse hvordan alle ulike personer vil interagere med tingen.

Alt i alt så er jeg godt fornøyd med både resultat og innsats.

Lenke til protoypen (trykk "R" for å restarte den):

...og til lysbildene fra presentasjonen:

Brief #3 - uke 3

Brief #3 - uke 2

Brief #3 - uke 2

"Skjermbasert interaksjonsdesign og deling."

Oppgaven i brief #3 går ut på å skape et skjermbasert grensesnitt som kombinerer former for ikke kommersiell deling med en gitt ting.

Tingen jeg fikk utdelt var "hageutstyr".

Målene for den første uka var å få definert prosjektets omfang, lage en enkel prototype i Figma, og å utføre noe brukertesting av prototypen og dokumentere funn.

Bakgrunn

Jeg startet med å ta en diskusjonsrunde sammen med Milla, som fikk utdelt samme ting, rundt hva denne appen og/eller tjenesten kunne være. Blant annet snakket vi om hva "hageutstyr" kunne tolkes som, hvilke potensielle brukergrupper vi kunne rette oss mot, og hvilke former for deling som var mulig.

Jeg fortsatte med litt videre utforskining på egenhånd, og gjorde blant annet noe research på hva slags liknenede tjenester og produkter som finnes fra før. Da oppdaget jeg at det allerede finnes en mengde tjenester for såkalt peer-to-peer utlån og utleie. For alle mulige ting og utstyr, men hovedsaklig redskaper og verktøy. Av den grunn så valgte jeg å istedet lage noe som tilrettelegger for en annen type deling, hvor lånegjenstandene er sentraliserte.

Når jeg tenkte på hvilke personer som kan ha nytte av en tjeneste der de kan låne hageutstyr/redskaper, så kom jeg fram til noen viktige kriterier:

personen har hage

personen kan ha begrenset oppbevaringsplass

personen har lav bruksfrekvens av slikt utstyr.

Basert på dette så bestemte jeg at det var mest logisk å rette appen/tjenesten mot beboere i borettslag og vel bestående av hovedsaklig rekkehus og flermannsboliger.

Dermed ble ideen en app som skal fungere som et verktøy og meldingsplattform knyttet til en større tjeneste for lån av hageutstyr og verktøy internt i borettslag eller velforeninger. Tjenesten er tenkt som en felles bod med felleseid utstyr, hvor beboere kan låse seg inn og låne gjennom appen. Tjenesten administreres av styreleder/medlem og beboerene selv, og tilpasses dermed deres behov.

litt notater/skisser fra prosessen:

App

Fellesboden (foreløpig navn) er tenkt å inneholde følgende funksjonalitet for alle brukere i et borettslag/vel:

Nøkkel til boden.

Til en hver tid gi brukerne oversikt over hvilket utstyr som ligger tilgjengelig i boden, og hva som for øyeblikket er utlånt.

Kø/bookingsystem for gjenstander som alt er utlånt.

Mulighet for å kontakte den som låner en spesifikk gjenstand.

Side for å legge inn og stemme opp innkjøpsforslag.

I tilleg til følgende funksjonalitet for brukere med administrasjonsrolle:

Lånehistorikk.

Godkjenne eller bekrefte innkjøp fra forslagssiden.

Se og administrere medlemsliste.

Administrere bodens innholdsoversikt.

Overføre administratorrettigheter ved styreskifte.

I denne uka så valgte jeg å fokusere funksjonaliteten til appen og på å prøve å få til intuitiv navigasjon, fremfor UI og estetikk. Derfor har jeg ikke utforsket og skisset noe særlig rundt utseende på appen og jeg har i all hovedsak tenkt på alle GUI elementene jeg har brukt så langt som placeholders.

Testing

Fra den lille brukertestinga jeg gjorde, så så jeg at mekanismen for å låse opp boden virka intuitiv. Den må imidlertid testes på mange fler før jeg tør å stole på det. Jeg merket også at det trykkbare området på enkelte ting (eksempelvis nøkkelen) godt kan utviddes litt.

En annen ting jeg merket meg når jeg kjørte prototypen på mobil, var at jeg burde ha konstruert alt responsivt. Små forskjeller i oppløsning og format mellom malene i figma og mobilene jeg brukte skapte problemer. Men igjen så var fokuset mitt denne uka mer på å "sketche" ut funksjonaliteten, og å få til intuitive koblinger mellom de ulike sidene i appen, fremfor å lage en "ferdig fil" som kan sendes til utvikler.

Når jeg fortsetter på oppgaven neste uke, så ønsker jeg å bygge opp fila på nytt, på responsiv måte, etter den "grovmalen" jeg nå har laget gjennom denne uka. Derfor har jeg ikke implementert endringer etter det jeg fant i brukertestinga enda.

Her er link til protoypen:

Check out this interactive prototype https://marvelapp.com/j7b5hih