>> tomas reimers: cool. so hi, everyone. my name's tomas. i'm a tf and this is armaghan behlum: armi. nice to see you guys. tomas reimers: cool. so we're going to be talkingabout leap motion today. so leap motion is areally cool product that
lets you interact with acomputer in a different way. so the whole idea behindleap motion is that you can use your hands tointeract with the computer. so right here i have something set up. i'll talk about it in a bit. but the basic version is you cansee that i have my hands in front of my computer and when i move them,you get the analog on the computer and you can analyze this. you can make gestures.
you can use your hands tointeract with the computer in new and interesting way. >> well, i actually firstwant to pass off to armi to show you some cool demos of whatsome people have done with this. and then we'll talk about howyou actually code with this. armaghan behlum: yeah. hello. so as we saw, littledata here, but let's see what some people have done with this.
so let me just open up this example. and then, so, for example, you can seemy hand analog there, but now this time some people using unity havedecided to put a little more skin and stuff around the hand. so i can, let's go with this one,sure, have my hands interacting. and you can probably imagine acouple of other cool useful things that you can do with this. so this is at least one example. and then let's jump out of this.
>> and then another cool oneis, let's go with this one. plasmo ball. again, we wouldn't necessarilyexpect this level of complexity from a final project for cs50. this is just to show yousome of the, give you guys a little inspiration for whatyou guys can do with leap motion. so for example here's a coolphysics example, which there we go. has both of my hands so now youhave this little plasma ball. and the ball is reacting to the physicsof me moving my hand around the ball.
now this is all though using unity,using kind of tools and frameworks that we haven't taughtyou guys in class, but as you can see some prettycool run throughs with that. >> but one thing that you guys can dostarting off right now with leap motion is work in javascript. leap motion has a javascript api thatyou guys can use and we highly, highly recommend that you guys buildyour projects using that. so with that, let mepass it back off to tomas to talk about leapmotion and javascript.
or do you want to showthem the visualizer first? >> armaghan behlum: oh yes. yes. let's talk more about that visualizer. >> tomas reimers: so on a most basiclevel, when you first get to leap motion you're going to have this box. here, want me to take control? >> armaghan behlum: yeah, go for it. >> tomas reimers: so when youfirst get to leap motion
it has a device whichlooks something like this. you plug it into your computer,install the necessary drivers, and then it will basically be set up. so the easiest way to sortof deal with leap motion is open up this program it installscalled the leap motion visualizer. and the visualizer is literallywhat i'm showing here. it allows you to see theskeletal outline of your hands. and what the leap motionis interpreting them as. so the leap motion uses the camerato sort of look at your hands
and then it tries to guess what thebasic skeletal composition that you see on the screen is. and that's what it shows you. armaghan behlum: everysingle little point and thing that you see there isdata that's available to you guys as well to use. so you see that it'scapturing that tomas has five fingers, each ofthose different fingers are also available for you as datapoints to use in whatever application
that you might want. if you want to see ifsomebody's doing a thumbs up you can see if their fingersare curled and whether they're thumb finger is pointingupwards, or where their wrist or palm isand that type of stuff. so you can see some gestures itunderstands better than others. remember, that it is looking at yourhand from at a camera from the bottom, so when you have your hands likethis it understands them fully, but once you start to try and do athumbs up, sometimes it reads it,
sometimes it can guess, but honestlythe camera just can't see the thumb. so it's not reallysure what's happening. just some limitations to keep in mindwhen you're developing with this. >> anyway, so going back to this. the visualizer actuallyhas a lot of useful tools. so the leap motion isprogrammed in such a way that they don't expect you tointeract with that image data. they don't reallyexpect you to understand what's happening behind the scenes.
what they do is exposea bunch of apis for you such that you caninteract with this data directly without understandingwhat's going on under the hood. >> so if we hit h here in the visualizeryou'll see a lot of options. the important one here thoughis if you hit o and then hit h, you'll see that itlets you draw gestures. so a gesture, you'll seeit draws an arrow across. a gesture is one of the ways which leapmotion sort of lets you get at the data without having to process it.
so rather than me needing to figureout, oh, the hand was moving, even if i have point access, theapi will sort of just tell me, hey, they made this gesture. so you can make basic arrow gestures. you can make circle gestures. you can make tapping gestures. and you can make key press gestures. yeah. and that kind of stuff.
so now that we've sort ofseen what leap motion can do, you can see it can read awhole bunch of gestures. i think i'm going topass it back to armi and he's going to talk about howyou get at these with javascript, how you even begin a project with this. and then we'll talk about somecool places you can go with that. sounds good. so yeah, the very first thing wewill want you to do of course, is after you get the leap motion is togo to leapmotion.com, set up, install
the drivers and stuff. after doing that you can gomake sure that it's connected. if you see in your little tray theleap motion icon and it's green, then you know you're all set. and of course check out exactly whattomas just showed you with the gestures and doing the screen taps, andkey taps, and that type of stuff. >> after that though we,once again, like i said, we have access to all of thesethings in javascript as well. the ideal set up thatwe would recommend you
guys is to go into yourvhost directory, local host, public in your cs50 appliance. and when you go there what you'llsee is a index dot html file. now that index dothtml file or index dot php file, whichever isfine, what you can then do is go to your main operating system. and if you go to the ip addressthat's listed in the bottom right corner of your appliance right here,as you can see, then what happens is you go to the page that'sreferenced by that index dot html file.
so all the code that you might put inthere gets sent and is usable here. >> tomas reimers: so it's alsoimportant just for reference that if you guys actually knowhow to set up a server yourself, or you want to put this on the worldwideweb, you're welcome to do whatever. remember that these arejust javascript files and all the leap processingis done on the client. so it doesn't really matterwhere your server lives so long as the computeryou're viewing the website on has leap motion installed.
armaghan behlum: absolutely. like tomas said, yeah,whatever works for you guys. this is just one of our recommendations. now to start using leapmotion what you would do is you would import thejavascript file from leap motion. and then from there whatyou can do is, right now i just have this paragraphtag set up with an id of text. things that we would recommendare setting controller options for leap motion with theenable gestures to be true.
so by default thosegestures that we showed you guys, the circle, and thekey tap, and the swipes, those aren't shown toyou guys by default. but we highly recommend using thoseso you're not reinventing the wheel. enable those to true, passing thosecontroller options to leap dot loop and you're all set to go. because then you just havedefined a anonymous function that will take in aframe from leap motion and that frame has all theinformation that you're going to need.
>> tomas reimers: so just torecap, you have one object. you have this functioncalled leap dot loop. and you call it with two arguments. you call it with one,the controller options. and there are a lot ofoptions you can put in there. the one we're going toemphasize is enable gestures. and if you set it equal to true thenyou can get access at this gestures that we showed you in the visualizer. >> and then the second argument is afunction, it's kind of like a call back
which will be called everytime every frame of leap, so every time leap registers thatyour hand move, it has a new frame. and it calls this function with oneargument, which is the frame object. and that frame object describesthe frame as leap sees it. armaghan behlum: exactly. so this contains all the usefulbits and pieces of information that we were talking about earlier. checking frame dot gesturesis a array of gestures that the leap motion caught yourhands doing in the last frame.
so for example, what we'redoing here is we're checking, hey, leap, in that last frame didyou catch any gestures that i did? and if so what we decide to dois iterate through those gestures and try and get some usefulinformation from them. each gesture has a uniqueid associated with it. they have types. you can look at which fingerswere involved in the gestures by checking out this pointable stuff. so if when you go through theleap motion javascript api stuff,
when they mention pointables,they're talking about these fingers. and then hands are, of course,the entire hand object. >> what else? you can check how longthe motion went on for and, yeah, all those useful things. so what i'm doing right nowhere is i logged the frame, and then i update my html to displayall of these bits of information from the frame. so let's check that out.
>> so here it is. here's the index dot html file. and as you just saw when i just movedmy hand leap caught a circle motion. so you can see me doing a circle overhere, updates with circle information. doing swipes, catches swipes. let's try a screen tab. there we go. screen tap and a key tap. so key taps also, by theway, are when you hit down.
so you can imaginemaybe playing a piano. >> and then screen taps arewhen you hit the screen. so you can imagine maybe you actuallyhave a touch screen in front of you and you're hitting the touchscreen in front of you. and then we can grab oneof these objects in here. so remember i said that i waspassing the frame into console log. and so we can check out all thebits and pieces of information that are available inthat frame as well to use. >> like i said earlier,pointables are the fingers.
at that moment we didn't have ourhands in front of the leap motion so it registered zero,but this is how you would start to find out maybehow many fingers are the screen. and that type of information. tomas reimers: and rememberingthis is just an object. so everything can be accessedsort of like a struct in c. you have the objectname dot the property name. and then within that you havearrays and you have other objects, but remember it's just an object.
there's nothing specialbecause we're using leap. cool. should we check out a coupleof javascript examples? >> tomas reimers: soquickly remember that we said that leap can actuallyrun on any website. leapjs is just served to a client. and so along as the client hasleap motion attached it will work. so leap motion has awebsite where people can share their examplesof things they've made.
so we're just going to gothrough a couple of them to see what's possible beforediving into more specifics about how it's possible. so armaghan behlum: let's see. tomas reimers: now it should be working. armaghan behlum: so nowbefore we saw an example using unity that rendered our handswith pretty impressive graphic skins, but now you can see you can do thesame thing inside a web browser.
this is all inside chromejust using javascript. and then the other nicething is if you want to know how they did this,the examples on javascript also include code options thatyou can check out and then see how this person was grabbinghands and codes and such. >> so that's all you can findat developer.leapmotion.com. you can go and check out javascriptexamples that they have there. so yeah. here are these, oops sorry.
let's try that again. oh. i have two right hands. >> tomas reimers: so and again,remember sometimes leap messes up. just give it a second. it's not perfect, but it's pretty good. armaghan behlum: oneother recommendation also is to not do it in direct sunlight. so the way leap motionworks is, actually
if i show the camera thisas well, infrared light. so it sends those out and thenreads them when they come back. so if you're trying todo it direct sunlight, for example, it's probablynot going to work, or it's going to requiresome calibration to do so. >> also another recommendation is toclear the space behind the leap and in front of leap. think of it as workinginside of a dome that's surrounding this leap motion object.
if there's stuff rightbehind it as well, that's also going to interferewith how the leap motion's trying to recognize your handand that type of stuff. >> so, for example, i think in thiscase it's my laptop actually that's kind of making the leap motion. yeah, there we go. so if i clear out my laptop frombehind it the hand show up pretty well. there's that. so what else did we show them.
tomas reimers: i thinknow would be the time to sort of dive into and let's justmake a demo totally from scratch. it's going to be really simple. basically what we're goingto try to do is make it so that when you swipe your hand, thebackground's going to start out as red, and when you swipe your hand, thebackground's going to turn green. ok? really simple. and it's basically justgoing to go through a lot
of the concepts behindleap so that we can get into this ideology of how leap worksand how we can build stuff with that. and then from there we'llprobably just show you the api docs and where youcan read more about this. and then we'll call it day. so do you want to code ordo you want me to code? well, i guess we can worktogether on this and try >> tomas reimers: so we'lldo some pair coding. armaghan behlum: there we go.
that's exactly what iwanted to check out. so for example in here, let's see. while we are iteratingthrough the gestures already, tomas reimers: want to makejust a completely new file? armaghan behlum: completely new file? yeah, sure. >> tomas reimers: yeah. >> armaghan behlum: so let's do that. >> tomas reimers: so we're goingto make a completely file.
we'll call it hand dot html. that's cool with me. so remember you do an html tag,then within that you have a head. that head has a title within it. so tab the other way. there you go. title, we'll call it leap example. yep. >> armaghan behlum: oops.
title. >> tomas reimers: yep. >> armaghan behlum: there we are. >> tomas reimers: andthen let's make a body. >> armaghan behlum: wait, let'salso make sure to import. tomas reimers: oh, of course. my bad. so always make sure you have the leapscript so that's a script given to you by leap motion which basicallyallows the web browser to connect
to the device on the user's computer. and then in this we alsoneed a body and let's just make the body say hi sothat we can show students how to connect to this newweb page that they made. armaghan behlum: sure. so let's just put another-- >> tomas reimers: hi, hello world. so a very basic example. really just a demo.
>> armaghan behlum: and then in here wecan go to, we called it hand dot html, right? and oh! so i wonder what's wrongwith this right now. let's add read permissionsto hand dot html. tomas reimers: do you wantto do it in the big terminal so that we can just show it on the-- >> armaghan behlum: yeah, that makes sense. all right.
so i just added thepermissions, but if we were to check out thepermissions before we would have seen that actually handdot html didn't have read permissions and therefore we couldn't render it. but now if we do so, we see ourlittle hello world right there. >> tomas reimers: so let's actually,as he was writing, hello world, i thought about a waywe could change this. let's make it say hello world, andthen when you wave, it says goodbye. right?
so hello, goodbye. >> armaghan behlum: sure. >> tomas reimers: that sounds pretty good. >> armaghan behlum: thatsounds good to me, too. >> tomas reimers: so if we'regoing to do that let's just think through the web page a little bit. we're going to need some scriptwhich basically registers that you waved and to a leap,a wave and a swipe, same thing. so we're going to need a script thatbasically registers for that swipe.
and another thing we'regoing to need is we're going to need someactual content to change. >> so as you remember, jqueryallows you to change content. so one thing we might want to includein this is the jquery library. and then to be able to select whatwe're actually going to change content, that's going to need an idor a class, or something that we can use to select it. so we'll just give it aquick id of change text. and then do you want to grab jquery?
armaghan behlum: so what's the firstthing on our to do list then now? tomas reimers: let's grab jquery? armaghan behlum: let'sgrab jquery, ok, cool. in that case, i'm goingto have to actually-- where would be thebest place to do that? >> tomas reimers: jquery, so if yougoogle jquery, hit jquery, the first armaghan behlum: very first one. tomas reimers: or download. it's fine.
hit download v1 and v2 on the left. so we're describing jquery fromonline like you've probably done. scroll down. up, up. >> armaghan behlum: oh, right here now? tomas reimers: or that. so jquery has a hosted versionwhich means that you don't actually need to download it,but you're more than welcome to download itand host it yourself.
armaghan behlum: cool. so now we have jquery. now what's next on our to do list. tomas reimers: awesome. so next what we needdo is we actually need to give p hello world an idso we can change it, right? so let's give an idea of,i don't know, change text? armaghan behlum: let's justdo it this way, i guess. tomas reimers: changetext, cool.
and now let's just refresh the page. make sure everything works. so back in the browser. always a good reminder thatwhen you're building a website, probably refresh every time you makeany somewhat significant change just because sometimes youaccidentally drop a tag, or you accidentally delete something,and then you break something small, but then when you make a bigger changeyou're like, why did this big change seemingly break the unrelated thing.
so it's always good to sort ofgo and do those sanity checks. >> anyway so now let's doone last sanity check, which is let's try to changetext without leap motion, without anything, juston the page load it'll change hello world togoodbye using jquery. so if you remember jquery exposesthis dollar sign function, which we can pass css selector to,namely hashtag change text, which selects the element withan id of change text. and then we're goingto call the method html
on the object it returns with theargument of a string goodbye, which will change the itemshtml to say goodbye. awesome. that seems pretty cool. and now when we refreshthe page we're going to see it instantly changes to goodbye, right? because it doesn't wait for anything. sort of as soon as that scriptruns it changes it to goodbye. >> so now let's wrap that in a function.
right. so we're going to wantto make a function. we'll call it goodbye. so function goodbye isgoing to take no arguments and it's not reallygoing to return anything. and it's just going todo that in javascript. excellent. so our function goodbye nowchanges the text to goodbye, right? so this gives us a wayto basically change
that text to goodbye wheneverwe called that function. so this is pretty cool. >> armaghan behlum: well, wecan also just make sure that now since we're not calling thefunction, if we refresh the page, notice it's not goingto change the text. >> tomas reimers: excellent. so now we're going to startto get into that leap stuff that we were talking about. so armi, do you want totake it from here or?
>> armaghan behlum: yeah. sure. i'm probably going to needto double check things, but for example rememberwe said we wanted to make sure in optionswe set enable gestures tomas reimers: good catch. armaghan behlum: to be true. and then we were recommendingthat you guys would run leap dot loop, whichas we said earlier,
has two options, a json object thatis the options for how you want to configure the leap motion towork, and then a function that's going to catch a frame as a callbackfunction like tomas was saying. and then edit what you wantto do with that function. >> so we pass in theoption and now we define a function that will take in a frame. and now we have to definewhat that function does. it's also for the sake of thefuture, do that to make sure. tomas reimers: excellent.
so now we have thisleap dot loop function call which basically says watch leapwith these options and every time something changes, call thisfunction frame with all of the data that you are aware of in frame. sounds pretty good. so now quick sanity check,which i always recommend, is in that just putconsole dot log frame. and then in chrome open itup and look at your console and play around with leap to see theframes being logged because that will
get you an idea of whatdata you have access to. and as always if you get confused,look up the api reference. and we'll include the linkfor that at the end of this. >> armaghan behlum: so werefresh the page and then we go and open up the console again. and now we notice that we'rehaving frames passed in, these little objects we saw earlier. these are our framesshowing up in the console. >> so now that we've grabbed theframes, as you might remember earlier
from the example that we had,if we check frame dot gestures we get the list of gestures thatthe frame most recently caught. we can check the length of that arrayto see if leap caught any gestures. so if that array isgreater than zero then we know that we have some stuff to do. >> so let's wrap that up in an if conditionand now in here what we know is we have seen a gesture, let's act on it. so now that we're in here wehave a gesture to check out. tomas reimers: well, the firstthing is it's not just one gesture,
it could be as many gestures. >> armaghan behlum: very true. tomas reimers: so perclassic c style here we'll probably want to use a for loop. armaghan behlum: here we are then. we decided to iteratethrough the gestures. and let's see. i plus, plus. and now if we maybe madejust a var gesture equals
frame dot gesturesbracket i, now we have gesture itself, which is just onesingle instance of a gesture object for us to work withinside of this for loop. tomas reimers: let's sanitycheck here again and just console dot log gesture to see what we get. >> armaghan behlum:console dot log gesture. okie dokie. and refresh one more time. >> tomas reimers: and let'stry making a gesture.
you'll see that a bunchof, when he swipes, you get a bunch of gestures in theconsole and if he tries to do a circle, it's just-- >> armaghan behlum: circlesare just really nice. >> tomas reimers: now there's a weird thinghere, which is he's doing one circle, but this is logging 80 gestures, right? that's a lot of gestures. so the first sort of thing torealize, and this can be confusing, is that a gestureisn't just logged once.
>> on every frame, right,so if i'm doing a circle leap will detect thisis a change, from this is a change, from this is a change. and it will log each one of those. but in each one of those,it's going to say, oh, there's a gesture currently in progress. so let me just say, hey, there's agesture and it's currently in progress. so what we don't want todo is say, oh, on every one of those gestures youwant to change text.
what we want to do is when that gesturestops, and we can check for that, then we want to change text. armaghan behlum: mhmm. so like tomas isexplaining these gestures might appear through multipleframes, but for example, when we were havingthat circle, we can see that the id for that onesingle circle that we might have been trying to completewas the same id throughout. and in fact, you can alsocheck out the status.
updated. >> and then this is probably thelast circle that, oh, well, ok. so sometimes it shows you astatus of stopping a gesture and it also shows you a statusof starting a new gesture when it recognizes for sure thatyou've started a new gesture. for example in this case. armaghan behlum: so yeah. and then, let's see. you can also noticethough we were making
a circle and gesturehas a field called type that tells us what kindof gesture that is. so that might be useful for usyou try and do what we're doing. tomas reimers: sotransitioning back to js, the first thing that occurs to mealso, just reading through this code is there's a small optimization,which is we actually don't need this if condition, right? because if frame dot gestures dotlength is zero, that for loop's not going to run anyway.
so we may as well just goahead and get rid of that. again, while you're writing codeit's important to go back and sort of refactor as you realize that youcould have done something better, or that there is another way to do that. so now we're just going to clean thisup quickly and also clean up your code. that's a big deal. >> armaghan behlum: goodstyle is very appreciated. >> tomas reimers: you canalways tell when someone has code where there used to be an ifcondition and then they removed it,
but they didn't uncomment it. it's very obvious andit kind of looks ugly. armaghan behlum: so what'snext on our to do list? tomas reimers: so now as we were saying,i guess the first thing we want to do is make sure that that gesture'sactually a swipe, right? >> tomas reimers: so if we're saying thatour goodbye is kind of like a swipe, we'll go with it's a swipe, thefirst thing we need to say is, hey, is the gesture type a swipe, right? not a circle or a top,but is it a swipe?
so the way we can do thatis we can say gesture dot type equal equal swipe as a string. >> armaghan behlum: [inaudible] gesturedot type equals equals swipe. there we are. >> tomas reimers: andthen the last question we want to see is gesture dotstate equal equal stop, right? so that's when thegesture's been stopped. i actually think for swipe, iknow this off the top of my head, but you're welcome tolook it up, when you
swipe every time it registers ituntil you stop is a start gesture. and then the last one'sjust a stop gesture. so there will only be one stopgesture, which is great for us. so what we can do is say if gesture dottype equal equal swipe and gesture dot status equal equalstop, then let's sanity check here console dot log gesture. >> so we'll go back here. we'll refresh the page. and now the only time something shouldbe console dot logged is when we swipe.
and we try to swipe and we see nothing. so this is actually a big issue. we're not seeing what we expected to. and debugging can be a big part of this. so the first thing we're goingto say is, ok, let's console dot log it if gesture dottype equal equal swipe. armaghan behlum: yeah, let's do that. tomas reimers: so we'regoing to go back to this. we'll refresh.
we'll swipe. and we're going to see a bunch of them. ok. so clearly the problem waswith our gesture dot status. so if we open up one of these we'lllook in the objects and we'll see, well, it's a stop, but, oh,it's called state, not status. so if we head back toour code we can say if gesture dot type equal equal swipeand gesture dot state equal equal stop, then we'll console dot log it.
and so refresh. we swipe. and we'll see that onevery swipe, we're only getting one, which is theend, which is great, right? that's what we want. >> armaghan behlum: yep. and we can also notice that the ids foreach of these gestures are separate. so as tomas was saying because we'recatching this one stop state that exists at the end of a swipe, we'regetting individual separate gestures
from leap motion. great. >> tomas reimers: let's go ahead andjust do the final thing, which is, >> armaghan behlum: goodbye. >> tomas reimers: awesome. and now let's check out our website. one >> armaghan behlum: second. we did, yeah, we did call it goodbye.
>> tomas reimers: no, goodbyeis a real function. let's do that. >> tomas reimers: and when wewave goodbye, it says goodbye. >> armaghan behlum: we have victory. >> tomas reimers: so pretty exciting stuff. hopefully you can build somethingelse, but you get the idea of, right? you can detect gestures. you can call functions. and from that that really gives yousome very fundamental building blocks
to say, oh, maybe when they swipe up,because you can also detect things like direction. i want them to do something. or when they swipe right, iwant them to do something. and we can start to getcreative with how exactly we're going to improve our websiteusing these swipe gestures or circle gestures, or tap gestures,either key taps or screen taps. and then other than that you'remore than welcome to play with the actual data,but if you want to do
that we would suggest you go to the docsbecause they're actually really good. so headed to the docs now. or do you want to talk about that? also one other tidbit of advice,do try and think of this in 3d. so actually let's pull up those gesturesone more time console dot log gesture and we do that. come back in and now let's try acouple of these, couple of those. >> if we go in and check outthese gestures as well as you can see thatthey're dimensionality
is in three directions, actually. so don't just limityourself to a 2d screen even though you mightbe on a 2d website. you can try and think how a usermight interact with the website in 3d. tomas reimers: in a 3d space. and yeah. so you get directions, velocities,all these cool bits of information. >> tomas reimers: and if you're notfamiliar with that, it goes x, y, and then z is this last dimension.
just something which you probably arefamiliar with if you've dealt with 3d coordinate planes before. if you haven't, it's the same as a 2done except there's a third dimension. we call it z. and everything, sort of likedirection, which is where it's going, position-- i think it might evenexpose acceleration, i'm not sure. >> armaghan behlum: yeah, i believe. it definitely has speed. i'm actually not 100%sure about acceleration.
>> tomas reimers: it may be an optionyou can pass on to something. so position and speed are exposedin these sort of three coordinates. so x, y, z or delta x, delta y, delta z. so now headed to the documentationit's developer.leapmotion.com and then you can click documentation. again, leap motion has all thesewonderful apis, one for javascript, one for c sharp and unity, one forc++, one for java, one for python, and one for objective c. i personallywould push you towards javascript or if you want to learn anew language, try python.
both of those languages i've worked withbefore and they're really easy to learn and you already know javascript, whichmakes it a really good contender. >> one word of cautionwhen you enter the docs. make sure you're on docs v2.0. because if you're onversion one, it won't work. also for the example gallery. we spent a good 30 minutestrying the debug our leap before we realized thatv1 doesn't work with v2. so just make sure you're on version two.
and then i'll let himshow your the docs. so here's the api overview and thensome bits and pieces of the information that we've already told you. nice little floatinghands above a leap motion. and a reminder to thinkabout space in 3d. one of the first objects to think aboutwith leap motion are hands, of course. we saw those recognizedby the visualizer. and then you might haveseen that it recognized part of the wrist and thearm associated with it.
tomas reimers: if you wantto pull up the visualizer. armaghan behlum: yeah,let's do that again. tomas reimers: you can see, alwaysjust a good reminder to sort of see, the visualizer tries to showall the data that leap sees. so you'll see that we havethese sort of four points by the wrist and then the actual wrist. and you also have this ball at the palm. all of these are pointsrecognize recognized by the leap. >> armaghan behlum: exactly.
and so with that hand objecteach frame has a hand array as well where you can also getthe left and the right hands. you can get whichdirection the hands are facing with the normaldirection of the palm, or as they call it the palm normal. what else do we have? we also, oops. let's try and scroll down this way. the arms, the fingers arerepresented by the finger
class, which is a pointable object. so like we were saying, we saw thatarray of pointables for each hand. those are the littlefingers to think about. so this is a good overview to gothrough to try and understand. tomas reimers: [inaudible]hand anatomy up there. armaghan behlum: yeah, exactly. there's a lot of raw data that theleap motion takes in interprets well for you, so it's a greatidea to go through here and try and figure out how leap hasalready figured things out for you
and so what information youhave available from there. and then from there i would recommendgoing into this left section over here, which goes, well actually no, those areactually just more api stuff about-- >> tomas reimers: the api reference at thebottom is usually a good place to go. you guys probably saw this whenwe did the google maps pset. but the reference reallyjust goes through all of the functions and parametersavailable in the object to you. for example, this is whati was looking for before. when we have a hand wecan go and figure out
how leap recommendsto us to find a hand. like i said earlier,we have a hands array. find out if we have hands andthen try and grab a single hand to interact with in that way. so that's what werecommend for you guys. the gestures and stuff as well. this api documentation is going tobe a fantastic tool for you guys. do you have any other recommendations? >> tomas reimers: i don't.
i think that's good for now. >> armaghan behlum: yeah,i think so as well. feel free to email us and getin touch about leap motion if you're having maybe any issuesor need any recommendations. and we can try and figure stuffout with you guys as well. thank you. >> tomas reimers: great.
0 Comment for "Futuristic Motorbike Design"