Flipped learning update

It’s been going well.

As mentioned in my earlier post I tried creating a bunch of videos and got generally positive feedback. They were mostly created in response to tricky concepts I saw coming up, or when I identified tricky concepts during teaching. This was rewarding but ultimately unsustainable. Working just-in-time isn’t going to help long-term, the resources I’m creating aren’t really re-usable, and my goal is to explore the flipped classroom to use with our new timetable structure in 2019.

I decided to use a more structured approach to see if this I can make this more sustainable. I’m doing this post now because I’m just about to pass a pretty big milestone in relation to my goal, and I want to log my progress so far.

Structured approach

My Y12 programming unit seemed like the perfect opportunity to try something new. It’s a well-established unit and assessment, I know the material inside-out, and if this doesn’t work out I’ve got solid resources and knowledge to fall back on. Currently, I split the learning into six area of content:

sections

For each of these I have slideshows with detailed notes and explanations, and a range of exercises. I thought I’d set the goal to create an introductory video for each topic, but they would end up being super long. At a conference I went to recently (more below) they talked about the 1.5 minute per year level idea for maximum video length. That would mean 18 minutes as the maximum video length. Personally I’m not comfortable with that – there’s too much riding on each video. I’m trying a few video lengths, ranging from 6-10 minutes. I have some ideas for shorter videos later on, but that will be for very specific material.

So I decided to make multiple videos, focusing on one or two ideas each. This diagram shows my plan now:

sections-flipped

Progress

The students will watch the if videos tomorrow. Tomorrow is important because I won’t be there. If my videos are effective, they’ll get a lot done. If they aren’t… sorry reliever…

Also, I set the goal of gathering feedback from students about the videos at that point. So hopefully they are successful tomorrow. I’m aiming to survey for feedback on:

  • video effectiveness (do they learn, or do they find the teacher-led instruction better)
  • style/format (how I speak, screencasting code, notes)
  • technical (sound quality, prefer to watch videos in Google Classroom, Edpuzzle, Google Site, other)
  • anything else they think of

Alternative approach

So, this format seems like it will work, with positive outcomes. Teaching the intro lessons was much smoother than in the past, and much quicker. This seems to be because they were familiar with the concepts at the beginning of the teaching but the feedback will confirm or contradict this.

Another alternative format that might be of better use looking forward to the new timetable might be something like this:

section-complementary

Rather than having the videos as part of the linear progression of content (currently it is isn’t essential to watch the videos in order but it is probably detrimental not to) I could produce a series of content that is extra to the main progression. It would be supplementary/complementary and wouldn’t be necessary to complete. It would be useful for students wanting to practice or solidify concepts, for students to fill gaps when they miss class, for extension work.

My rules for videos, and some learnings

  • Creating them should be painless and versatile. Editing should be zero, or minimal. Screencast-o-matic is awesome so far.
  • Sound quality is important – students will be watching a lot. The laptop microphone is awful. I have a lapel mic, and a logitech headset with mic – both give very decent quality audio.
  • Hosting should be simple. Google classroom clutters quickly. Students don’t like our moodle. Edpuzzle is is useful but is yet another tool for students to remember. To avoid fragmentation and group all of my resources together I’ve created a google site (I swore I’d never again but the new sites is super simple and very slick). Videos are hosted on edpuzzle, slideshows are in google drive, both are quickly and easily embedded in the google site.
  • My videos are absolutely not exhaustive lectures of each topic, and don’t contain anything ‘critical’ that they won’t also get in class. They introduce some new concept(s) with simple examples. I try to put a challenging question or two in there as well. I ensure each video has closure – it doesn’t leave them confused about anything (more than you would expect, anyway).

Looped Conference

I attended a breakout session at the 2018 Looped conference on Flipped Classroom. The presenters told about their journeys so far, with some tips:

  • The one about length, mentioned above
  • Use edpuzzle.com (mentioned above). Edpuzzle is a flipped classroom tool for managing videos and tools. It gives some basic analytics (who’s watched, when did they watch, when did they last watch) and if you pay or jump through some hoops there are more advanced analytics.
  • Turn your webcam on, so your students can see you in the video. This one isn’t for me so far. I will try it soon and see what the students say. The idea is that your students connect with you, so seeing you is helpful. I see what they mean, but I’m happy to settle with just my voice for now.
  • Don’t make jokes. Yeah na that’s definitely not for me. I think my students would be totally confused if I went 5 minutes without a terrible joke.
  • Don’t let the students participate until they’ve watched. I don’t know where I stand on this just yet. Students will be watching in class (we have a no-homework policy, so I’m doing in-flip)

