Thea Ve Design

[theasofiefv]

Visuelle elementer

Iterasjon

[theasofiefv]

[theasofiefv]

«Interaktiv læring»

Resultat

«Learning by Speaking»

"Learning by Speaking" er et digitalt verktøy for å øve på og forbedre den spontane samtalen i fremmedspråklig undervisning i 8.klasse. Den befinner seg inne på Skolestudio, som et alternativ til oppgaver man kan gjøre per kapittel i fremmedspråklige fag.

Tenkt brukssituasjon er i klasserommet, etter læreren har hatt litt teoriundervisning og vil variere med litt muntlige øvelser. Elevene logger seg på Skolestudio, går inn på kapittelet de er på, og lager et rom (litt inspirert av Kahoot) som de kan samarbeide på. Oppgaven er i utgangspunktet tenkt til å være mellom 2-og-2, men kan også brukes med flere, eventuelt hele klassen.

Øvelsen går ut på å lage et bilde gjennom drag-and-drop med ulike figurer, som de lager til en komposisjon som de skal videreformidle til medeleven sin, gjennom å snakke på fremmedspråket sitt. Uten å se skjermen, skal medeleven spørre seg fram til hvordan bildet ser ut, og etterpå får de tildelt en score basert på hvor nøyaktig de traff. Deretter bytter man på roller.

På denne måten kan man tilpasse vanskelighetsgraden ut ifra hvor mange komponenter/hvordan man setter opp bildet sitt, og gjøre den enklere/vanskeligere. Hvor nøyaktig scoren blir varierer også på hvor langt du er kommet i skoleåret og hvilke kompetansemål som følger med hvert kapittel.

Det vi ønsker med produktet vårt er å gjøre elever mer komfortable med å snakke fremmedspråket de lærer, samt bedre rustet mot en muntlig eksamen. Vi ønsker å gjøre den inaktive eleven som bare hører på læreren snakke, til den deltakende eleven som får øvd seg på å delta i spontane samtaler med medelever. Og forhåpentligvis er ikke øvelsene forgjeves og de får bruk for det senere i livet.

I dette prosjektet har jeg lært mye om oppbygning og narrativ i presentasjoner, men også sett verdien i å lage et personlig uttrykk på produktet sitt og beholde litt kunstnerisk frihet.

Her er en liten animasjon av produktet i bruk:

[theasofiefv]

«Interaktiv læring»

Prosess

«Learning by Speaking»

I denne oppgaven skulle vi designe et digitalt, interaktivt produkt i samarbeid med Gyldendal, med formål om økt læringsutbytte gjennom gode opplevelser.

Etter en del idémyldring, bestemte vi oss fokusområdet "samarbeid og motivasjon" og valgt faglig område ble fremmedspråk, ettersom vi så et stort potensiale her.

Nøkkelfunn fra intervjuer vi hadde, var:

-Fremmedspråklig undervisning på ungdomsskolen la et generelt dårlig grunnlag for videre læring

-Undervisningen er for lite tilrettelagt mot muntlig eksamen. For få/dårlige muntlige øvelser

-Ikke veldig relevant å øve på presentasjon framfor en hverdagslig samtale

-Flere var positivt til å jobbe i mindre og mer intime grupper, som ga mer trygghet for alle og en lavere terskel for å feile

Ved å øve på dialog på denne måten, blir elevene bedre på den spontane samtalen, setningsoppbygging og generell økt muntlig forståelse, som er særdeles nyttig mot en eventuell muntlig eksamen.

Vi håper også at gjennom å øve på mer relevante situasjoner, vil enkelteleven se hvordan de kan bruke faget, og deretter vil motivasjonen for faget øke.

Videre valgte vi å jobbe videre med en idé kalt "Sketch and tell". Vi hadde flere idéer til gode muntlige øvelser, men alle var ikke like "enkle" å implementere digitalt.

Ved å lage et slags tegneprogram, falt det mye mer naturlig at dette skulle skje digitalt og det kunne bli en morsom og kreativ tvist på den vanlige samtalen.

Forbedringer vi gjorde etter brukertesting, var blant annet:

-Burde være mulighet for hjelpe-ord, -setninger og -spørsmål dersom man slet

