Home Summer of Making and Connecting | makesummer.org



Digital Harbor Foundation

Program Summary

WebSlam is an intensive, week-long experience where students develop real-world skills in web development and then put those skills to work to help others. Through the aid of tech coaches and direct instruction, youth participants (irrespective of prior web development background) learn the basics of HTML, CSS, and PHP through developing for the WordPress platform. As a capstone to the week of learning, students undertake to solve the needs of actual clients (nonprofits) who are in need of web solutions in an intensive hackathon-style “WebSlam.” By intertwining the learning of a new skill set (web development) with a service opportunity (helping a non-profit), students are motivated to learn more and inspired to do civic good with their knowledge. This proposal is an expansion of a pilot model developed by Andrew Coy at the Digital Harbor Foundation in Baltimore.

The 2013 WebSlam would take place in Baltimore’s inner city at the newly opened Digital Harbor Foundation Tech Center for 20 to 30 participants (ages 13-19). No prior web experiences is required and those interested but who have significant web knowledge would be asked to participate in the weekend hackathon to help nonprofits and potentially also to serve as volunteers during the week of instruction and preparation. While additional information might be gathered for registration purposes, applications would be selected based on expressed interest in learning to program and desire to serve others. In addition to paid instructors, it is anticipated that we would have an additional 9 volunteers providing more than 100 volunteer hours for the hackathon portion of the WebSlam.

Please help inner-city students in Baltimore gain hands-on experience in the fast-paced world of web development all while doing civic good for the community in a fun and supportive environment.


After a brief overview of the week’s schedule, participants are introduced to one another through team building exercises and then to the computer programming through activities teaching the basics of web architecture and development. After lunch students learn how to code in HTML and CSS, which is then used to create a piece of “web art” by the end of day one.

The purpose day two is to orient students to WordPress. After a conversation about the OpenSource movement, examples of OpenSource projects and a brief overview of the history of WordPress are given. Students then learn to navigate the dashboard environment, code architecture, community resources, plugins, themes, server database setup, and learn best practices around web security. By the end of day two, each student will have their own installation of WordPress with a blog post.

On day three, the focus turns to principles of design, branding, and user experience. Participants learn important concepts such as type-faces and designing for accessibility. After creating their own business cards and avatars, each participant analyses a website for user experience and accessibility, creating a blog post of their observations.

Participants learn the importance of analytics and platform/device testing. Using tools specific to browser compatibility and performance measuring, reports are generated and potential improvements identified. Participants learn the value of soliciting peer feedback and tracking bugs. Based on design, user experience, and performance measurements, participants make improvements to their personal WordPress installation and identify a purpose for the site that can extend beyond the scope of WebSlam.

The purpose of the last day of direct instruction is explicit soft-skill development in preparation for the weekend hackathon. Participants gain an understanding of the importance of empathy and the role of effective questions/listening to better understanding a client’s needs. Through the sessions on Friday, participants create tool kits for business development and client questionnaire form to use during client discovery and empathy. Friday ends with dinner at which time student teams are paired with non-profit clients in need of a website.

From the first thing in the morning until 6pm in the evening, student teams work intensely with their non-profit clients to pull together all of the skills they learned (and some new ones they are still learning) to deliver a high-quality solution. One or two workshops throughout the day provide specific trainings to the nonprofits on best practices for the web. The student teams are responsible for teaching the non-profit personnel how to access and update content on the website. The hackathon ends with team presentations of the process and final product. A panel of judges gives awards.

Follow Up
After the WebSlam, each team posts their presentation online, the nonprofits work with staff at Digital Harbor Foundation to transition their websites to their main domains and servers. Video footage from event is edited and a recap of the whole week is distributed to partner organizations and media networks.

comments powered by Disqus