Design This

Connect — Concept — Create


Connect

Idea dump

Door een overgrote hoeveelheid aan interesses heb ik alles opgeschreven in deze mindmap. Ik heb deze vervolgens voorgelegd voor feedback en kwam tot de conclusie dat de banen-“tinder” het leukste idee was.

Ik wil dan niet gelijk de makkelijke weg kiezen en enkel een app maken maar dit mogelijk samenvoegen met iBeacons en er een soort speurtocht van maken. Mijn aanname is dat mensen die zonder werk zitten het moeilijk vinden een reden te hebben om het huis uit te komen, met de mogelijkheid een baan te vinden is deze motivatie veel groter.

Uiteraard moet er meer onderzoek naar gedaan worden maar ik ben benieuwd naar wat ik uitvind

Hier heb ik een kleine brainstorm gedaan over dingen die mij leuk leken om te doen.

Change of plans

Het probleem van de banen-“tinder” was dat ik uiteindelijk een app zou gaan ontwikkelen, wat ik voor een Design This opdracht niet uitdagend genoeg vond en daarnaast lijkt het me niet iets waarmee ik het vak ga halen. Daarnaast heb ik nagedacht over wat mijn inspiratiebronnen zijn. Als ik kijk naar hoe ik aan ideeen kom is dit vaak doordat ik enthousiast word over iets.

Tijdens Design Psychology mochten we even spelen met de Leap motion, dit is een apparaatje wat simpel gezegd je handen scant en deze vervolgens weergeeft op je scherm. Met je handen kun je bijna alles wat je normaal kunt en dus zou je digitale dingen kunnen vastpakken.

Dit was zo’n typisch moment waarop ik enthousiast werd. Ik moest en zou er meer van weten en ben dus ook onmiddelijk me gaan verdiepen in de developer community van Leap. Ik keek een beetje door de verschillende posts en kwam tot de conclusie dat dit best iets is wat ik zou kunnen.

Conclusie: Ik ga met de Leap aan de slag, ik heb momenteel nog geen idee wat ik er uiteindelijk mee wil gaan doen maar ik houd het idee van vorig jaar (op een leuke manier kinderen dmv een spel zinnen leren ontleden) in mijn achterhoofd omdat dit concept met de Leap te realiseren is en zelfs nog leuker wordt dan met een iPad of smartphone (mijn originele plan)

Strak design en werkt best wel lekker. Handigheid in het bewegen moet ik zelf nog even onder de knie krijgen maar het is erg mooi “speelgoed”

Onderzoek

Aan de slag dan maar he, ik heb alle documentatie van Leap doorgenomen en een aantal apps zelf uitgeprobeerd om te kijken hoe dit alles in zijn werk gaat. Ik wil sowieso een aantal testjes gaan doen om te kijken of ik zelf dingen kan bouwen zonder me echt al vast te pinnen op een concept.

Developerkit geinstalleerd

En dan zie je opeens je eigen hand in beeld, werkt erg mooi.

Test nummer 1

Allereerst is het wel handig om te begrijpen wat er allemaal waargenomen word door de Leap en hoe dit eruit ziet. Daarom was de eerste test om alle gegevens op te halen die de Leap uitzend en dit weer te geven op het scherm. De code werd gelukkig simpel uitgelegd en met een beetje kijken en puzzelen is het niet moeilijk te begrijpen.

Het ziet er misschien een beetje chaotisch uit maar in principe werkt het heel simpel.

Als je naar het filmpje hierboven kijkt word je waarschijnlijk in eerst instantie een beetje afgeschrokken door alle bewegende nummertjes. Maar wat deze nummertjes betekenen is juist weer heel gaaf. Allereerst leest de Leap het aantal handen en vingers, welke hand dit is en de stabiliteit, de grip en grijpactiviteit van deze hand. Maar daar houd het niet op. De Leap ziet namelijk ook iedere vinger apart en kan zelfs je verschillende gewrichten in je vingers herkennen!

Test nummer 2

Nu wordt het echt leuk, voor de tweede test heb ik namelijk een eerste app gemaakt. Dit houd in dat ik een afbeelding van een kat over het scherm heb laten bewegen door de manier waarop ik mijn handen beweeg. Dus als ik heen en weer beweeg gaat de kat heen en weer en als ik mijn hand roteer dan doet dit blije koppie braaf met me mee. Dit was wel even een uitdaging omdat je goed moet letten op verschillende nieuwe dingen. Javascript zelf is niet nieuw voor me maar omdat ze er een eigen draai aan hebben gegeven werkt niet alles hetzelfde.

Hoe leuk is dit! Hij doet gewoon alles na wat ik aangeef met mijn handen.

De volgende uitdaging, ondanks dat ik niet zeker ben van of dit mogelijk is, is dat ik twee verschillende figuren op het scherm toon en dat ieder figuur maar door een specifieke hand kan worden bestuurd. Als ik dit voor elkaar krijg zou dit namelijk betekenen dat ik een multiplayer app zou kunnen maken en ik houd graag al mijn opties open op dit moment.

Test nummer 3

De multiplayer game ontwikkelen zou best wel eens realiteit kunnen worden. Hieronder namelijk het filmpje van 2 handen en dus ook 2 katten. Nu is de volgende stap om deze specifiek te koppelen aan de linker- of rechterhand.

Het kan zelfs met nog meer handen. 4 handen word een beetje een probleem omdat het oppervlakte te klein is maar 3 is gelukt.

3 katten!!!!

Test nummer 4

