Advanced Instructional Strategies in the Virtual Classroom

Advanced Instructional Strategies in the Virtual Classroom Institution: UCIrvine (Coursera) Date: Sep 29, 2014 - Nov 3, 2014 Bio: "Advanced Instructional Strategies in the Virtual Classroom" is part of a four course Specialization Certificate for Virtual Teaching on Coursera. Rather than being a guided instructional or passive informative course, it seems to be constructed with[...]

Emerging Trends & Technologies in the Virtual K-12 Classroom

Emerging Trends & Technologies in the Virtual K-12 Classroom Institution: UCIrvine (Coursera) Date: Aug 18, 2014 - Sep 22, 2014 Bio: "Emerging Trends & Technologies" is part of a four course Specialization Certificate for Virtual Teaching on Coursera. The technology trends they cover focus on supporting 3rd party resources that can increase class engagement; rather[...]

Leaders of Learning

Leaders of Learning Institution: HarvardX (edX) Date: July 08, 2014 - Aug 12, 2014 Bio: This course can best be likened to a high school career assessment test that focuses specifically on the education field. Leaders of Learning acknowledges that between historical experience and new advancements, there are multiple environments in which learning can take[...]

Foundations of Virtual Instruction

Foundations of Virtual Instruction Institution: UCIrvine (Coursera) Date: June 30, 2014 - Aug 04, 2014 Bio: "Foundations of Virtual Instruction" is part of a four course Specialization Certificate for Virtual Teaching on Coursera. This course is intended to introduce the concept of virtual learning used in K-12 to teachers who have never heard of it[...]

Performance Assessment in the Virtual Classroom

Performance Assessment in the Virtual Classroom Institution: UCIrvine (Coursera) Date: April 14, 2014 - May 16, 2014 Bio: "Performance Assessment in the Virtual Classroom" is part of a four course Specialization Certificate for Virtual Teaching on Coursera. The course covers general use and administration of learning management systems, with a specific focus on grading and[...]

Project: Japanese Audio Quiz - Part 2

Project: Japanese Audio Quiz - Part 2

In the first part of this project blog, I set out the goal of creating an Audio based webpage for learning the Hiragana Japanese alphabet. While there are several typing based reinforcement quizzes online, the options for audio based call and response quizzes are fairly limited. After doing some research however, we saw that several of these writing based quizzes have some great design ideas that could carry over well to an audio version.

Next I am going to talk about how I ended up building the functionality for this site. To help the project on it's way, I am going to be borrowing the audio assets from the learning Japanese site, and using some of the HTML and CSS from the Lexi-logos keyboard website; both of which are excellent resources. Here is a sneak peak at the direction that the project ends up heading:

Full keyboard Screen shotRandom Key Screen Shot


There are a number of steps that got me to this point. First, I had to flush out the basic interface of the page from my starting template. Next I would need to be able to connect the audio and image assets I would be using. From there I start building basic functionality on top of the page using JavaScript, and finally take care of some more advanced design features such as tweaking user feedback aesthetics and improving the learning/reinforcement experience for the user.


Project: Japanese Audio Quiz - Part 1

Project: Hiragana Audio Quiz

Learning to read and speak a new language is always an arduous task, especially when you lack the opportunity to totally immerse yourself in that language. Fortunately, there is an increasing availability of good sources online that are freely available. The challenge then becomes finding the appropriate material to advanced your current level of fluency.

Online flash card quiz's that drill you on foreign alphabets or vocabulary are particularly helpful during the introductory memorization phase. However, the majority of them I've found recently rely on typing or selecting the English equivalent of the word you are trying to learn. There are only a few websites that give you an audio cue that you then need to directly associate with the proper symbols; thus cutting out the 'first language' middle man.

So for my next project I set out to create  an audio based quiz system for learning a foreign alphabet. In this specific case, I have taken an interest in trying to teach myself Japanese.

The first step involves framing the problem, and looking at some of the existing works on the web that are similar to this. In part two, I'll start building the functionality and applying design concepts to flush out both the interface of the web page and the targeted learning experience.


Video Games and Learning

Video Games and Learning Institution: University of Wisconsin-Madison (Coursera) Date: October 3, 2013 - December 10, 2013 Bio: This course covers the relationship of learning and video games; not just as engagement tools but in the different structures of learning that games allow. This includes examining how game introduces increasing levels of complexity through tutorials[...]

Khan Academy - Building an Exercise: Part 2

Part Two: Interactive tools

The next step in creating my cryptography exercises for Khan Academy involves creating a set of interactive tools. By combining visual elements as well as interactive mouse events, it will make the individual problems a lot more engaging.

A pirates favorite kind of Graph...

For the first tool, I wanted to create a letter frequency bar graph that compares the average letter frequency of English to the letter frequency in a Caesar Cipher. This allowed the user to compare the difference between the two, and then figure out how much they would have to shift the graph in order for them to line up. There were already a few exercises that utilized bar graphs for mean, median, and mode exercises; which would serve as a good template for what I wanted to do.

The way the Khan framework builds a bar graph is using the graphie.js library (which works on top of raphael.js). This library gives you a series of functions to draw lines and basic geometric shapes on a web page. So in order to build something like a bar graph, every single line, rectangle, and letter has to be placed individually, using a absolute position relative to the image space. While out of context these shapes can be relatively meaningless, putting it all together results in the following image...


In this case, each of the blue rectangles were drawn in a loop, where the vertical value stayed the same but the horizontal value incremented for each pass of the loop. Same for the orange rectangles (and the alphabet labels), except they would have a slight offset such as +0.5 so they appeared next to the blue rectangles. Even the border of the bar graph was created using two separate class to a draw line function.

Getting the height of the rectangles was simply a matter of using the functions I had already created in my crypro library. One to return the array for the English language frequency, and another to dynamically build a frequency array based on a given encrypted message. Both of these arrays were normalized, and then scaled so they could be fitted to the size of the graph.

Eventually I might come back and add some more functionality to this graph. But the first version of this graph turned out rather well. So on to the next tool and the start of my problems...