{"id":9371,"date":"2013-08-16T17:51:44","date_gmt":"2013-08-16T21:51:44","guid":{"rendered":"http:\/\/webmakerblog.wpengine.com\/?p=9371"},"modified":"2019-02-26T12:42:16","modified_gmt":"2019-02-26T20:42:16","slug":"girls-learning-code","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/foundation-archive\/mozilla-learning\/girls-learning-code\/","title":{"rendered":"Girls Learning Code explores webmaking"},"content":{"rendered":"

Recently, Girls Learning Code<\/a> hosted two week long camps at the Mozilla Community Space in Toronto, Canada. The first camp explored the theme of Webmaking!<\/em> 47 girls from across Ontario came together to learn about leadership through graphic design, game design and HTML & CSS. Some girls even traveled from California, Detroit and Quebec to join in on the fun!<\/p>\n

\n
\n
\n
\n

\"\"<\/p>\n

The week was jam packed with different activities that taught the girls how to leverage technology and use it to become a better leader. In the words of the mother\u2019s who dropped off their eager girl, \u201cI wish I had had this kind of experience when I was young!\u201d. Here\u2019s an inside look at our week of webmaking:
\n<\/p>\n

Day 1<\/strong><\/h4>\n

Pair Programming:<\/strong> Rebecca Putinski<\/a> of Extreme Labs<\/a> gave us a fantastic lecture on the concepts and values of working together. We learned that pair programming is a technique where two programmers work together on one workstation, with one person being a \u201cdriver\u201d and the other being the \u201cnavigator\u201d. To drive this idea home, the girls worked in pairs to create stop-motion animated gifs. One girl would take pictures (as driver) and the other would \u201cdirect\u201d the photos (as navigator).<\/p>\n

\"\"<\/a><\/p>\n

Paper Prototyping with Minecraft<\/strong>: <\/strong>The incredible team from Cardboard and Ideas<\/a> lead an afternoon workshop in the importance of paper prototyping. Paper prototyping is a process where designers and programmers will use paper, sketches and physical objects to test out their designs and user experience. In groups, the girls prototyped a Minecraft-inspired board game design using elements of paper-prototyping, then demonstrated their finished projects to the class. This workshop was really eye-opening to the girls and showed them the benefits of using craft to enhance the digital experience.<\/p>\n

\"\"<\/a><\/p>\n

\"\"<\/a><\/p>\n

Warm Fuzzy Bags:<\/strong> Warm fuzzies are heartfelt notes that make us feel good \u2013 Notes about how awesome, creative and smart we are. The girls were encouraged to write these notes to each other throughout the week, then drop them into warm fuzzy bags \u2013 basically, a personal mailbox full of amazing notes! THE CATCH IS that you can\u2019t look into your bag until after you leave camp on the last day! It acts as a wonderful memento to the week that we had. Each day we spent some time writing warm fuzzies and personalizing the bags with stickers, glitter and googly eyes.
\nLessons in Leadership:<\/strong> We began our endeavor in leadership with a talk about defining the word. Laura Plant<\/a> lead a discussion about which qualities makes a good leader and how each girl can utilize the skills that they excel at to become better leaders. She also touched on the subject of technology in relation to reaching a large demographic of people, enabling a person to lead a much larger community. Each group of girls was tasked to choose a leadership characteristic (honesty, compassion, positive thinking, inspirational, etc) to focus on for the week.<\/p>\n

\"\"<\/a><\/p>\n

Day 2<\/strong><\/h4>\n

HTML and CSS with Thimble:<\/strong> Front-end web developer, Tessa Thornton<\/a> gave us a fantastic lesson on how to create websites with HTML and CSS in Mozilla Thimble<\/a>. The girls learned how to customize the design of the website through CSS editing, and worked together to insert images, text, and even embedded videos through HTML. Each website was created to showcase the leadership word that the group selected. It would also later house their digital creations from the week of camp. Take a look at the websites that we created: Honesty<\/a>, Collaboration<\/a>, Positive Attitude<\/a>, Ambition<\/a>, Ambition<\/a>, Ambition<\/a>, Courage<\/a>, Inspirational<\/a>, Inspirational<\/a>, Honesty<\/a>, Positive Attitude<\/a>, Positive Attitude<\/a>, Commitment<\/a>, Collaboration<\/a>, Commitment<\/a>, Positive Attitude<\/a>, Courage<\/a>, Honesty<\/a>, and Ambition<\/a>.<\/p>\n

\"\"<\/a><\/p>\n

 <\/p>\n

\"\"<\/a><\/span>Sun prints<\/strong>:<\/strong> After our lesson, we trekked down to the park to create Sun Prints<\/a>, a fun off-screen activity lead by Freshbooks<\/a> designer, Erin Morris<\/a>. The girls made collages on transparency paper using leaves, sticks, and natural objects in the park then laid them on top of a light sensitive paper. When the paper was exposed to sunlight, the objects created artistic silhouettes.<\/p>\n

\"\"<\/a>
\n 
\n 
\n 
\n 
\n 
\n 
\n 
\n 
\n 
\nGraphic Design with Pixlr:<\/strong> Erin Morris continued the day with us by leading a lesson about embedding meaning in graphic design. She taught us how to make dynamic logos that convey unique messages of leadership. After learning about our new tool, Pixlr<\/a>, each girl pinpointed a trait that best represents their leadership style and designed \u201ccrests\u201d around that word. The crests were made with different shapes that the girls could customize with colour, sizing and patterns. Some crest themes included sense of humour, honesty and positive attitude.
\n\"\"<\/a><\/p>\n

\"\"<\/a><\/h4>\n

Day 3<\/strong><\/h4>\n

Group Logos:<\/strong> The day began with the groups coming together and brainstorming a team logo. They sketched ideas and designs at their workstations then worked together to create their logo on Pixlr. The logos were then saved, printed and ironed onto t-shirts later in the week.
\nLove Bombs:<\/strong> Using a website called Lovebombs<\/a>, we created custom invitations for parents, friends and sponsors to our \u201cDemo Day\u201d at the end of the week. With Ashley<\/a> leading the lesson, and using the skills we learned in Tessa\u2019s lecture, we used HTML and CSS to customize the colours, fonts, images and layouts of our unique Lovebombs.<\/p>\n

\"\"<\/a><\/p>\n

\"\"<\/a>
\nField trip to the DMZ:<\/strong> Later in the day, the girls got to go on a field trip to Ryerson\u2019s Digital Media Zone<\/a>. The girls learned that the Digital Media Zone is a space for amazing tech entrepreneurs to grow and develop their businesses. We toured the facilities and got to demo some of the different games and technologies available, including creative writing website Ping Pong Story<\/a> and multi-touch DJ software by SmithsonMartin<\/a>. After the tour, each group got to ask questions to a panel of female professionals at the DMZ about how their job has reflected the use of their leadership word.<\/p>\n

\"\"<\/a><\/p>\n

\"\"<\/a><\/p>\n

Day 4<\/strong><\/h4>\n

Scratch:<\/strong> Using Scratch<\/a> software, the girls made video games related to leadership traits. Tessa lead the workshop and the girls made games with unique characters and objectives. The girls learned how to use variables and if-then statements to help their characters accomplish goals. A couple great examples can be found here<\/a>, here<\/a> and here<\/a>.
\nPanel:<\/strong> We were lucky to have five passionate women in the tech industries in Toronto participate in a panel that would give the girls an inside perspective on leadership, technology and the courage that it takes to be an innovative member of your field. The girls asked questions and the panelists talked about their jobs, experience and education to get where they are today. Our awesome panelists included: Kathryn Barrett<\/a>, a Back-end Developer at Ping Pong Story<\/a>, Kate Hudson<\/a>, Mozilla Foundation<\/a> Designer and Programmer, Katherine Hague<\/a>, the CEO and Co-Founder of Shoplocket<\/a>, Sami Sadaghiani<\/a>, the CFO and Founder of Playground<\/a> and Cassie McDaniel<\/a>, Designer of Mozilla Webmaker<\/a>.
\nHackasaurus:<\/strong> The girls used a tool called Hackasaurus <\/a>to make a \u201chacked\u201d or copied version of a Toronto Star or Wikipedia article with custom information and design elements. After hacking, the girls filled in their Hackasaurus pages with content about the Digital Media Zone and the answers they received in the Q&A panel with female entrepreneurs.<\/p>\n

\"\"<\/a><\/p>\n

Day 5<\/strong><\/h4>\n

Tech talent show:<\/strong> The girls were invited to show off their own tech creations from outside of the camp in the \u201cTech Talent Show\u201d. Approximately 15 girls showed off different projects they had independently created, including stop motion animations, games, movies, blogs and fashion collages. (From a mentor perspective, I was completely blown away at the talent and creativity that these girls displayed!) The talent show was a lot of fun for all involved, and the girls came away with some new tech tools such as Polyvore<\/a> and Unity<\/a>.
\nCotton Candy!:<\/strong> We had a super special lunch time surprise from Ashley Lewis<\/a> \u2013 She brought a cotton candy machine! Every girl got a delicious, fluffy piece with flavours that they could mix and match! It was pretty awesome. \":)\"
\nDemo Day:<\/strong> The parents and guardians of the campers were invited into the space to see what the girls had worked on all week. Over 60 parents, siblings and guardians came to watch the girls present their websites, crests, logos and games.
\n\"\"
\nCamp ended after demo day and the girls went home to conquer the world with their webmaking knowledge. It was fantastic to see how much they had grown over the week \u2013 Some girls came into the camp very shy and bewildered, and by the end they were confident and eager to share their ideas. We\u2019re looking forward to seeing what amazing web creations these girls will come up with in the future! YOU ROCK GIRLS!<\/span><\/p>\n

Get Involved<\/h3>\n