So I guess my next post will be about the feedback I get from students (from a formal survey, and anecdotal feedback I’ve begun receiving). It might also be about the plans for 2018. There’s been basically radio silence since the beginning of the year, which is alarming because it’s a massive change for both students and teachers. I’m exploring one promising idea, but apart from my Critical Friends group I’m operating in a silo so there really needs to be some information coming out soon.

Testing my coffee store assessment idea

Agenda for my code day

I finally found time to sit down and try out all the ideas floating around in my head for my Y13 web projects (and possibly other years as well). The goals for my day, in order:

  1. Create a simple responsive site using media queries – scale well on my phone, ipad mini, 1920×1080 laptop.
  2. Figure out how the hell bootstrap works and decide if its viable to use with students at short notice (i.e. this Tuesday)
  3. Put together a database for a school cafe (that only sells coffee, because what else do I need?) and build functionality to view and place orders.
  4. Implement some security (as required by the relevant Achievement Standard)
  5. Try out the google chart api to visualise some data from the database (requires php for a query then javascript for the chart)

Media queries

This went pretty well – the queries were straightforward to write and I experimented with additive/subtractive queries. I think the best thing to do there is build for the media you think your site will be used on, then use media queries to add responsiveness. After an interesting conversation with a couple of students about the printable aspect of the NZ Govt Web Usability Standard I tried a print style as well.

I put my files into xampp/htdocs to open them on my phone, looked good and was happy although a little underwhelmed. Too easy.

Bootstrap

This is something I’ve been wanting to try for a few months. I’ve never used a css library so didn’t know how to go about this (except linking the file).  The tutorials on tutorial republic.com are in my opinion fantastic and guided me through the process. The home page I created is almost identical to their sample page, but the rest of the pages I made myself. A summary of things I implemented:

  • Created a page-width navbar at the top of the page
  • Created a jumbotron area
  • Used coloured buttons (btn-success, btn-danger) to make things stand out
  • Used the grid system with rows and columns differently on each page to see how they worked
  • Used panels to group information together
  • Found img classes and used img-circle
  • Designed a form using text, password, dropdown, radio types. (Used a php script and an sql query to populate the drop-down menu with coffee flavours)

The other good resource I found was getbootstrap.com which is a complete bootstrap reference and accompanies the tutorial nicely.

Overall pretty straightforward although I’m not 100% on the difference between

<div class="col-md-4">

and

<div class="col-lg-4">

as they all seem to scale on smaller devices, why not just use lg and be done with it? Oh well, it will come to me.

Coffee store database

Nothing challenging here, a couple of pros and cons:

  • I didn’t normalise the tables properly to begin with so had a bit of refactoring to do. A bit worrying since I’m teaching it this week but good revision for me
  • Used a few enums, which feels like setting a foreign key restriction except without creating an extra table
  • Named a table ‘order’, which was a bad move since ORDER is a reserved keyword
    • While solving this, I read an interesting discussion on using singular vs. using plural for table names. I’m going to stick with singular.
    • I then got sidetracked on a discussion on choosing the size of fields in tables, which didn’t reach a consensus but definitely stimulated my tired brain
  • Wrote a script that generates a .sql file which clears the tables out and then inserts a bunch of test data. Efficiency!
  • The site lists coffee orders from today, I might add a boolean ‘complete’ so I can keep old orders in there (for statistics, see google charts below) and only show ‘live’ orders.
  • For adding new orders I put together some php that takes a username/password, checks it (uses md5 on the password) then inserts the order, or returns you to the form with your values back in the fields (except password). Wrote a registration script that validates your email then enters you in database (with MD5’d password).

Security

I used this tutorial to do all of the security stuff mentioned above, and actually got sessions to work although I don’t think I’ll require that my the project – it’s complex enough already.

On the page where I’m listing live orders I’m going to add a small form that enables an ‘admin’ user to ‘complete’ an order which should be trivial after adding the ‘complete’ field to the orders table.

I also found out that POST isn’t actually secure (without SSL, I think) – just more secure than GET. I think for the purpose of this project using POST will be enough for me.

Google charts

This didn’t take too long, I just have a problem with

php generating a javascript array

and the output looks like this:

outputted javascript

Which has an annoying comma after the last element in the array but I can’t be bothered modifying the script since it works.

I haven’t looked into modifying the appearance of the graph yet, so it currently looks like this:Google chart

Next steps:

  1. Put in another graph, customise both (I’m thinking colours, legend to begin with)
  2. Modify the orders table with a ‘complete’ field, modify php to take advantage of this
  3. Get back to bootstrap and styling, which was the main point of doing this.

My wife isn’t impressed that I spent a quite nice day on my computer, but feeling much more prepared and got to clear a bit of junk out of my head. Now I’m really looking forward to working on this with my students this term.