Om een multiplayer game te kunnen maken had ik bedacht dat het verschil zien tussen links en rechts wel fijn zou zijn. Op die manier zou de ene speler met links en de andere speler met rechts kunnen spelen. Omdat de Leap zelf aangeeft welke hand hij detecteerd was het even een uitdaging om uit te vinden hoe ik dit omdraai. In plaats van “hand.type =” te vragen moest het “if hand.type =” worden. Dit is uiteindelijk gelukt.

Hier is te zien hoe ik in de basis pagina heb gezorgd dat de handen worden herkend door het apparaat.
Hier is te zien hoe ik het probleem heb opgelost, ik moet eerlijk bekennen dat ik het nog niet geheel onder de knie heb maar stapje voor stapje kom ik meer bij mijn doel.

Concept

Multiplayer game

Omdat ik de uitdaging van een multiplayergame wel heel gaaf vind, en dit nog niet zo vaak is gedaan als een singleplayergame voor de Leap heb ik dit gekozen als concept. Doordat ik een spel moet bedenken die aan een aantal eisen voldoet zijn de ideeën wel een beetje gelimiteerd maar dat maakt ze niet slechter.

Inspiratie

Toen het CMI nog gevestigd was op de Pieter de Hooghweg hadden we een groot scherm in de “aula”, op dit scherm kwam op een gegeven moment een spelletje, een soort “pong” waarbij je met het scherm van je smartphone je eigen badje kon besturen. Dit spel was ontzettend populair onder zowel studenten als docenten. Dit is de inspiratie voor mijn eigen spel. Ik wil een pong-spel maken waar je hand in principe het badje is.

Uitwerking

Nu ik wat testjes heb gedaan merk ik dat het programmeren voor de Leap Motion een grotere uitdaging is dan ik dacht, en dan heb ik nog maar alleen code, dan ziet het er nog niet eens mooi uit. Voor de code ga ik dus lessen meevolgen van Stelian (Informatica-docent) en hoop via deze lessen hulp te krijgen van mensen die meer ervaring hebben en aan wie ik mijn vragen kan stellen.

Voor de vormgeving moet ik nog even uitzoeken wat het beste werkt en hier mee aan de slag. Via de website ben ik er achter dat Unity 3D een mooie manier van werken is. Hier ga ik dus mee aan de slag. Echter lijkt dit een nieuwe manier zijn voor het ontwikkelen van de apps, omdat ik natuurlijk met javascript aan de slag ben gegaan moet ik even uitzoeken in hoeverre dit te combineren is.

Create

Pingpong

Allereerst ging ik op zoek naar het spel pingpong voor javascript, deze heb ik gevonden en ben ik gaan testen. Ik heb geprobeerd hem te kantelen, nu speelt het spel namelijk van onder naar boven en ik zou hem graag van links naar rechts hebben (Als er twee handen boven elkaar hangen is het namelijk moeilijk te onderscheiden).

Dit spel wordt gespeeld tegen de computer, de onderste peddel wordt bestuurd door de linker en rechter toets en de bovenste peddel is de computer die op basis van de locatie van het balletje beweegt met een bepaalde snelheid.

Omdat ik vaak te veel hooi op mijn vork neem heb ik ervoor gekozen mijn stappen wat kleiner te maken. Nu is mijn eerste doel om het spel hierboven te laten besturen door de handen ipv de linker en rechter toets. Mijn gedachtes hierbij is het volgende:

  • Als het spel met de linkerhand wordt gespeeld ligt het bereik tussen het uiterste punt dat de pink kan halen (links) tot het uiterste punt dat de duim kan halen (rechts)
  • Als het spel met de rechterhand wordt gespeeld ligt het bereik tussen het uiterste punt dat de duimkan halen (links) tot het uiterste punt dat de links kan halen (rechts)
  • Omdat deze twee waardes verschillen is het belangrijk dat er onderscheid wordt gemaakt tussen de linker en de rechterhand die de Leap herkend.

Aanpassen

Ik denk dat ik hier de aanpassing in ga moeten doen, waar het spel nu gecontroleerd wordt door de knoppen (keyup, keydown) moet uiteindelijk de leap geintegreerd worden.

Toekomstdroom

Ik zou het heel gaaf vinden als ik extra functies kan toevoegen, echter is dit niet mijn eerste doel. Wel is het interessant om in het achterhoofd te houden. De volgende toevoegingen zou ik graag maken:

  • Kantelende peddels.
  • Multiplayer (Hiervoor moet ik eerst het speelveld kantelen en vervolgens de computer vervangen voor een ander type hand, speler 1 zou links zijn en speler 2 rechts)

Verandering

Omdat het ombouwen van de bovenstaande pong nogal moeilijk bleek te zijn besloot ik over te stappen naar een andere. Deze versie is klassieker en ligt al op zijn kant waardoor het makkelijker (ahum) zou moeten zijn om de controllers met de Leap te koppelen.

Deze game heeft al de optie voor een single of multiplayer (Zo af en toe moet je het wiel niet opnieuw willen uitvinden) Nu is het enige nog om de controllers te veranderen naar het op en neer bewegen van de handen boven de Leap

Dit betekent uiteraard wel dat in plaats van links en rechts de Leap hoog en laag zal moeten meten.

Les Stelian

Omdat ik wel wat extra hulp kan gebruiken volg ik op dinsdag 9 juni de les van Stelian mee. Ik hoop hieruit wat meer informatie te krijgen van mensen die in groepjes met de Leap aan de slag zijn geweest de afgelopen periode. Omdat ik alleen veel langer doe over kleine dingen die in teams veel sneller worden opgelost heb ik stille hoop dat de problemen die ik tegen ben gekomen al ontdekt zijn door de teams die in deze projectles zitten.

Show your support

Clapping shows how much you appreciated Elga de Klerk’s story.