The Speak Colors Hack Club workshop is one of the best introductions to creative coding—and, perhaps unintentionally, one of the best introductions to JavaScript for beginners, that Hack Club offers. It's a good example of the magic Hack Club Workshops can create: it's fairly short and super beginner-friendly, but by the end you end up with a super fun, easily hackable, and seemingly complex project that you didn't know was possible to make so easily. But although the workshop contains all the ingredients necessary to create this magical feeling among your club members, actually creating that feeling requires some effort.
Lorenzo runs a Hack Club in Kentucky. In this meeting, he and his coleads run the Speak Colors workshop. There were about 5 club members in the meeting.
What Lorenzo does right
He pretty frequently stops to check in on his club members & make sure everybody is on the same page.
From to , he finds a stopping point near the middle of the workshop and asks his club members to make sure it works. This serves as a good small break from coding, and it gives his club members a chance to ask questions without feeling like they're holding up the meeting.
Occasionally, instead of directly explaining what a piece of code does, he asks his club members, to see if they know.
See for a great example of this.
If there's ever a period of awkward silence after a question, he calls on individual club members to get things going.
Many club members are likely aware of this crushing feeling: you ask a question to your club members, and in response you get 10 seconds of awkward silence because nobody wants to answer. Nearly every club leader has felt this at some point. In most cases, the problem is not that nobody wants to answer, but rather that nobody wants to be the first to answer.
At , Lorenzo calls individually on one of his club members during a check-in point. This starts a chain of check-ins, where every club member eventually responds to Lorenzo's question.
At , he does it again.
At , Harrison, one of Lorenzo's coleads, also chimes in with his own answer. This is also a great strategy for club leaders who don't want to individually call on their club members for a question.
From to , Charles (another colead) chimes in after another question.
He is always sharing his screen, and if it's not on a repl, it's on his custom slideshow.
One takeaway from Claire's meeting is that slideshows can tremendously help bring energy up, especially in online club meetings, because they give club members something pretty to look at. The vibrant colors and gradients in his slideshow make it very visually stimulating.
More importantly, because something is always happening on Lorenzo's screen—be it his slideshow or him coding on repl.it—his club members are a lot more compelled to look at the screen and stay engaged.
Wait a few minutes for people to trickle in. If you can, play some music in the background. Make some casual conversation with people as they come in.
At the beginning of the meeting, Lorenzo asks people what they did for spring break and has a nice conversation with one of his club members.
Have the slideshow linked in the "Resources" section opened up.
Have the Hack Club Speak Colors workshop opened on a separate device before the meeting starts. You'll be using this workshop as a "script" throughout the meeting.
Go through the workshop
Open the demo linked at the beginning of the workshop and demo the final product to your club members.
Give a bit of an intro. The workshop doesn't have much of an intro, so you'll have to improvise a bit. If your club members are relatively new to coding, broadly explain what p5.js is and how the demo works.
See how Lorenzo does it from to .
Go through the workshop, using it and the slideshow as an example.
Once you reach slides 15 and 20, stop and check in with your club members to make sure nobody fell behind.
Give your club members time to hack
The workshop itself is pretty short, and should only take about 30-40 minutes. The real magic comes during the hacking section, when people can go wild and make it their own.
Introduce the hacking section with slide 21. If you want to give your club members a little bit of inspiration, slide 22 has that.
Give your club members 10-15 minutes to hack. Play some music in the background, or make casual conversation with people, to fill the silence.
Lorenzo does a cool thing in this meeting: he screenshares as he makes his own demo during the hacking section.
Check in with people as they're hacking.
Demo projects!
If you have time left in your meeting, use it to encourage your club members to demo their projects. If nobody wants to go first, you and your club members should go first.
It's okay if only one or two people end up sharing—the point is not to pressure anyone or force them to share; it's for your club members to be able to see what others made.
A good way to approach demos if you don't feel comfortable with the way Lorenzo does it in this meeting: have everyone share the link to their repl in an online space that everyone is part of (Slack, Discord, whatever) and demo people's projects yourself. That way, your club members can see what others built during the hacking section, but nobody has to actually stand up in front of the room and present, so it's a lot less intimidating.
Finish up
After the demos, you're done! Play some music and make some casual conversation as people head out.
Notes
It's pretty common for club leaders to make a mistake or two when writing an explaining code. Whether or not this negatively impacts your meeting depends on how you handle it.
From to , you can see Lorenzo run into a small problem, quickly debug his code, and move on. Every debugging session is different—in fact, another club leader ran into the same problem during his meeting—but the less of a big deal you make it, the less your club meeting will be disrupted by it.