- Kunne høre ordene bli lest opp for å høre uttalelse

- Lage et mer personlig preg på illustrasjonene

[theasofiefv]

«Designing with APIs»

Resultat + prosess

I denne oppgaven valgte vi å ta utgangspunkt i NASA sine APIer om «Near Earth Objects» aka asteroider. Vi vurderte en sammensetning av flere ulike APIer og lette etter artige sammenhenger, men tatt tiden i betraktning valgte vi noe mer tydelig og konkret.

Der fant man informasjon om hvilke asteroider som går eller har gått i bane i nærheten av jorda, hvorav noen var markert som potensielt skadelige. Man fikk også vite hvor langt unna de var, hvor fort de reiste og hvor nærme de eventuelt kom oss.

Måten vi valgte å visualisere dette på var ved å vise fram informasjonen sammen med en animasjon av jorda sett fra asteroidens perspektiv. Denne oppdateres like ofte som NASA fikk inn nye data (vi fant ikke informasjon om hvor ofte denne ble oppdatert).

Dersom en asteroide skulle nærmet seg, vil det animeres en eksplosjon, avstanden reduseres til null og teksten vil blinke rødt. Så da er det bare å sette seg ned i sofaen og vente på det unngåelige!

Vår nettside byr altså på veldig forskjellige opplevelser i motsatt ende av følelse-spekteret.

Det varierer fra ren lykke og avslapning av at man ikke har noe å bekymre seg for - til en rå, lammende og overveldende dommedagsfølelse!

Slik så koden ut på HTML og CSS.

«Doomsday»:

https://countdowndoomsday.netlify.app/

[theasofiefv]

«Something interesting about space»

Designing for web (HTML & CSS)

Jeg designet en nettside om svarte hull. Den har en navigasjonsmeny øverst som lenker til andre sider med mer informasjon. Holder du musen over bildet på forsiden så aktiveres en liten søt animasjon.

Min nettside:

https://determined-neumann-7a3e93.netlify.app/index.html

[theasofiefv]

«Something interesting about space»

Designing for web (HTML & CSS)

Prosess

I denne oppgaven skulle vi designe en nettside som formidlet et interessant budskap om verdensrommet, gjennom grunnleggende bruk av HTML og CSS.

Jeg valgte ganske tidlig å fokusere på svarte hull ettersom det er tema som aldri slutter å være spennende.

Deretter begynner jeg ganske rett på med å bygge opp nettsiden fra bunnen av. Læringskurven var veldig bratt og mesteparten av tiden på prosjektet gikk til å lære og feile.

Jeg lærte hvor skjørt koding var, hvordan ulike elementer kommuniserte med hverandre og at det fantes mange ulike tilnærminger til samme problem.

Mye av tiden gikk for min del til plassering av tekst og bilder, for det var mange små detaljer som skulle fikses på hele tiden. Jeg fant blant annet ut på den kjipe måten at man aldri skal flytte mye rundt på filene sine på pcen…

I retrospektiv skulle jeg gjerne valgt en mer interessant og «original» fremstilling av de samme faktaene. Oppsettet mitt var veldig normalt og konvensjonelt, og jeg burde utforsket enda mer med de verktøyene jeg hadde, som praktisk talt ikke eier grenser. Jeg fikk ikke like mye tid til å se på hva mine medstudenter gjorde, ettersom jeg fokuserte litt for mye på mitt eget, og det var vel å merke et veldig kort prosjekt.

Til tross for alt det, synes jeg det var utrolig morsomt og spennende å lære om koding, HTML og CSS. Innimellom all frustrasjonen har jeg kost meg skikkelig. Det som tidligere føltes som et umulig mysterie føles nå som et vanskelig, men løsbart problem.

[theasofiefv]

«Future Live Events»

Resultat - Del 2

Resultatet vårt ble LOBBY -et sosialt og underholdende venterom.

Det var viktig for oss å holde fokuset på VIER.LIVE og selve konserten, slik at det ikke bare ble et spillerom. Det var her quizen kom inn i bildet - det ble den røde tråden mellom publikumet og artisten.

