Mozilla Thimble – Test Drive of Happiness

In the last few years I’ve learned a ton about what helps people learn, where they get stuck and how to customize learning for various ages, interests and attention-spans. When ‘teaching the web’ for kids as young as eight all the way up to university students there’s always some level of trouble-shooting and  tinkering to do with tools I’ve tried so far (both on and offline). Mozilla’s Thimble had been one of those tools, but usually for the very early steps in learning.  For more advanced lessons,  I’ve tried a number of different solutions, all with some level of challenge.  For example I turned more to codepen.io to show the separation of CSS/HTML & JS which was fun but only for super-short snippet-type learning.  I also ventured offline with simple editors like Notepad ++ only to run into knowledge-blockers with students – around file-systems or computer permissions for installing new software.

And so, I was super-excited to see the latest version of Thimble released this week – especially after I did some testing. Here’s why I’m  to go back to teaching with the (new) Thimble :

Customizable UI

The new Thimble allows you to expand your code view, or your preview as you need. Seems small, but huge change from the previous version.  With this, the brightness toggle, and text-size customization people will be able settle in to what works best for their learning.  And thank you, thank you – the preview screen stays at the exact-scroll position for refreshes.

Mobile View

Many kids  ask to make ‘apps’ in my classes,  when often what they really mean is “something  I can make and share on my phone”.  So while the mobile view is obviously great from the perspective of learning to design for mobile, it also helps students understand the web as a platform for their app ideas.  I imagine there’s more opportunity to extend that idea well beyond this as well with FFOS app preview perhaps.

File Management

A billion-times better.  Students can  now upload files they need vrs  ‘all code in one page’, or link to external files, which with  previous versions often resulted in mixed content errors.  Yes, so much awesome, including the ability to re-name files names AND upload entire directories, which makes it easy ( I think ) for people to fork and upload projects. I managed to exceed the maximum file-size for upload, but at 5MB seems pretty reasonable.  Having files lists also ‘bakes in’ an opportunity to teach file systems, best practices, naming conventions etc   – which in the past was offline only.  The only thing I couldn’t figure out, was how to download my project. Also next-wish : version control integration.

You can also take and upload ‘selfie’ images from your computer, which will be super-popular, especially for ‘photo booth’ type projects. Youth will love it, providing it passes the privacy agreements of students and schools – but then there’s a lesson to be made with this as well.

Suggested Attributes & Files

One of the biggest challenges and frustrations  of getting things working –  especially with younger kids is spelling mistakes of file names, attribute names – open tags, poorly nested tags… And so I’m thrilled to see suggestions & auto-complete as part of the new Thimble. Also showing which line has errors (without overwhelming popups) will be a huge help. I think there is also a way to use a color-wheel to add in hex colors (also helpful for younger learners), but I didn’t have a chance to test that.

Tutorial

Adding a tutorial.html file adds a ‘Tutorial’ view pane. I usually write my lessons in Google Docs, print and then give to students who are still learning to type, and so spend a lot of time looking from one to the other.   Huge win that instructors can write tutorials as part of the lesson, and that students can keep their eyes on the screen instead of bothering with a second set of instructions.  The only improvement I could ask for, would be the ability to assign specific tutorials, to files to create true lesson plans vrs one long file (also more value for sharing).

I’m sure there are a bunch of things I missed, but these are the wins for my classes.

Congratulations, and thank you to the Webmaker team, this is going to make things so so so much easier, and more rewarding for students and teachers.

On a separate note – I can’t help but think this would also help some of the curriculum development I’m working on – asking teams to develop content in Markdown.  I see there is a Markdown extension for Brackets, and wonder if Thimble can take on a new file type ‘markdown’ to help educators submit curriculum without coding knowledge.  Perhaps this is what that’s the potential for the tutorial file (and collaboration between educators and technologists)

 

FacebookTwitterGoogle+Share