January 14, 2017

Sharing Research Tips (like YouTube videos)

I really like side-projects. So much so, that it is hard for me to keep some of my side projects on the side.

Lately, I’ve been working (perhaps rather obsessively) on a site that tries to make well-designed instructional modules as easy to embed as YouTube videos. Not just the videos themselves, but short instructional sequences that can be embedded directly into all sorts of course management systems or other websites, and updated in one central location.

The Research Tips and Strategies site

The first step was to put together a site where you can browse the different research tips and grab the embed code for the tips you want to include in your own site:

Embed Code Icon on the Research-Tips site

Clicking that little code icon pops open a window and gives you an embed code, e.g.:


<iframe src="https://dmcwo.github.io/research-tips/embeds/questions/" width="100%" height="400px"></iframe>

Embedded research tips as mini-slideshows

Copying and pasting the embed code into your site, gives you something like this:

The idea here is to use a mini-slideshow to:

  1. quickly present a strategy or concept with an example or two
  2. give the learner a chance to give it a try it out
  3. And then provide a tips page pointing to additional resources, that can include videos and other resources that go into greater detail.

Technology wise, everything is built in Jekyll, hosted on github, and themed with a jekyll version of the fun and amazing materializecss framework. The embeddable slideshows mash-up jekyll and materialize w/ reveal.js to give it a slideshowey navigation.

There are quite a few things still to work on. Materialize.css and Reveal.js don’t always get along, and the result has been some pretty weird behavior with images (which, if I haven’t fixed it yet, may be on display in the example above). All along the hope has been to make everything responsive, and that is more or less working with a few quirks here and there.

In the long term, I’m interested in turning this into something that others can use - making it easy to grow a collection of tips and strategies.

It has been a super fun project and I’m excited about trying it out with classes this quarter.

If you would like to see how it works, check out the code on github. You can even create a new research tip w/ a pull request!