How to Run an Hour of Code with CodeHS - HS/MS (11/18)

[Music] all right I'm going to go ahead and get started here so yeah welcome everybody to today's webinar thank you for those of you that are attending live and for those of you that are watching back on the recording I'm glad you could make it so today's webinar is getting us ready for our Code season so it's coming up very soon the beginning of December so excited to introduce you know code HS what we have to offer in terms of hour of code and yeah what it's all about and how we can really get students excited with a program so yeah let's Jump Right In here so my name is TJ Dean I'm a professional development specialist here at cods before cods I was a high school math computer science teacher so taught a lot of different computer science courses helped run a schoolwide hour of code Initiative for a few years at one of the schools I taught at and it was such an exciting opportunity you know getting students interested in programming that had never written a line of code before and just being able to see that you know those light bulb moments and see students be able you know for them to recognize that they they can program and just how easy it it can be to get started and so it's it's a it's very exciting time of the year and so yeah looking forward to jumping into this webinar on the back end today I have one of my teammates Christopher he's going to be answering any questions that you may have in chat and also throw in some links in there so he did just provide you with the slides for today so thank you for throwing that in there Christopher so yeah we'll keep it rolling and jump right in so our agenda today we're going to cover a few main things so really like if this is your first time running an hour of code you know what is it so let's talk about hour of code we we'll get into just a slight bit of the history there and then choosing the right hour of code activity what is the right activity that makes sense for your students have your students programmed before have they never written a line of code we have a lot of different options and we'll provide you with those resources resources and share you know some recommendations that we have and then after that yeah we'll talk we'll really get into like okay now that we know which activity we're going to choose how do we actually Implement that in our classroom and I'll walk you through all of that today as well and then yeah after hour code you know there are other ways that you can engage students in programming and so I have a few different Outlets that I want to share with you and even though the the Q&A is listed there at the bottom you know if you have if you have any questions feel free to just throw those into chats you know we're more than happy to help answer that as we go or a Q&A and Christopher will be able to assist too all right so yeah the probably the the best way to ask questions is using the Q&A feature in Zoom so if you're not familiar with that feature it should be down down there in the bottom of your screen it's a great way to you know ask questions and get a response so yeah feel free to throw your questions in there and I'll pause periodically and ask Christopher if there's anything that's should be addressed to the the whole group as well all right so if you are not too familiar with codehs just want to talk about who we are as a company and yeah so Cod HS we are a comprehensive platform for teaching computer science we offer curriculum free curriculum from elementary school all the way through high school so we provide K through2 web-based computer science curriculum so that means that you do not need to download any additional software all you need is a web browser access to the internet and an account and you have access to our curriculum we also offer online and offline professional development so you are experiencing one of our free online professional developments right now and yeah just a full comprehensive software platform not only with curriculum but with teacher tools a full LMS integrated into that all right if you don't have a account yet on COD HS super easy to get signed up for one just head to codehs.com signup and you're going to just fill out a a quick form about yourself as a teacher and then you will have your teacher account and be able to start viewing our curriculum and adding students into your courses and sections and and specifically our code activities that we're going to talk about today so you can do that right now or if you want to wait and do that after completely fine all right so what is an hour of code so this could be new to you maybe you haven't done one in a while so I do want to talk about what an hour of code actually is so it's a nationwide initiative to introduce all of our students to one hour of computer science and really the goal is for students to one have fun get excited about computer science and really encourage them after that one hour to sign up for computer science courses and get excited about learning more about computer science and really just encouraging them that how easy it is to get started with computer science and so that's that's really what the whole initiative is about so the hour of code or you'll see this priated the csed week so again the goal exposure exposing more K through2 students to computer science with just an hour of programming tutorials to help increase access and Equity during csed week which is always the beginning of December this week for or this year it'll be the week of December 9th through the 15th and then fun little fact here why is it held in December in recognition of Grace hofer's birthday which is on December 9th so who is Grace Hopper if you're not familiar so Grace Hopper is one of the pioneering computer scientists and was the US Navy rear Admiral couple key contributions helped with the development of cobal one of the first first programming languages fun little fact great topper credited with the term debugging after removing an actual moth from a computer kind of gross but also very cool fun fact there and yeah her Legacy just her work inspires people especially girls to pursue technology and science so fun little thing to share with your students if they are unfamiliar about hour of code and CS Ed week so you have access to these slides great little contribution to add into your hour of code week okay so we have an idea of what hour of code is so let's talk about how we can select an hour of code so on COD HS we offer a lot of different hour of code activities and Christopher just put this into the chat codehs.com hocc and this is where I'll go there in just a moment where we are able to see all of the hour code tutorials that we have available so you can see just a few of them up here on the right so various ones where we are programming with Carol a dog and students are learning about JavaScript to react native mobile apps web design math specific ones coding and sports students learning about block blockchain technology generating art with code so there's a lot of different options and so if this is your first time doing it it can be a little overwhelming on which activity to actually choose and so in a moment we'll talk about how to guide you towards the right activity for your students I'm going to take a pause right now Christopher is there anything in the chat or Q&A that we want to talk [Music] about we had one participant raised their hand at the beginning but not sure that was on purpose that's been quiet since then okay all right I'm seeing a question com to the chat yeah we do have stuff for students that have a background Java and that actually will bring me to our next Point here so this document which Christopher will share into the chats and I will open this up as well so this document is a great reference so for answering that question students that have background Java where do we kind of how do we select which hour of code activity so this tutorial that we we've made kind of helps guide you through that so on the left hand side this First Column you will see grade levels so 6 to 8 9 to 10 11 to 12 and then the first row here you'll see as it goes from a lighter color to a darker shade of blue no coding experience and which activities would make sense based on having no coding experience so and separated by grade level all the way up to Advanced programming so students that have you know more experience with more advanced languages like Java a high school student you know depending on the grade level there thinking that if they have experience with Java you know that's a little bit more complex language so and in high school I would probably focus on these four areas here in the bottom right and what I would do too is you can even you know ask your students which activity might they want to explore and you could have you know students doing U multiple students doing different hour of code activities as well so yeah for your recommendation high school student with a background of java I would probably stick to this area here in the bottom right so intermediate to advance and then 9 through 12 so kind of perusing through that and choosing one that would make sense there so that's the first place I would start is determining okay like which if I'm not familiar with programming or my students are or you know whatever grade level kind of getting an idea of what hour of code tutorials to choose from this is a great reference to have this is something that I would that I would bookmark all right next thing I want to do is actually take a look at our hour of code page so there's there are two links there's the one that Christopher put in the chat the codehs.com hocc and there's if you actually type in codehs.com hourofcode it'll bring you the same same redirect to all of our resources there I I think hocc is a little bit easier to remember if you're you know trying to pull it up in a pinch whatever you don't have a bookmarked no worries so yeah let me pull that up right now so this link will bring you to all of our Cod HS hour code activities and the first thing that you'll notice at the top here is you have all these different tags whether you want to F filter to high school or to just Middle School if you want to look at specific block coding for all of you elementary teachers we do have some hour code activities in here as well or intermediate Advanced and so a lot of what we were kind of looking at right here is essentially kind of what's being filtered to there on our our code just main curriculum page here okay so now we we have we have our resources of okay where are all the hour of code tutorials housed maybe we've bookmarked that we have our guide on choosing the right tutorial now let's talk about okay I've picked the hour of code that I probably want to run with my students now how do I actually Implement that so let's talk about that so few different steps here first thing that you're going to want to do if you don't have a Cod HS account is that you would want to create that account so that first step creating Cod HS account so Cod hs.com signup teer if you already have an account you you're already ahead of the game selecting the hour code that you would like to use with your students and then checking out the lesson plan attached to that hour of code choice so if you decide you know hour of code programming with Carol the dog or really any other hour of code activity what you're going to see is that the on each of these tutorials there is a button that will take you right to the lesson plan which I'm going to dive into in more detail in just a moment ments and yeah once we've looked at the lesson plan we want to make sure that we're you know reading through that entire document looking at any you know discussion questions common problems and issues that students may have or questions that they may have are there any handouts that I need to print out in advance any sort of things like that reviewing Solutions printing out those answer keys if we want to have those as a reference that's always a great idea as well and then in terms of your students accessing these hour codes there's a couple of different ways of how you can do this if you decide students will have access will access the hour code activity by logging into codehs sorry we first want to decide if students will have access to the hour code activity by either logging in or logging out so students could access these hour codes with an account or without an accounts so if a student already has a Cod HS account created and maybe you've done a few different Cod HS courses or lessons or activities before students can log into their account you can create an hour of code section and then enroll your students in there or you could just assign the hour code activity from that main hour of code page here and that where that middle button is that assign button and you can assign this right into one of your actual courses as well if students are not logging into code HS that's okay if they don't have an account students can still complete the hour of code activity without having an account and I'm going to show you that in just a minute there's these direct links that will bring students right to those hour of code assignments so that's probably if you're looking if you only have you know 45 to 60 Minute time frame and you don't want to have to worry about students creating an account on the day of and just kind of navigating that process this is the easiest way to do it so they can they don't have to log in in order to do it the one cave out there is that because they are not logged in their progress is not going to be saved so once students exit out of the their web browser that activity is no longer saved none of their progress is there so my recommendation if you want students to be able to save their work if you want them to explore more computer science curriculum then maybe having them in advance create an account that could be something that you do maybe as a warm-up or a closure a brain break you know sometime before maybe Thanksgiving break or right after and so that students already have their accounts they're good to go so that way when you implement an hour of code activity you know students are able to log in quickly and they're able to access the hour code and save their work okay so I'm going to walk you through just a couple of things and dive more deeper into the lesson plans here so you know going back to step one we're on the hour of code main page I am trying to select the correct hour of code for my students my students let's say for example are middle school students and have never programmed before so maybe I want to select you know a beginner activity here and so there's a lot of different options for this one of my favorites is the graphics with Tracy the turtle so the first thing I'm going to do before I assign this out is I want to go through read the lesson plan understand what this lesson is all about so I'm going to go ahead and click the lesson plan here so right away this first page will be similar amongst the hour codes it's going to give you some general information about these hour of code activities so like I was mentioning before if students are accessing this hour of code without out logging to codehs accounts the program they write during each exercise will not save when they continue on to the a new exercise so they should be reminded to copy their code from each exercise to use in the following exercise or they will not have access to that once they continue on so that is the the one caveat it's easier to get started right away but you know reminding our students that their progress is not saving as they go from each activity to the next activity I think in the long run it makes a little bit more sense if you want students to have to save their work and to continue learning about computer science to have them create their free accounts there yeah and then so before the hour code so making sure student computers have upto-date browsers you know reading through the teacher notes which we're going to go through on this one downloading any of those notes or exercise Solutions having those on a clipboard that's something I would do if the content is new for me I would want to have those Solutions as a reference so if and when students have questions I'm not having to run back to my computer and check the solution I have it right there on a clipboard and I can help guide students right away and then also checking for any supplemental handouts so this particular activity the Tracy the turtle one has an addition worksheet here and so let's go ahead and take a look at that and so these correspond to some of the exercises in this hour of code so as a teacher if this if this hour of code is new to me I am going to spend some time going through the hour of code activity myself before I present it to my students and that includes you know going through these these handouts and determining you know do I have time to do this does this make sense for my Learners and is is something I want to additionally Implement during the hour of code so during the hour of code so really this this middle section here so there is a redirect for each hour of code activity and so you'll see that under the the during the hour of code where students can get directed right to the hour code activity so this is wonderful if students are not logged in you could you know simply put this up on your projector or on your your boards and so that students can just type in codehs.com hore and this one is Turtle for turtle graphics and this will bring up the hour of code this this particular hour of code so each of the tutorials will have their own redirect links there and then depending on you know your learners and classroom time really just giving students the opportunity to complete the hour of code at their own pace if you want them to work with a buddy and maybe do some pair programming or work in smaller groups I think that's fine as well but really just kind of giving them that opportunity to work through that activity at their own pace and so let's let's take a look at this trace of the turtle Graphics hour of code so you can see that this one will start off with a video as most of the hour of codes will start off with and maybe what you can do something I might recommend if you want to help like scaffold students progress and just kind of navigating and understanding the platform especially if this is their first time is maybe watching the video together as a entire class and then allowing students to to work at their own pace so you have the ability to watch the video here the video is housed on our Cod HS servers and then also on the on a YouTube server as well so depending on you know School access in terms of YouTube if YouTube is blocked you do have that access so just ensuring that students click the codehs version and they'll be able to see that video you also this is something I would point out if you either want to deliver this hour code yourself or you want students to reference these slides from the video you do have that ability up here there's a toggle between the video and the slides so if I click on the slides it'll pull those up and students have access to this too so they could use this and go back to the video slides as a reference as they're going through this particular hour code or any of the hour code activities and then what students will do is they'll just simply once they you know finish the video or you finish it together just bottom right clicking that continue button and what you'll notice in this next exercise which you can see the sequence of order here these are all the activities in this hour code and so students would just follow this sequentially so the next thing that we see is an example so this is an example from this particular hour code so after watching the video students would be familiar with this so they're they're provided with that sample code they can change the code they can run the code all they want and get start get familiar with some new python trace of the turtle commands couple of things I will also point out too in terms of if this is your first time working in our IDE so it's important to kind of point out a few different things here so one thing I'll point out here on the left is we do have a settings gear and so this is where students can and you as well can change you know font size if you need if you are presenting to your students but the font size was too small you can always increase the font size I would recommend just for this hour code to leave the editor as it is but you do have the option to choose between the ace editor and the Monaco editor I would simply stick with the oops the ace editor and you already see I changed the theme there which is students tend to like doing that but I like that the ace editor and if you're familiar with our platform before or not the ace editor allows you to collaborate with your students in various capacities in different curriculums in your in your courses so yeah I would just leave that by default and then in terms of the console size things like that you have the ability to adjust those settings as well the main area here this is your your IDE and this is where students would are going to be doing most of putting or inputting in most of their work in the top here you have three different buttons the next one is going to just save your progress as is and just move students to the next item in this lesson the fork button what that does is it will make a copy of the code already there and it will put it into your sandbox and that's if you are logged in and then the save button just saves your work over here on the right so we have a few different options so our output window we can run our work we can clear that there's also a docs Tab and I think this is a super super important one to to point out so any of the turtle graphic commands so this is essentially like an online textbook for students based on Turtle Graphics so sometimes I will recommend students to you know open that up in a new tab so students can you know have you know a little bit larger view of the turtle commands and they can you know explore a little bit more if they're more Curious maybe they finish early you know encouraging students to try to implement some new code and see what that does into your programs all right couple other things I want to point out with the lesson plans here you know we also implement or input different discussion questions so you know if time allows at the end of the period facilitate a discussion around hour of code so some suggest questions that you can ask students you know specifically if this is maybe their first time programming you know before today what did you think about programming or coding what was your favorite part of this hour code just kind of giving you some ideas to help start some discussions in your classes we have a an area here for just hour of code tips so if students get stuck or have questions it's okay if you don't have the answer answer U my first my first year teaching computer science you know it was it was a lot of programming was was very new to me and I made that you know apparent to students that hey you know we're learning I'm learning this as you're going as well and you know if I don't have the answer we'll figure it out together so kind of just like promoting that in your class and just being okay with not always having being the center of knowledge there you'll be surprised with how many students may have that answer as well and and can help out too the second page really gets into more of the details for the specific hour of code tutorial so the second page this is your teacher guide so this is where you'll start to see things like your objective the link to that particular hour of code is there as well any discussion questions and then my favorite is all of the solutions so this again if this is something new to you programming or these hour of code activities you know this is something I would print these out and that's what I was talking about having on my clipboard so if I go back to this hour of code the items that have the pencil icons down here these are these These are the exercises that students will be completing and so those ones are what are referenced here for the solution so anything with the pencil icon that is an exercise activity type and you'll see for each of the solutions it'll give us a description the motivation that goes along with it and then the solution code referenced in there as well so anytime there's a pencil icon you'll see that another thing I'll point out is for each of those exercises what you'll see are any kind of common questions that students may have for their first time experiencing that exercise or that programming language so these are also a great reference for you to look at ahead of time to help maybe spearhead any foreseen questions that students may have or concerns and so kind of for you to understand what the questions may be and how to answer those questions I'll pause I'll pause again for a minute Christopher any any questions or things that should address no we had one person ask if we had any sort of competition framework built into our platform and unfortunately we don't but I will absolutely pass on that recommendation to our development team but otherwise that is it awesome thank you okay a couple more things and then I think we may end up wrapping up early here so just a couple considerations with implementing these hour codes and just from reminders for your students so each of these hour codes will have either one or multiple videos and so it's it's highly recommended that if students are working at their own pace that you remind students to bring in headphones or if you are able to get a class set of headphones somehow some way whether you're visiting a computer lab something like that but ensuring that students have you know access to a computer and then also a set of headphones some of our our codes will require a little bit more additional support beforehand so for example we have an hour of code on react native mobile apps and so there is an app that students would need to download in order to interact successfully with the hour of code so making sure that we're just you know reading through the lesson plans essentially and making sure that if there are any additional handouts or pieces of software that need to be downloaded that we are making sure that that's something that students would be able to do and that we could Implement those successfully we also have a nice little template of some slides that you can incorporate as a little bit of an intro here and so Christopher put those into the chat and so you have you know access to these Google Slides where you can make a copy of them and then adjust as you see fit but there's a few things you know you know why learn how to code some good discussion questions in here what can coding be used for you know where can we see programming kind of getting into careers and discussions and things like that so feel free to peruse you know these slides use all of them use a couple of them modify them you know do whatever you want to do with these slides to incorporate them into your into your hour of code activities and again I know I've mentioned this before but highly recommend as you do with every lesson you know making sure that you're going through the actual tutorial before yourself especially if it's very new to you or the you know the if you've done a hour of codes before but maybe you haven't used code HS before you know highly recommend that you go through it yourself maybe taking some notes making sure that you understand what you're presenting to your students and that way if you have questions U or you get stuck you probably know where your students would get stuck or if they have questions themselves again reviewing those lesson plans any of the teacher guides any of the handouts discussion questions you know there's a lot of recommendations in those lesson plans you don't have to use every single item you don't have to ask every single discussion question or print out every hand out you know you're the expert in your classroom you know your students so to decide what's best for your students what's going to engage them the most where are they going to have the most fun and what is going to excite them most about computer science okay a couple of last items here so to some just like tips and tricks with running hour of codes so allowing students to work at their own pace super important especially you know this is meant to be more of a fun engaging activity to get students excited about computer science give yourself at least 45 minutes to complete each of these tutorials more time especially if we have you know younger Learners or Learners that maybe aren't often on a computer and they don't often use that in your class and that's not part part of your classroom management flow so just make making sure that we give our give ourselves at least 45 I would say at least maybe 60 Minutes as well asking problem solving questions encouraging students to collaborate with their peers so if if and when they get stuck you know working with their peers kind of instead of just asking you the center of knowledge to be able to answer those questions you know have them work together ask questions and persevere through problem solving with their peers rather than just asking the teacher for support taking moments to you know pause for full class either clarifications if you're noticing that multiple students are getting stuck or just having maybe issues navigating to the correct area you know it's okay to pause and making sure that everybody's on the same page and then also for those discussions so pulling out some of the discussion questions that you think are most appropriate and you know allow allowing students that opportunity to think and respond and reflect one one last thing I'll share too is what I like to do when I ran my hour of codes is allowing you know about five minutes at the end of class where having students leave up their final result of their hour code activity and doing a gallery walk with students I always love doing this giving my students a couple of sticky notes and you know having them provide a couple bits of positive feedback to various students Arrow code creations and that was always a fun way to kind of wrap up the day students get back to the desk they have all these wonderful sticky notes about their hour of code activity all right so that is everything with hour of code activities but what about Beyond this day if this is only a one- day thing in your school or in your classroom where can we go from here so what are some other ways to engage students and we have a few different resources in here we have a you know if if you want to do multiple hour of code activities throughout the school year you know it's not just limited to this this week but we have a lot of different options to go through here so and these are all linked at the bottom let me find the I'll just do this and Christopher is putting them into the chat as well so thank you Christopher so yes all of those resources so choosing the right tutorial our coding the wild blog is a great kind of career reference where we have interviewed a a lot of Professionals in the computer science industry and learn about you know what their backgrounds are what are they currently doing and where did they how did they how did they get to that point and so there's some wonderful stories in there if students are interested in learning more about how to get engaged in a career in computer science so I would definitely take a look at that resource a lot of good stuff in there one other thing I will mention that's not on here too is our project guide so if you have a Cod HS account and your students do as well we have a whole area in our in our site of various projects so if once you have an account here under our curriculum area there's a project catalog and these can kind of act as like an hour of code where there are we have a lot of different resources in here and these can be anywhere from 1 hour to 3 hours they can be from easy medium or hard middle school high school we also have a lot of different different tags whether it's holiday themed autog graded apcsa Carol we've just added over 30 different AI projects as well and so these are could be fun little ways of engaging your students further Beyond these our code activities all right lastly just getting supports you know once you create your code HS accounts on that left hand side that I was just talking about we have a whole support area here and if I scroll down on my side navigation I have this support area where I can reference different knowledge-based articles so short little articles that explain further tools or curriculum within our sites and then the other one that I really like is our Live support so in the bottom right here if I open this I can talk with our support team Monday through Friday business hours you'll reach somebody from our team they are fantastic so if you have questions from anything of you know how do I set up my students accounts to which hour of code activity did TJ recommend I need some assistance with that can somebody share with me a document they'll be able to point you in the right direction setion all right so starting to wrap up here a couple other things in addition to our hour of code so we have a wonderful cohorts of certified Educators codhs so we encourage you to explore that and join our codhs certified educator group we also offer micro credentials for teachers and for students to test your for programming Knowledge from things of java to Python and cyber security so definitely explore those we have a very active educator Facebook group so if you're not a part of that encourage you to join share and learn more about Cod HS and what other teachers are doing on the site and then also our social media platform you know we're on X Instagram Tik Tok and we have a wonderful road trip going on right now so you can see where the code HS pink finan is I believe we are currently in Pennsylvania right now so yeah so take an take a follow with that and yeah thank you so much for joining us today if you have any feedback about this webinar and how we can improve these and make them even better this is something that Christopher and I like to review after and make sure that we are always improving our practices so thank you again for joining us today if you're watching this back thank you so much for taking a look at this hour of code webinar excited to get started with Computer Science Education week coming up in right after Thanksgiving and yeah thank you so much for joining if you want to learn more about Cod HS and bring this to your school you know please take a look at this link Cod hs.com / learn more we're happy to point you in the direction and talk with somebody from codhs to help you know roll out Cod HS in your classroom in your school or your District yes and the certificate of completion yes Christopher will share that one as well so if you want to receive a certificate of completion you will need to make sure that you are logged in if you you need to make sure that you have a code HS account in order for that to to work so thank you I will hang out for another minute or so Christopher any any lingering questions that need to be addressed no if you clicked on the survey link like immediately when it was put on you won't find this Workshop it's been updated so refresh it and you'll find how to run an hour of code on the drop down for which Workshop you attended thank you for the feedback Stacy we'll take a look at that and make sure any links that are not CL clickable are fixed there so thank you Stacy if you're logged into code HS and you click the attendance link it should just say thank you for attending and then you'll get a a certificate emailed to you in a day or two [Music]