Fra forrige resultat-post, gjenstår flere av de samme funksjonene, med noen nye tilskudd. Etter å ha valgt konsert du vil følge med på, blir du møtt med en skjerm med en nedtelling til konserten starter, men denne gangen med den klassiske chaten fra VIERLIVE til høyre. Etter du velger å gå inn i Lobbyen så blir du møtt med en animasjon hvor avataren din blir dratt med inn i et annet «univers».

Du får tilbud om en tutorial, som du også kan takke nei til. Ombestemmer du deg så kan du alltid trykke på informasjonsknappen til venstre for å få tilbake tutorialen igjen.

Du kan trykke på andre deltakere, se på deres profiler, eller se på din egen og endre innhold etter eget ønske. Du kan legge til andre deltakere som venner, opprette grupper og sende private meldinger mellom andre publikummere. Du kan også se på leaderboardet, eller velge å holde den skjult.

Trykker du på quiz-knappen, får du et valg om to ulike quizer, en litt mer seriøs og en tullete. På denne måten kan man lære noe nytt om artisten på ulike måter.

Begge quizene er 10 spørsmål lange, gir deg indikasjon på hvor langt du er kommet underveis og en liten «reaksjon» per svar.

Basert på hvordan du svarer på quizene, hvor mange svar du får riktig eller hvilke quizer du velger å svare på, får du bagdes som du kan velge å utstille i profilen din.

Når konserten begynner, starter en nedtelling fra 10 sekunder på skjermen din, og den fader ut til svart.

Til ettertanke er jeg veldig fornøyd med hvordan prosjektet endte opp med. Jeg lærte så mye og ikke minst hadde det enormt gøy med alle detaljene og funksjonene. Vi kunne kanskje prioritert en mer kvantitativ brukertesting, men med tanke på det korte tidsrommet er jeg svært fornøyd med innsatsen og arbeidsmengden vi la inn i prosjektet. Er utrolig takknemlig for at vi fikk muligheten til å skape noe som dette!

Prototype:

https://www.figma.com/proto/athHOVyuBKWM0PIzFobSej/LOBBY?page-id=64%3A680&node-id=216%3A91&viewport=244%2C48%2C0.03&scaling=min-zoom&starting-point-node-id=216%3A91

Figma

Created with Figma

[theasofiefv]

«Future Live Events»

Prosess - Del 2

I den andre delen av prosjektet ble mitt prosjekt slått sammen med Oda sitt.

Vi bestemte oss tidlig for å kombinere begge konseptene våre, da begge var relevante for brukersituasjonen - «ventetiden» før en konsert startet. Der synes vi det var mye potensiale å utnytte. Vi ble enige om at et digitalt venterom var en god idé, men den manglet noe «spice»/underholdning til å gjøre den mer spennende og til å skape et samtaleemne for spillerne. Og her kom quizen inn i bildet - det ble et digitalt venterom, hvor man kan delta i quiz om artisten og bli bedre kjent.

Dette ble hovedelementene vi tok med oss videre inn i samarbeidet: quiz, et personlig bånd til artistene, sosial interaksjon og et digitalt venterom.

Vi hoppet rett inn i Figma og på å lage den digitale prototypen. Her var det mye prøving og feiling. Det var veldig mye som skulle gjøres på kort tid, så vi startet tidlig med å delegere oppgaver. Det var alt fra å lage illustrasjoner av avatarer, lage alle quiz-spørsmålene, alle svaralternativene, tutorials og mange andre små detaljer som ble lagt til.

Under brukertestene ble de fleste veldig engasjerte. Mange ville legge til flere funksjoner, som å spille ballspill, ha en bar der, kjøpe merch, men vi valgte å begrense dette for å ikke miste fokuset på selve konserten. Våre nøkkelfunn fra brukertestene var:

-Foretrukket lengde på quizene var rundt 10-15 spørsmål

-Det burde være en indikasjon på hvor man befinner seg i quizen. «Hvor lenge varer dette?»

-Folk vil velge selv hvilken informasjon om seg selv som er offentlig, det er veldig individuelt. I egen profil burde man derfor kunne slette eller velge selv hva som man ville skulle være synlig til offentligheten.

