Here at Sparkbox, we are passionate about inspiring and empowering a Web built right. We also recognize the current gender gap in the web industry, so when the Girl Scouts approached us about teaching the next generation of females more about web technology, we jumped at the chance. On a snowy Saturday in February, Sparkbox opened our doors to 35 girl scouts, their troop leaders, and even some parents to spend a day learning how to build websites. The female staff at Sparkbox spent weeks preparing a curriculum, building a workshop site, and planning how we were going to teach 35 pre-teens and teenagers how to build their own site in five hours.
In all our planning, we realized that we ultimately had one goal for the day: have each girl leave happy having made a website she was excited to share.
Five hours isn’t a ton of time to build a website from concept to launch, especially if it’s your first time doing so, and you need time to learn the basics as well. But five hours, 20 pizzas, and countless tech support questions later, we can say that all the girls proudly met that goal. The girls weren’t the only ones that learned something that day. At Sparkbox, we learned quite a lot about how to best run this type of workshop.
What Worked
CodePen is a Powerful Learning Tool
Everyone started at various levels of technical knowledge at the beginning of the day, with some girls feeling quite intimidated by writing code themselves. And when we talked about the theory and concepts of HTML and CSS (for a very short time as these are teenagers!), some girls seemed even more shaky they would catch on. However, once we used CodePen to demonstrate the real-time output of markup changes, many people made the connection almost instantly and began marking up their own content with confidence.
DivShot Makes Launching Easy
We have a guest post on Divshot with lots of details, but it was so useful, we think it’s worth recapping here. Using Divshot to launch the websites was the best technical decision of the day. We knew launch demos in workshops and conferences had a high failure rate, and we were very nervous about how that part of the day would go. To help save time, we sent an email in advance to have girls sign up for a Divshot account on their own, so launch simply involved zipping their files and dragging-and-dropping into the DivShot interface. The whole thing was a breeze. Thanks to the clever thinking of our team and this simple, great service, the day was a success. (Pro Tip: you’ll be happy to have a couple extra accounts with login details available in a pinch. Those came in really handy.)
Have A Reference Site To Follow
Our awesome apprentices at Sparkbox built a great resource site that included our own sample site process. There, the attendees could follow the same step-by-step process that mirrored what we were requiring from them for the day. This followed the trend that having real examples for them and real interactions to see in browser (like CodePen) were the most beneficial learning tools.
Our Amazing Female Team
Being that this was an event for young girls, we wanted to be sure to utilize all the female talent we have right here at Sparkbox. Having only worked at Sparkbox for a few months, this project helped me realize that the ladies at Sparkbox have an incredible variety of skills. With just our small group, we have a content strategist, a designer, developers (Kasey, Lauren, and Divya), and a project manager. This was a huge asset to the girls as we were all on-hand all day to offer all this variety of skills to their projects. When one girl was committed to finding the perfect Seafoam green color scheme for her Endangered Animals website, I happily passed on that question to Katie (our designer) and let them have fun deciding.
Keep It Simple and Fun
This is probably the golden rule of putting on a one-day, build-and-launch workshop for a young group. For us, narrowing down our content was the biggest challenge, but it did pay off. There was so much we wanted to share about the web, but really, most attendees were only interested in what we had to say to help them in their project. Shortcuts like having the girls come ready with their tech accounts and providing starter templates made all the difference in getting to launch. Not to mention, the breaks for snacks, a tour around the office, and sharing the final sites on the big screen made the day fun and about more than just hard work. One change we’d make in the future to help keep things simple is to have the attendees close laptops during teaching times to make sure they don’t miss out on the next step while trying to wrap up the last one.
Final Thoughts
We had a ton of fun working with the Girl Scouts for the day and are grateful to the Girl Scouts staff and troop leaders who helped. We couldn’t have put it together without Ben’s support and a slew of awesome coworkers, including many who helped answer questions during the day.
The most rewarding piece was seeing the excitement and sense of accomplishment in everyone as they showed off their sites at the end of the day.
And getting positive feedback from parents saying,“This was an amazing event, thank you so much! My daughter was elated when she came home. Thank you for continuing to provide relevant (and quality) programming for the older Girl Scouts,” didn’t hurt either.
Get the Goods
Visit our Workshop Site to find all the resources, starter templates, and continued learning links we shared for the day. We have plans to fine-tune everything based on our experience and offer the updated materials soon so that anyone interested in teaching young, aspiring web geeks can have a solid place to start.
