 Thank you very much. Well, it's really lovely to see so many people here, thanks very much for coming along. So this session is all about using 360 degree images and videos to create VR experiences for education. I say education, hi Graham, as in the school of education where I work. So my name is Hadrian Corthorn and I'm the learning technologist at the School of Education up here in the University of Sheffield. So who doesn't love a nice poll? So a quick poll here just to get a sense of where people are at. Have you created any VR or 360 content? Just pop something in the chat really. If you haven't, if you'd like to, if you're an absolute expert, if you want to learn any more just so we can get a sense of where people are at. Really? Okay, so we've got to know that brilliant. So I'm getting quite a few replies here. That's good. So I'm glad to see that we're not all experts here because I wasn't going to change my presentation for the experts. Okay, so we've got a really nice mix of people here and experiences of using 360 and VR. So let's crack on. So a bit of context really. So in the School of Education we had the opportunity to get some funding from the university's alumni fund. So I joined the School of Education in about 2017 and found that I had some really willing and interested academics. And I went to them and said, here's this thing, 360 or VR. We can take images. We can create immersive content. What can we do? What can we do in your kind of learning teaching? So we kind of put our heads together and decided we would really like to create a collection of interactive and multimedia VR spaces. So we put together a bid and we got some funding to purchase some equipment. So that was great. We didn't quite get to getting an actual platform or host. That was a little bit more tricky at the time. Actual equipment cameras and stuff were not really kind of prominent in the market. So that was quite easy. And I'll get on to what equipment we used and what platforms we've tried in a little bit. So this is kind of like roughly the structure of this webinar in not particularly this order. It might be a little bit muddled, but I want to kind of do a bit of kind of like a technical primer really about what the technology is. And there's a bit of practical stuff there. So get ready to do some coding. We'll have a look at the hardware you might use to make 360 media. Look at some of the software and workflows that I've used. I'll show you some of the projects. Talk about that in the pedagogy. And we'll look at where you can publish 360 VR spaces to. And hopefully, if I don't waffle on too much, we'll get to some discussions or questions at the end. So the technical primer, I guess, what are 360 images? Well, if you've been on Planet Earth on the internet and looked at Google Maps, Google Earth and Street View, you'll have been using 360 images all this time. So it's based on the technology that Google Street View uses. Google calls these photospheres or I like to call them bubble images because they are like a bubble within image inside them. And what I like about them is you can put them on the web and you can augment them with other stuff. So, for example, in the Street View here, this is one that I've made many years ago. It's augmented with a bit of a kind of navigation thing here. There's a little maffy thing here. And yes, there's a closed button there. So it's got things in it that you can interact with and that's quite nice. Getting 360-degree images, I've opted for the easy way. I'm just buying a 360 camera and this is the one that we've got. It's an Insta360 camera and I see in the chat that a few people have been using those. Generally, these kind of cameras are two, basically two cameras stuck together back to back with a 180-degree fisheye lens on each side. And then you take a picture and it stitches two images together. Anybody who's ever done maths knows that 2x180 is 360. So you get a 360 image out of that. And what you get out of that generally are equirectangular images. Now let's explain what equirectangular images are in a bit. If you don't want to bother with one of these, if you just want to have a try, then smartphones or iPads are perfectly capable of doing this kind of thing. If you're a bit of a DSLR buff and you've got skills and time, you can also do it with DSLRs where you take a bunch of photos from all around you and stitch it together in some kind of software. I haven't done that. I've opted for the easier kind of points and click option. So equirectangular images, we've all seen them. This is what's usually wrapped around a globe and it's at the most common equirectangular image we've actually come across. So you can see if you imagine a globe, you peel that off and represent it in a rectangle. This is kind of what you get. So the tops and the bottoms are very, very distorted. So Antarctica isn't flat like that. It's actually more round and it's a bit distorted at the top there. Round the middle, it's a bit more sort of undistorted, I guess. So that's basically an equirectangular image. And to get that into some kind of 3D thing, sphere or bubble, what you do is just wrap that round a 3D thing, a 3D sphere. Easy, pretty easy. So you have a rectangle. You wrap it round the sphere and you get a globe. OK, and we're going to do that. So a real equirectangular image is one from a camera and you can see that it's very distorted at the top and bottom. And it looks like it's got two windows either side, but in actual fact that's the same window. So if you were to wrap that round the globe, the window would join round the back, really. There's a potential problem with that if you're wrapping it round the globe in that we don't look at the world as a globe. We're not a god looking on the globe. We're kind of inside that globe looking outward. So we have to wrap it round something else and we will find out very shortly what that is. So we've got a bit of a practical bit. I'll explain what we're doing. So feel free to do this or if you just want to watch, feel free to do that as well. So what we'll use for this is a really basic tool called A-Frame. It's a JavaScript web VR framework. You don't need to bother going to this URL. That's just for reference really. I've got some more links. So this framework will enable you to easily create VR environments in basically HTML. What we'll use is Glitch, which is an online coding tool. So we don't need anything else apart from a browser. Just to note really there are lots of other easy ways to do this. So it's not all about the coding, but it's a good introduction to understanding how the technology works. So it is just a bit of code really, and it's very easy to get something up and running with this A-Frame thing. Brilliant, you've developed something before and I'll look at that link. So I'll very briefly explain this. Perhaps people have used HTML before, but this little bit just loads the script in. So everything after that is A-Frame stuff. The thing we're concerned with is this thing here, which is a sphere, and that generates a sphere, and the sphere's got some properties in it. So this one here is the bit that we can use to wrap an image around that sphere. We've got various things for the size of the sphere and where it is in VR space and rotating it. There's another thing here, A-Sky, which might be the key to creating realistic spaces. So what that does, this code, is it just creates a sphere and wraps an image around it. What I'll do is I'll just talk through what to do. So what I'll do is I'll just pop that link in the chat first, so you can get that up and start working on it while I'm talking. So basically what I'd like you to do if you want to is go to that link and you'll see a button in the top right-hand corner, Remix to Edit. So you click that and that opens it up. I can see there's plenty of people on there already and it lets you edit that. So if you go along to the Assets bit in the sidebar, you can click on one of the other images, one of the real images, and then paste and actually copy the URL. And then if you go to Line 11, which is the SRC bit, and then in between the speech marks, just paste that in. And what you'll see is a little bit of magic there. So what I'm going to do is I'm going to flick from my presentation and go on to Screen. And I'll share my screen and quickly go through that. OK, so we've got this code here, so I'm going to click Remix to Edit and choose the ones with tractors in. There we go. Give that a moment to wake up. OK, so I'm going over to Assets. So I've uploaded some Assets, so I'm going to choose the school here. I'm going to click Copy and then to Index HTML and paste over the URL that's within the speech marks under Source. Voila, we've got something highly unrealistic there. So what we can do, rather than applying the image to the sphere, we can apply it to what's called the sky. So I'm going to take the whole SRC line here, and then rather than get my mouse, rather than the sky having a colour, I'm just going to paste that in. Sky is now the image. So that looks fairly nifty, that. OK, so we've got an image that's all around us. So we're basically within a bubble image. Yes, so we're inside that sphere. OK, so have you all managed to do that, those who've had a go? So with this A-frame thing, cool. It's easy to get something really basic up and running and then extending that beyond something basic requires a little bit more skills in coding. But you can insert text in there. You can insert planes. So not aeroplanes, but sort of like shapes, squares that you can put text on. You can import 3D models. You can add flat images. You can create image galleries. You can add video, all kinds of things within that and interactivity. But there's a bit of a learning curve to it. It's not all coding. So this example here, I'll quickly show you. It comes with a companion app that's called an inspector or something, and it enables you to edit things in a more of a visual way. OK, so that's the practical bit. So I'm going to get back to my presentation, just bear with. OK, so hope that's kind of giving you a little introduction to the kind of basis of this technology. A lot of it's done in the web and it uses 3D technology within a web browser. So in terms of myself, I want to kind of just kind of describe what we've done. So I'll give you a brief outline of my journey with 360. Have a look at the current equipment and the kinds of things that I do and have done. And if you're just starting out and you don't want to spend a lot of money, I've got a few kind of tips of what you can do on a budget, how you can play with this stuff without spending any money. So my journey began back in about 2013. I bought myself a nice nifty Google phone and discovered that on there. The camera had a photosphere camera, which excited me greatly. So I went and took photos from pretty much most continents and worked them up on Google Maps. So I've got loads of stuff on Google Maps and it's all sorts of fun. So what you do with that camera is you stand there like an idiot and you swivel on a spot and take loads of pictures from all around you. And it stitches it all together and comes up with usually quite a nice photo. Then that kind of evolved to where we're at now in about 2017. Well, actually, previous to that, I worked in journalism studies, helping students make multimedia. And I was trying to get them to explore using 360 within storytelling. Academics thought it was a bit of a fad, really. So I left and joined the School of Education, not because they thought it was a fad, I just found it to change. So we had some great academics. I couldn't have done this without the academics. So backing me and having the kind of lots of ideas. So we got the funding. We got three of these Insta360 cameras with these kind of nice tripods. We got this weird looking microphone here, a Zoom H3 VR ambisonic recorder. I haven't really done much with that, to be honest. And then we've got a bunch of VR headsets. Ten, but there's 12 in my cupboard. So I think they'll be breeding in the cupboard. The workflow that I kind of go through after kind of working with the academics, is that what we want to do. We do the photography and filming. So I've got a slide on each one of these, but this is the kind of the basic workflow. So you do your photography or filming, you prepare and convert your files, work out where you want to store them. You might do some image editing or fixing or sweetening. And if you've got videos, you need to kind of just be aware of the limitations and issues, but you can edit them and they are quite powerful. So let's go through that workflow. So a lot of photography and filming. I don't know if I've coined this phrase, but I think I invented it yesterday. The photographer's dilemma, so how not to be in a shot. So with the 360 camera, you're taking a picture of everything all around you, so you don't really want to be in a shot. But we can see Beccy here hiding behind a tree. So this is what we have to do as 360 photographers. We have to use trees, buildings, sheds, bins, pillar boxes. You name it, I've hidden behind it. And for all Beccy there, I actually can't get behind the tree, because I'm already behind the tree. So that's a bit of a skill to learn, so how not to be in shot. Luckily we have, with most 360 cameras, it comes with a companion app that you can use on an iPad. So you can hide within Bluetooth distance and control the camera via the app. One thing that we've learned is to just remember about the point of focus, so the actual subject within the picture. Although you're taking a 360 image or video, you've still got to not think about what's the main thing within there, because what you've got with the 360 camera is you've got what's called a seam, and it's the bit where the two images are actually stitched together, and it can quite often be a little bit distorted or stitching errors can occur. So you don't want that right down the middle of somebody's face. So you need to point the camera roughly at the main thing within the actual scene that you're trying to capture. A little bit about file preparation. Your camera will come with a desktop app, and that's probably the best app to use. So mine is the Insta360, and it does stitching calibration. It'll fix any errors with stitching. It'll do a bit of colour correction, and it'll output in various sizes. And it does some rudimentary video editing if you just want to trim clips. Think carefully about storage as well. That's a problem, because some of these things are quite huge. Images are usually quite small, but obviously if you've got a lot of images, it will mount up. But I've usually found that I can put images on a network and work off them fine. Videos though, they're actually huge. I've come back with 20 gigabyte videos. So you can't really put those on network storage and expect to work from them. So you have to use local storage sometimes. So they're the kind of issues we've got with storage. So you might want to think about editing images. So my favourite tool at the moment for editing images is actually Photoshop. So it's got some really good tools for editing 360 images. So the screenshot at the top here shows you how to get into the 360 viewer. Once you get into the 360 viewer, you can do all the things that you might do on normal images like you can clean things. You can remove things. I usually remove the tripod from the bottom of the picture. You can just select it and use the content and just delete it and it'll fill it in with whatever it needs to go in there. You can heal things. So if you've got any kind of glitches in your picture, you can kind of heal those. And just your colour corrections. If you just want to sweeten that image up, if it's looking a bit dreary, then you can just apply a colour correction. I found that Google Photos also does this. So just sort of images to Google Photos. It's 360 compatible and it's got some cool little filters that you can see here. Or just some basic brightness and contrast controls. And also other camera apps. So you can use the GoPro apps with any cameras of JPEGs that come off it. There's a Garmin one called Verb. And they'll pretty much do the same thing. You'll be able to kind of sweeten your images, do a bit of fixing. So they're the kind of general apps that you can use. So 360 videos. There are issues with them, but it's incredibly powerful and there's a bit of a testimonial from a student at the end which sort of demonstrates that. But issues we have are massive file sizes that need to be compressed. You might lose bit quality. It's more difficult to create slick experiences because of the file size and the resources needed. Some platforms need extra money. That's useful to know about again. Great. And some platforms just don't actually support 360 videos. One little tip I've got is to film from a static position. So avoid moving around because it can induce your users feeling like they want to be sick. Unless you're very, very experienced and there are a few tricks to avoid that, but place your camera in one place and just let the action unfold around it. Again, Adobe Premiere. That's what I've been using for editing videos, 360 videos. It's brilliant. It's slightly complicated to get it set up. But once it's set up, I hope it's got a bunch of dedicated VR plugins. They'll do things like MacGorsey and Blurz and various visual effects. You can insert 3D text within a space and graphics and you could put an idea of the little badge that goes at the bottom of the image. Final cut is compatible with DaVinci Resolve and I believe we've just had a few things on the chat that people with some suggestions as well. A few other notable software. I've said your camera is 360 out. That's great. The screen grab is the InstaOne Photoshop. I've mentioned Premiere After Effects. It does do 360, and it does some really good things with 360, but the workflow is awful. It does tracking and all that kind of cool stuff that After Effects can do, but it's a bit of an odd workflow. One I've come across recently is called Hugging, which is for stitching images together. Premier Plugging is tracking great. Hugging, if you want to do stuff with DSLR, I believe Hugging is one of the apps that you can use to stitch images together. I've used it just to change the like a wonky horizon when I've done some images and that works quite well. Again, it's got a pretty awful interface, so just be aware. Publishing, we've been through what I feel like is every possible platform. There are a bunch of all-in-one 360 platforms where you can drag and drop things in. You can add objects, and it's nice and easy. They're probably the ones that most people will go for. Things like Thing Link. Round Me, brilliant. Just keep adding these things, because these are just the ones that I know. If you've got any other suggestions, just pop them in the chat. That's really useful. Yeah, HP5, I've used that one. WonderV is one that we're looking at at the moment. That's very promising. I believe this does multi-user stuff. Graham knows a little bit more. My colleague Graham, who's in here. We can get students in, in groups, and they can chat, they can interact. I believe they can turn the audio on as well and chat, so verbally. If you just want the commander one where you do it yourself, grab yourself a bit of a web host in an eye frame that we did a little exercise earlier with, you'll need a web server, or you can actually do it on GitHub. That'll serve up these kinds of pages quite nicely. Or if you just want something really, really simple, Google photos, we've done a few little projects on photos where you just want the students to look at it, or Google Maps, you can upload your photos there, and that integrates with Street View as well. There's a little kind of web page that I've been looking at that's got a bit of a roundup of difference of free tools. If you want to have a look at immersiveweb.dev, that's quite an interesting page. If you're looking at doing this on a budget, if you're not sure whether you want to spend anything on it, then grab yourself an iPad or a decent phone and get the Street View app, and you can very quickly create 360 photos within a few minutes and get yourself a copy of an A-frame, and you can publish them very, very easily. Again, I've mentioned Google photos. That's a really good app. Facebook, I discovered that if you upload a 360 image to Facebook, it'll render it out as a 360-intracted image, so that's quite nice. Last bit, really, is to have a look at some of the examples and a bit of the pedagogy behind some of our 360 stuff. I've got a few examples that I'm going to go through. One of them is a virtual tour of an early years classroom. This one shows students the layout of a classroom and all the materials that the teachers decided to put within there. The 360 experience does it give students much more than just if you were to do this with 2D photographs and text explanations, what you might traditionally find in textbooks and things like that. They can look around the place. They can see the relationships between different objects. We've also enhanced that with text panels with questions to prompt thinking, reflection and discussion. We've got an example from the National Video Game Museum in Sheffield. We just did a really quick virtual tour of that. This just explores the role of video games in informal education. It's there just as a prompt for reflection on childhood, really. I've got a few examples of how we've used 360 video. Again, it's observing play. We've found that in education it's a really good tool for actually observing children playing in classrooms. A little bit more detail about these. I will put the links in the chat for these. I think this is this one. The broomhole at school tour. We did this on Thinglink. I think quite a few people have used it. Easy drag and drop editing. We can embed media, text, images, video, audio. We did all that. The free version is very good actually. I don't really see the point in actually buying it. It does everything that we needed it to. Some of the features you have to pay for. If you want a 360 video, you have to pay them a bit for that. This is what it looks like. We've got these various hotspots here that help the user navigate to different places within the space. I think I took over 100 pictures of the space. There's quite a lot of different scenes. We've got navigation around the space. We can look at different tables in detail. Then we've got hotspots for information and hotspots for media. The information panel looks like this. It's got a lot of picture in it. Then just a really simple question. Asking the students to have a little think about this space. Then the video one. We've embedded a 360 video within the 360 tour. It's the children playing on this particular table. National Video Game Museum. I haven't got a link for this because it's got student responses in it. We used Google Photos and created a gallery and shared that with students. We found that Google Photos supports 360 images and 360 videos. All we want them to do is have a discussion. This is when we were online as well. We're doing online teaching. They were commenting on the images. It's basic, but it's super simple to make and share. If you want something really rapid and you've got a bunch of 360 images, Google Photos is great. This is what it looks like. We've got a gallery of images. Then we've got some quite active chat. The children will do a starter question. The students will have a discussion about that. Using 360 videos. The top screenshot there is the one from the classroom in the previous tour example. We've used this in different situations. We're just getting students to watch it and reflect on that. They're observing the children playing. About a month ago we did the other example here. 360 videos observing creative play where the kids were playing with various items related to STEM education making things. We were observing with that. With this one we just popped it on Caltura, which is our video hosting platform, which supports 360 video and integrates with Blackboard. Popped it in the Blackboard course enabled commenting. There are student discussions around that video as well. Quite lively discussions as well. Here's a little testimonial from a student. If you don't want to read it all, it's basically saying that using 360 film was an awakening experience. Never before had the opportunity to engage with such an interactive thing. What's good about it is that the viewer or researchers, the power to assess what's going on all around them. From behind above and around and as a researcher and as a group of discussion. They were able to tap into deep level analysis and follow each child on their journey observing how they interacted with people, resources and provision. It's opened up lots of scope of discussion, which they wouldn't have been able to do without the views of the 360 camera. That's quite a good testimonial from a student. A little bit about the pedagogy. One thing that you hear quite a lot is, well it's not a replacement for the real thing, why do we want to do this? I don't think that diminishes the pedagogy at all. It's not a replacement for the real thing and you'd never claim it to be that, it's a thing in itself, it's powerful within itself. I think because it's interactive it helps engagement, so anything that's interactive I think is inherently engaging. The full 360 view, as the student said in that testimonial, the full 360 view of things that can see everything. It's not an editor view so it's not what your teacher wants you to see. You can understand the relationships and interactions between things, objects, people, people and objects. That's really powerful. Something that I've been fairly interested in, it's piqued my interest right from the start, is how it can be impactful on a psychological level. What are the processes that are going on with the new brain when you experience a VR thing, particularly when you put a headset on, but we're not just talking about headsets, it's about accessing it in lots of different ways, but there are theories about how mirror neurons fire, so when you're looking at these experiences of others, you can read a bit more about that on the Simpty website, there's a little link down there. Okay, that appears to the end. I seem to have throttled through that, so quicker than when I've practised it. Has anybody got any questions or thoughts? There's been a lot of stuff in the chat which I'll be interested to read. If you've got any questions, feel free to pop your hand up and you can turn your mic on if you want to chat. I think thanks for sharing stuff, that's really good. Alicia, you raise a really interesting question about what do you have to be mindful of from an accessibility point of view, accessibility is something that I'm really interested in, but with VR, it's really racked my brain because it's not completely accessible. Particularly with using headsets, if you go down that route, there's a lot of problems with people who actually can't handle it, so you have to provide alternative means for them to view this. That's why I really like doing things on the web where you can view it in a headset if you want to, but you can also view it within a browser and there's different levels of viewing it if you can't actually use a headset. Myself, I can have one for about five minutes if I feel sick, so I do have a bit of it to go. In terms of the actual material that you create as well, I'm not convinced that it's fully accessible because a lot of the methods for creating experiences is very visual, so you've got perhaps an image there and you've got text overlaid on it and I'm not quite sure how accessible that is, whether it's compatible with screen readers, that kind of thing, but the good thing is that it's a multimedia experience, so you can have these images, but you can also include sound in it, so you can have ambient sound, you can include narration and all those things that you might include in visual or video, some material. So I hope that's answered that one. Crikey, where's the questions? So Sarah, have you used any of the scenarios with the headsets? If so, what did that bring to the experience? So unfortunately with the headsets, we bought them kind of mid-semester and then we didn't get a chance to use them, we were going to use them and then we got locked down and then we haven't really used them, in a couple of weeks. Not with these scenarios that we've got. The kind of scenarios that we've actually built are linked on blackboards, so for students to have a look in their own time, whether students use the mobile phones or if they've got cardboard headsets, I'm not quite sure. In a way, the headsets are a bit of a nice thing to have, but that's not particularly our priority. We're doing different things with a headset. We're exploring XR applications and kind of how children learn with games and VR and that kind of thing. So yeah, I think a lot Sarah, the headsets are quite limiting in that you have to have one for a start. In terms of using them, I find them incredibly awkward. If you're trying to browse around the internet, it's a really kind of clunky experience and they're very difficult to set up. Hadrian, I think the last question. The recording will be shared shortly after the presentation. If you wanted to share the slides alongside them, could you forward those over to me? Sure, I am. If you're happy for me to now end the recording. Yeah, sure.