-Det var mye potensiale innen konkurranse og å spille mot hverandre - ellers, hva er vitsen?

Utifra siste punkt ovenfor, valgte vi derfor å legge til et leaderboard, hvor du kan sammenligne din score med de andre som deltar. På denne måten øker engasjementsnivået og det blir bedre interaksjon mellom deltakerne. Dessuten kan du velge å gjemme hele leaderboardet dersom du ikke liker å konkurrere.

[theasofiefv]

«Future Live Events»

Resultat - Del 1

«Lobby» er et virtuelt spillerom hvor du kan bevege deg rundt, chatte med publikummet, invitere venner og ha det gøy mens du venter på at konserten skal starte opp.

Mitt konsept starter i det du velger billett og setter deg ned for å vente på at konserten skal starte. Du får opp en skjerm med en nedtelling til konserten, som samtidig forteller deg at du kan gå inn til Lobbyen (forutsatt at det er en under en halvtime til konserten starter). Dersom du trykker på informasjonstegnet ved siden av kommer du til en tutorial som tar deg gjennom hovedfunksjonene.

Når du trykker på «Go to Lobby» blir du vist en animasjon av avataren din som faller inn i en pikselert verden. Avataren din i dette spillet er basert på profilen du får når du oppretter en bruker hos VIERLIVE, men du kan selv velge å endre på hvordan den ser ut senere.

Etter dette er du inni Lobbyen. Her rakk jeg ikke gjøre ferdig alle funksjonene, men det er tenkt at du kan gå rundt på en plattform, se andre profiler, sende de melding gjennom chat og trykke på artisten(e) som står øverst i midten, for mer info.

Når tiden er inne for at konserten skal starte opp, blir skjermen mørkere mens det kommer opp en nedtelling på 5 sekunder som tikker ned til null. Så «fader» skjermen ut til svart og tar deg til konserten.

På denne måten kan man få en smak av det sosiale og stemningen som oppstår før en konsert, selv om man følger med digitalt. Du kan bli kjent med nye folk blant publikummet eller invitere egne venner. Det finnes knapper som gir deg tydelig og oversiktlig informasjon om konserten, hvilke sanger som spilles av og når. Du kan også lære mer om artisten ved å trykke på deres profil. Ved å lage en mer «abstrakt» tolkning av konsertplassen, er det mer rom til kreativitet og til å skape nye minner og opplevelser, og det føles ikke som en billig erstatning for en virkelig opplevelse, men heller som noe nytt og morsomt.

Prototype:

https://www.figma.com/proto/lBAQa1G0AglIyfzwRk8jge/Lobby---Smarttelefon?page-id=0%3A1&node-id=1%3A2&viewport=244%2C48%2C0.25&scaling=scale-down&starting-point-node-id=1%3A2&show-proto-sidebar=1

Figma

Created with Figma

[theasofiefv]

«Future Live Events»

Prosess - Del 1

I den første, selvstendige delen av prosjektet, skulle vi velge et utgangspunkt for et digitalt event og utforske mulighetene før, underveis og etter et online event.

Etter min idémyldring, valgte jeg å ta utgangspunktet i mulighetsrommet som fantes imens/i det en konsert startet, hvor mye av det sosiale forsvant. Jeg valgte også å ta utgangspunkt i konserter.

Nøkkelfunn fra min research var:

-Online events er flust i muligheter for organisering og tydeliggjøring av ellers tilfeldig plassert informasjon

-Som konsekvens av pandemien har folk innsett mulighetsrommet som finnes i å gjøre enkelte ting online

-Hvis man skal ta et event og gjøre det digitalt, er det viktig å ikke prøver å etterstrebe virkeligheten, men heller prøve å skape en unik opplevelse som tilføyer en ny opplevelse til brukeren. Hvis ikke kan dette nemlig ofte omvendt effekt og knekke sammen i prosessen, ettersom «det digitale aldri kan erstatte en ekte, fysisk opplevelse».

Fra en liten spørreundersøkelse fikk jeg også en indikasjon på at folk flest ønsket å se, chatte og bevege seg rundt med venner online i et tenkt scenario. De ville også se hvem som deltok av artister og arrangører og ønsket tydelig informasjon om konserten.

