 Thank you so much for the introduction. Thank you so much for having me. This conference has been so awesome. And I am intimidated as hell to be talking in front of all of you brilliant people. This is actually the first time I've ever spoken at a conference, too. So thanks for having me. Last talk. Here we go. All right. So designing virtual reality data visualizations. What's VR? Cool. Some people know. Some people don't. Some people have some big ideas. Here's a 2D line chart. Here's a 3D line chart. Here's VR or what you would see if you are wearing a VR headset. So it's 3D in stereoscopic. So you get a different image in each eye. And you get sort of an added dimension to play with, which is time or motion if you choose to use it, and you have a thing on your head that looks like maybe one of these things, the Oculus or Google Cardboard, or Samsung Gear, or there's a lot of them coming out now. If you don't have a Google Cardboard, you can go get it. I would really suggest it. It's really easy to get. I just looked it up before this talk. It's $5. Boom. Just go get it. That's like sears.com or something. Yeah, so if you've got $5, I would highly recommend getting a Google Cardboard. All right, so why is everyone so into VR? What's the big deal? It hacks your brain. It's really nuts. If you haven't tried it before, try it out. Your mind is really tricked into believing that you are present in the world that's rendered in VR, not necessarily not in the world that you're currently in, but you really just get the sense. If here's just a couple of images that are examples, this is one where you put your arms out in front of you, and you've got this thing on your head, and there's a spider on the table, and man, it really feels like that spider is about to crawl on your arm. You get chills up your arm. It's crazy. This is a visualization someone made of the walk on the tightrope between the twin towers, and you look down, and you're like, oh, man, that really feels scary. So it hacks your brain in a way that I've never experienced before. It really creates a depth of emotion that I think people are really excited about. Cool, so there's two kinds of VR content being made right now, and there's AR, which is augmented reality, which is a whole other ballgame that I'm not even going to get into. But right now, the two kinds of VR content are 360 degree video and rendered 3D graphics. So 360 degree video, there's been a lot of journalism done, and I come from a journalism background, so I'm going to be focusing on journalistic applications. Harvest of Change was one of the first groundbreaking ones that displaced an amazing piece by New York Times Magazine. The Wall Street Journal put out a really cool piece that follows with Ballerina as she's preparing behind the scenes at Lincoln Center, and all these are really rad. And then there's 3D rendered. How do you make it happen? For the 360 video stuff, you need a whole crap ton of GoPros, or there's new fancy 360 degree cameras. And for the rendered stuff, which I'm going to be talking more about, there's 3D rendering software, people use Unity, and there's 3JS, which is really cool. It's a JavaScript library. It's open source. It's a really new medium. In January 2012, Nani de la Pena debuted Hungren Los Angeles, which was I think actually a rendered rather than live action or 360 video one. The Google Cardboard only came out in July 2014. And now it's now. It really hasn't been that long since July 2014. That was really a turning point in accessibility for VR content. If you make something, now people can actually see it. So it really hasn't been that long since that happened. So this is a data-vis conference, right? There's been a lot of VR journalism made that's 360 video-based. More and more is coming out. It's really cool. What I want to see more of is taking advantage of the experiential quality of VR to tell data-driven stories. That sounds hard. Someone that has been doing it is this guy, Brian. He works at POV, or had worked at POV. Now he's got his own company data-vised. Let me see if I can make this video thing happen. Can I do it? No. Was it? Sick. OK. Let's try it again. All right, cool. So I'll let this play through. He created this visualization. And you're walking through a city. This is census data, I think. And this goes for a while. And then the next part of this video that you see, I don't know if Kino will let me fast forward. So I'm just going to keep talking. The next part of this video that you'll see is, here we go, crime rates. So the areas in red have a higher crime rate than the surrounding area. And that, I think, really takes advantage of your sort of visceral experience moving through this space. It's primal. We understand that red is like bad, or danger, or poison, or don't eat that frog, whatever. So as you're sort of walking through it, flying through it, and you go into a red zone, you really feel it's dangerous. So I think that's a really successful use of it. So here at the Wall Street Journal, not here in New York, we made this thing, the VR NASDAQ, that was pegged to when the NASDAQ broke its previous record, its previous high from the year 2000, which was just about one year ago, almost one year exactly ago. And I'll show you a demo of that. We made it in WebGL. So I'm not going to show the stereoscopic version, because you guys are, you can do that in your Google Cardboards, which I'm assuming you're all going to go and get from sears.com for $5, and look at it that way. But right now, I'm just going to show it to you in the sort of 3D mode in IMAX. So you start pre-2000, boom. You can see sort of elements going by on the left hand side, like a timeline. And the path that you're walking on is mapped to the inverse of the price-to-earnings ratio. So as you are approaching the top, that path is getting really, really skinny. And you can look down and see, man, that is a skinny path. That is dangerous. And that happened really fast. This is really steep. And we're about to go down. And here we go. Oh, oh, no. Oh, no. I've never had to narrate this in real time before. Utilized a sort of color understanding as well with the areas of red being times of recession. So now we'll just sort of climb slowly back to the present day or one year ago when the NASDAQ broke. It's previous high. And as you're sort of coming back up, you really get the sense that it's a pretty steady climb. That path that you're walking on is nice and wide, looks pretty stable. It feels very different than it felt when you were at the part of the visualization from the year 2000 in that giant bubble. And that feeling, that different feeling, was, I think we utilized that to communicate. Although the numbers were the same, the price of the NASDAQ index was the same. Oh, and there's rocket sip mode. The price was the same, but the feeling is different. And that's it. Plus rocket chips, because why not? Cool. So like I said, we used D3 and 3JS, their open source libraries. Roger Kenny, my partner in creating this interactive, is the man. I was involved very much in conceptual and design. And our art director, Jessica Yu, was very involved in art direction. The majority of the code base was written by Roger. And he rules. And you can rule too, because he wrote a tutorial, a brief tutorial for a setup that you can go find here. And I have a resources slide at the end that I'll just leave up. And I'm happy to share with whoever. It's actually pretty easy. There's a lot of open source tools to making sort of basic VR environments. Yeah, depending on time, I was going to do a demo of that. Yeah, maybe after, after. OK. So why do we do it? I already talked about that part. Why do we do it in the browser? So anybody can look at it in your Google Cardboards that you're getting for $5. We wouldn't need to go through a third party player for a 360 degree video. And we wouldn't need to do video stitching for all those crap ton of GoPros, which results in a huge giant video file. And it's really tedious. So browser-based, 3JS, VR, awesome. So much fun. Some challenges. I have a lot of challenges. I'll start with user interaction. How do you design an interface when your user has no hands? They're like over here. The hands are over here holding the thing on their head. How are you supposed to navigate an interface like that? There are really two inputs that we can take advantage of, which is a focal point in the very center. And there's one button on the side of most headsets. So we use that to do stop and go and the focal point to look at a button. But of course, you can't just have people pressing buttons willy-nilly, like whatever they look at. So then we had a countdown. We had this sort of stoplight metaphor of red, yellow, green. And then Google and a lot of stuff they make. They have this concentric circle thing that grows and lets you know that you've selected a button or action item. There might be more possibilities that open up when people start using controllers in conjunction with the headsets. But right now I work at Wall Street Journal. I'm thinking about making stuff that's kind of as accessible as possible to the most number of people. So I'm not thinking about the problem too much of how to make the most complicated intricate to navigate visualization interactive NVR because it's not my problem to solve right now. But maybe it's yours. That sounded so corny. First talk ever. Here we go. Here we go. Information density has to be kind of low because it's hard to read NVR. And that's a real thing. The paragraphs we had on those sort of bulletin things were kind of about as much as we could get in there. And there was a timeline element, but it was still kind of really hard to focus on all the stuff that was going by. It's hard to read text in VR. Ice Drain and Nazia are real things. And in the VR NASDAQ, we kind of had to find this balance between. We had weekly data for the NASDAQ prices, but we didn't want users, like the camera, to bounce along each of those data points because then you'd get really nauseous. So we had to find something in between, like staying accurate to the data and making something that wouldn't make people feel sick. So Roger worked really hard on this algorithm that sort of followed the curve of it without being too bumpy. But I'm still not sure if we got that quite right or not. And it was difficult. There's also perception difficulties with 3D charts. As Kennedy mentioned, I definitely made this slide today. We're not that good at reading 3D charts. So it might not be an ideal medium for a lot of data visualizations. And gimmickiness, people are gonna yell at you on Twitter, like if you make some VR chart thing just for the sake of making a VR chart thing and then put it out there, people are gonna be like, I don't know, why'd you do that? And then you're gonna be like, stop, I'm sad, don't make fun of me, I'm like in second grade in my head or something, okay. Yeah, people don't generally have the cardboards yet either and that's a thing, or they don't have headsets yet. So designing for the lowest common VR denominator is a thing and then having a fallback, like what I showed you, which you can just look at in the browser if you go to wsda.com slash 3D NASDAQ, that's what you see in your browser. Yeah, one more difficult thing is cross-device compatibility and different viewing options and I'm gonna show you a flow chart, ready? This was a giant pain in the butt. Yeah, so VR chart versus line chart, you get a third dimension, you get a time dimension, you get the magic brain hacking feeling, but you lose interactions, you lose ease of navigation, you lose accessibility, you lose legibility, you lose perceptional accuracy and you have a heightened risk of people making fun of you on Twitter. So what is it good for? Like why do that? Because that seems like a whole lot of bad things. It's good for potentially multi-dimensional data that you wouldn't be able to explore otherwise and it's good for using people's feelings about space to communicate stuff about data sets. What does that mean, but how? I don't know is the answer. Here's some things that I thought of that people have feelings about that have to do with space. Fear of heights. It's hard to walk on small things. Red maybe means danger. Moving quickly feels different than moving slowly. Flying is cool, pointy things might hurt, large things might be heavy, et cetera, et cetera, forever. Why use this stuff to visualize data? How best to use it? I don't know. We made VR NASDAQ like a year ago and I haven't thought of another great reason to do it again yet, which is why I haven't. So you guys think of something, think of something awesome. And then tell me before you tell anyone else about it. Is VR a fad is something people are thinking but I think hell nah or at least I've had the Kool-Aid. One of the reasons being kids dig it. Kids really like VR and in 10 years, people who are kids now are gonna be like the main consumer of tech content. So kids dig it, so we all kinda gotta get on board I think. So now's the part where I show you some of the coolest shit I have ever seen. Ready? Maybe it's easier to do this in the browser. How do I do that? Let's see. Coolest shit I've ever seen, time. Is that working? This is called the machine to be another. So these two people are wearing that and they are seeing the other person's body in their eyeballs and that is crazy. People talk a lot about empathy and empathy being the most important thing for journalism right now or being able to harvest empathy, make people feel something, make people understand the point of view of another person in the world or another group of people. That's why we tell stories, right? That's kind of it. So I think this is an incredible tool. Just an incredible tool to be able to do that. I'm so stoked, you can tell, I'm sure. This is Tilt Brush, which is for the HTC Vive, which I haven't gotten to try yet but I'm so looking forward to it. Homeboy is drawing in 3D and that is nuts. And then you can like go walk in the middle of your drawing, that's crazy. That's some of the coolest shit I've ever seen. This is Oculus Toy Box. That guy is like playing with another human being who's not in the physical space he's in but is in the virtual space that he's in and they're waving at each other. See, thumbs up, cool. That is some of the coolest shit I have ever seen, right? I mean, man, this is a Tribeca Film Institute interactive section website and they have a lot more really awesome stuff. So that is a really good resource for checking out more of the coolest shit you have ever seen in your life. I think I might be ready to go back. And we're back, I said that. Oh, I'm done, cool. Thank you, here's a bunch of resources and if you feel like watching my grandparents try VR for the first time, I can show y'all that. Okay, let's just bring that up here. This is DataVite, whoa, where's my mouse? Okay, here are my grandparents. Oh, I don't know if I have any sound, I don't know. That's all right, I'll just skip to the good part. That's Roger. That's okay, you don't really need the sound. How about I just leave this up and let you guys ask questions? Does that sound good? Too mesmerized, bye, bye. I haven't mentioned to them that I was gonna show you guys this, so I hope they're not mad. For the video later, Mima, Vipa, I'm sorry. Okay, I'm gonna skip to the part where it's actually on their face. Look at that, look at my grandma. Okay, we need the sound. They are watching the VR Nasdaq. What, can I just put this mic over there? Yeah, let's do that. Okay. To review, and after three seconds, it'll bring you to the beginning of the chart to walk on it. I see, can you see a little, like a little circle on top of the start button? No. So look down a little bit, so that it's right in the center of your vision. Yeah, physically move the whole phone down a little bit. I see it kind of double. 34, 36, 37. Okay, now shall I start to move? Are you at the beginning? I have no idea. Here, let me, oh yeah, we're still at start ride. See, if you hold it in the center, you see that little bubble that turned green? Did you see it? No, maybe I need my glasses. I'm seeing it double. Oh, maybe you do need your glasses. Should it be double? Oh, we got to face this way. Oh, you started the ride. Maybe it was an accident. Oh, oh, that's marvelous. Oh. Thank you. We probably have time for one or two questions. Yeah, for sure. Totally. We'll also get everybody's slides and link to them. Well, there's two parts to that, I guess. Why the NASDAQ? Because the NASDAQ was looming close to breaking its record of its previous high from the 2000 bubble. Why in 3D? I was like, Roger started working on this in VR and was like super stoked on it. And I was away and I came back and I went to a meeting with him and it hadn't taken its roller coaster form yet. It was like a floating pipe in space. And I don't know why, but I was like, I just want to climb on that thing. And then I was like, oh, well, if we make it like you're walking on it, then there's a reason to do it in VR. So we should totally do it that way. And then everyone else was like, oh yeah, cool. Let's do it that way. So that's kind of how that went. Is that funny? That's dope. Good to know. I have not messed around with that. Yeah, cool. It's Photosphere, you said? Photo, Street View. Oh, cool. That's really cool. Kennedy. Mima and Bipa. What do you call your grandparents? Mimi. Cool. That's a good note to add on. Thank you so much. Thank you.