On the last blackboards of Richard Feynman:
[more]
Consider, for a moment, the core verbs of participation on the web today. I'm not talking about GET or POST. I'm talking about CREATE, REMIX, SHARE, and DISCUSS. Am I forgetting any? Each of these represents a form of engagement that is meaningful -- and near-ubiquitous -- for most any website built around "user-generated content" (I triple-shudder on that phrase.) While Sketchpad is still embarrassingly-deficient on letting people DISCUSS (stay tuned...), I've taken a slight detour to test out a new verb: RECREATE. This is not a general-purpose verb, but I think it's worth trying out on Sketchpad and sites like it, where there's interest in supporting learning and teaching.
In basketball, you've got games like H-O-R-S-E. In art studios, you've got people attempting to replicate a masterpiece or copy a style. In music lessons, you've got students trying to repeat back what they hear their teachers play. I'm wondering if these types of learning exercises might make sense for creating things on the web. I can't think of any examples of sites that support RECREATE as a top-level verb, so I thought I'd try it out right here on Sketchpad.
As of earlier today, every sketch has a little "recreate" link in the footer, giving you an entry-point to do just that. Click on it, and you'll be given a blank canvas, the sketch editor, and the masterpiece of your choosing (drawn from any revision of any sketch found on the site). You can take a totally different path than the creator did, but the idea is to arrive at a finished version as close to the original as possible. Try your hand at making this tic-tac-toe game:
Or replicating this bit of recursion:
This is a brand-new experiment. I'm not sure if anyone will use it, so I'll wait a bit to see. I the meantime, I'm adding it to the list of useful techniques for teaching with Sketchpad. If you're an educator interested in testing this out, please let me know!
I just added a new sketch by Ari Prasetyo to the Studio's gallery. If you look at the source code of this sketch, you'll see that all of the comments and variable names are written in Indonesian. A few months ago, humphd mentioned that he was relying on Google Translate to understand what people were saying about the Processing.js project. I'm starting to have a similar experience with Sketchpad (my little corner of the ecosystem), and I have to say, it's a lot of fun!
In the past week, I translated a Korean tweet, a French blog post, these Indonesian explanations, and many of the Spanish sketches in one of the new private studios. My favorite part of Google's tool is that it automatically detects the source language. It deciphers compliments in languages that I can't even recognize. I find it both gratifying and embarrassing that I actually need this magical feature.
One of the great features of Etherpad is that you could create a new document with one click on the homepage, and share it with others by mailing them a URL. No signup hassle, no up-sell, just click and go. I left this in, of course, when I built Sketchpad, but the real action now happens inside the Studio, which requires account sign-up/sign-in. I added some windows to the studio so outsiders can peer in, but there is still a real wall between the sketches created within the Studio and those created from the big button on the homepage. People do some great work outside of the studio, only to realize afterward that no one will see their creation. So I added a new feature that I think is a pretty nice solution: The ability to throw a sketch over the wall into the studio. To avoid metaphors and keep things clear, I just call this "save for later."
When you click the link, you create an account, and a copy of your sketch (with a pointer back to the original) is added to your new sketchbook in the studio. Now others can see the sketch, they can see who created it, you can give it a name, and make it a part of the studio. I think this is a subtle but effective way to move from the great one-click-to-start sketch to the real action inside of the studio. If you try it out, please let me know what you think.
Dennis Daniels is more effective than you are at getting his feature requests heard. Why? Because every one of his requests comes in the form of a screencast video uploaded to YouTube. He has, literally, thousands of them online already, and he added seven to the count this week while looking at Sketchpad this week. I have to say, I have not seen a more effective way of requesting a new feature, suggesting a change, or demonstrating a bug. Each one the screencasts that Dennis recorded about Sketchpad has been both fun for me to watch -- he appreciates many of the my favorite Sketchpad features -- and difficult as well, as he struggles to find things that I built but didn't make easy to discover. His screencasts are one part feature request and one part user testing session. For me, the guy who's building the application, it's a fascinating mix. Here are links to a few of them:
I continue to receive great suggestions and feedback from people using Sketchpad through the UserVoice page that I set up (which is a very useful service!) I always respond to these as they come in, many have already turned into new features, and many more are on near-term to-do list. But Dennis's videos are different. I can't seem to put off these fixes and requests. It's difficult to watch someone flail when trying to use something that you built. Test this out: record a screencast in which you struggle to accomplish something reasonable and useful in a web application, upload the screencast to YouTube, and email the video link to the application's developer. Then start your watch. Count the hours before the problem is fixed, the existing feature is made more discoverable, or your must-have feature appears on their production boxes. If you send your email to the right person, I think that this will happen pretty quickly. I, for one, felt compelled to act after watching the videos. Wouldn't you?
Next time I find myself wanting to request a feature on someone else's web application, I'll test this out. Perhaps I'll do a video request for video requests on UserVoice. Or maybe I should record a feature request for recording feature requests on UserTesting.
Feeling inspired by the medium, I recorded a video response to one of Dennis's feature requests. His request is the first video, and my response is the second. Enjoy!
The sketch that I'm playing with in the video is Modified clone of "Spinner"
Part of what I love about Studio Sketchpad is that it's an environment for creating digital animation that is focused primarily on process, and only secondarily on the product. When you find yourself impressed by the final version of something that someone built on sketchpad, you've only really scratched the surface. Don't believe me?
I fired up ScreenFlow and started stepping through the history of a sketch recently created by a few talented people working together. Check out the resulting video clip:
Here's the final sketch. Click through to view source code history of this sketch.
If you send me a link to some of your complex and interesting sketches, I may have to make another video. Looking for a place to begin? Take a look through the sketches featured in the Gallery. Feel free to clone-and-remix anything that catches your interest, and take it from there.
Dan Ha recently uploaded a fantastic game called Swim, that he built with Nicole Roach and Cameron Teitelman. Complete with nicely-illustrated instructions! When I asked him about it, Dan said:
The sketch was designed for our CS147 class at Stanford University: Human-Computer Interaction. We designed it the sketch with the goal of creating a simple, fun game that would give kids an intuitive sense of physics. The fish and turtle serve as a metaphor for vectors - the size and orientation of the fish projectiles represent the magnitude and direction of a vector. When they collide with the turtle, the resulting direction and distance that it moves is the combined vector of all the fish projectiles.
Check out this full-screen version of Swim. Below the canvas, you'll see the latest revision of their source code, complete with Processing syntax highlighting.
Great work, team!
I spotted a series of interesting sketches by an unnamed author Visa-Valtteri "visy" Pimiä this morning that I wanted to point out. I thought it was interesting to see each sketch build on the previous one. As always, you can do the same, by cloning and modifying any version of any of these sketches. The "clone" link is in the footer of each canvas.
was cloned and modified into:
and
was cloned and modified to sidescroll:
and again cloned for a whirling variation:
If you've been making your sketches in the Studio, you may have noticed a new camera icon in the top-right corner of your canvas. Clicking this little camera will take a snapshot of your sketch that can be used in a few different places. When a canvas is not running, your snapshot will act as a preview of what's to come. Clicking the button still brings it to life, but now you have a sense of what that may do.
A few caveats: The snapshot functionality is only accessible while a sketch created in the studio is in Edit Mode. Sketches that import images from elsewhere on the web cannot be snapped, but images uploaded to the sketchpad server itself will work just fine.
Atul Varna invited me to give a brief talk about Sketchpad and the Programming Visual Media course that I co-organized for the School of Webcraft at the Mozilla Labs Night last week. Knowing the audience, I prepared my slides for the talk as a set of browser tabs (Minefield, of course) to flip between. Mostly for some live demos of the things that a static slide just couldn't convey. The upside of a browser-based talk with interactive slides is that you can try everything out yourself: kick the tires, make your own variations, etc. So in addition to the screenflow that I recorded while I was talking, I'm including a set of links to each of the demo sketches that I was showing during the talk. For a few of these, you'll need to be logged in with your Studio account. Hope you enjoy!
Slides:
I wanted to share some sketches created by students in Doug Holton's HTML5 course at Utah State University. Nice work!