Etter dette begynte jeg fortløpende å utvikle en testbar prototype i Figma. Ettersom jeg valgte en litt stor oppgave, å lage et slags spill inni en app, så hadde jeg mye arbeid foran meg, og fikk ikke like mye tid til brukertesting som jeg ønsket. Det var lett å fokusere litt for lenge på detaljer. Det skulle jeg gjerne gjort annerledes om jeg skulle gjort det om igjen.

[theasofiefv]

Micro:bit Instrument

Resultat

I denne oppgaven fikk vi en innføring i grunnleggende koding og skulle gjennom dette vi lage musikk ved bruk av micro:bits.

Oppgaven varte i 3 dager, så vi måtte ganske raskt velge et utgangspunkt med en passende vanskelighetsgrad. Gruppa mi valgte å gå videre med et DJ-board med plater og «record scrathing» som hovedteknikk.

Den største utfordringen ble med andre ord for oss å lage en god rytme som endret seg basert på rotasjonen av platen/recorden. Dette utforsket vi på flere måter, gjennom mangfoldige iterasjoner, mer spesifikt kompassretning og akselerasjon. Det var i seg selv ikke så utfordrende, problemet var kun at det ikke hørtes bra ut. Vi prøvde oss fram med melodier og forskjellige toner, og prøvde å legge disse inn som en variabel/konstant i kompassretningen.

Etter dette gjensto enklere problemer som radiosignal, kobling til høyttaler og annen koding.

Selv om ferdig produkt ikke var helt som ønsket, hadde vi en bratt læringskurve og fikk gjort mye eksperimentering på kort tid. Ellers er jeg veldig fornøyd med utseende på ferdig produkt ved demonstrasjonen.

Til ettertanke burde vi spurt/lært mer av andre medstudenter, siden det fantes grupper som hadde tilsvarende problemer med bedre løsninger.

(m/Mia Aurora og Tiril)

[theasofiefv]

Prosessbilder

Micro:bit Instrument

[theasofiefv]

Game controller

Resultat

I denne oppgaven skulle vi ta utgangspunkt i et eksisterende pc-spill, og lage en tilhørende spillkonsoll som skulle gjøre spillet til en mer sosial aktivitet.

«Bubble Struggle» er et spill fra 1996, som går ut på å skyte bobler som spretter rundt i rommet, samtidig som man prøver å slå sin egen rekord. Spillet hadde både en single-player og en multiplayer-funksjon; hvor vi valgte å ta utgangspunkt i den sistnevnte.

Til tross for enkelt design er det er vanskelig spill å slå og har en høy frustrasjonsfaktor. Vi utforsket med å gjøre spillet vanskeligere ved å gjøre pedalene omvendt, men dette ble for tungvint og fjernet mestringsfølelsen - som er viktig for at det skulle oppleves som en gøy og attraktiv opplevelse.

Vi startet tidlig med å utforske forskjellig elektronikk, IPAC, pedaler, knapper og ble godt kjent med aluminiumsfolien.

Vi beholdt fargene fra spillet, og gikk videre med pistoler med et enkelt design slik at vi kunne jobbe mest med funksjonen. Kontrollene var: venstre, høyre og skyt. Det ble en fysisk konsoll som krevde bevegelse. Vippebrett ble også vurdert, men det tok for mye fokus vekk fra spillet. Vi vurderte også flere alternativer til å skyte, men det var stort flertall for våpen blant deltakerne.

Til ettertanke kunne vi eksperimentert mer med arbeidsoppgaver til spillerne, som gjorde spillet mer morsomt og krevde mer samarbeid. Men med begrenset tidsrom synes jeg vi lyktes i å skape et morsomt og vanskelig spill som trigget konkurranseinstinktet.

(m/ Bjørn, Hala, Ingvild og Eivind)

[theasofiefv]

Game controller

Prosessbilder

[theasofiefv]

What is a switch?

Resultat

I denne øvelsen skulle vi utforske måter å designe switcher/skruknapper for å komme kjapt inn i den elektriske verden på en leken måte og utforskende måte.

[theasofiefv]

Observation and comics

Prosessbilder