Tips from a Teenage Hackathon Attendee

Hi! My name is Valerie, and I’m a high school student who’s attended (and won) quite a few hackathons. I’m here to give you some tips on how to run your own hackathon! I’ve also included a section on virtual hackathons towards the end of this post, given that they are especially relevant today.

Photo from the YouTube + Vidcode Hackathon

What is a hackathon?

A hackathon is an event where attendees form teams to create coding projects within a given time period (typically 24 hours). Afterwards, teams have the option to submit and pitch their project (via platforms such as Devpost) to a panel of judges for a chance to win a neat prize! Most hackathons have an overall winner and different category winners (e.g. best beginner hack, best web development, best mobile app, etc), so there are lots of opportunities for people to win prizes. 

What gets made at a hackathon?

The sky's the limit. I’ve seen a large variety of projects made at the hackathons that I have been to. Teams can choose to create websites, apps, or games - I have even seen teams bring their own hardware to incorporate virtual reality (VR) into their projects! Typically, the different prize categories help teams decide what types of projects they want to work on. 

Hackathon Essentials

Interested in running a hackathon but don’t know where to start? There are four important categories to focus on: People, Space, Technology, and Activities. 

People

You can’t run a hackathon if you don’t have people at the event! From my experience, it is crucial to have participants, student staff, and judge/speakers at every student hackathon. 

• Participants: Anyone who has been to a hackathon will say you don’t need to know how to code to attend a hackathon. This is 100% true! In fact, most hackathons will hold workshops to teach basic coding to beginners (anything from website development to mobile games). These workshops are often taught by student staff members or guest speakers. However, a simple introductory workshop can be taught by platforms such as Vidcode - no coding expert needed!

• Student Staff: Recruiting a group of students to be a part of the staff is crucial to running a hackathon. Student Staff members are a helpful way to spread the word about your hackathon to their friends and classmates. In addition, during the hackathon, they are more approachable to students who need help with their projects than adult supervisors. You can probably find students who are willing to participate from coding/computer science clubs at your local high school or college.

• Judges/Speakers: Judges and guest speakers are equally important as having participants at your hackathon. Finding these people is all about reaching out and contacting individuals who may be willing to volunteer. Reach out to anyone you may know in the tech industry: teachers, developers, software engineers etc. Most hackathons have sponsors who send representatives to judge and speak at workshops. 

Space

Make sure your venue has a hacking space (school gym/cafeteria) and a hangout/planning space (empty classrooms). Minimize distractions, and make sure attendees have space to spread out and write notes - portable whiteboards are great for this.

Technology

Without technology can there be a hackathon? Make sure to have good Wi-Fi, Audio/Visual Equipment, and some hardware. 

• Wi-Fi: Wi-Fi is crucial! Without a good connection, most participants will not be able to work on their projects. In addition, the last thing the participants want is to lose connection in the middle of their pitch to the judges.

• Audio/Visual Equipment: Audio/Visual Equipment is helpful when you are trying to communicate important information to the entire staff and participants. Most hackathons use presentations during their opening and closing ceremonies.

• Hardware: Hardware is also important. However, it is not necessary. You do not need to provide a computer for every participant, they will bring their own device. However, larger hackathons provide hardware such as VR equipment and microphones for participants to use in their projects. 

Photo by Marvin Meyer on Unsplash

Activities

Hackathons are not just about the competition. There are non-coding activities/competitions and workshops. 

• Non-Coding Activities/Competitions: Kids need a brain break! Coding for 24 hours is tough! Set up fun non-coding games and competitions like Capture the Flag, Cup Stacking, Chess, or Jeopardy.  

• Workshops: Workshops are as important as the competition itself! Some people attend hackathons just to learn something at the workshops. As I mentioned before, these workshops can be taught by student staff or guest speakers, and they can range from beginner to advanced levels. 

Photo from the YouTube + Vidcode Hackathon

Some Additional Tips

Here are some other tips for hosting your own hackathon:

• Outlets! Outlets! Outlets! Make sure you have plenty of outlets for your attendees. All of them will have to charge their devices at some point. 

• Make sure you have a detailed schedule planned out. People need to know how much time they have until projects are due. They also want to know when certain activities and workshops will start. 

• Get as many sponsors as you can. Most hackathons are free to attend thanks to the sponsors who pay for the meals and snacks at the events. They are also a great way to bring in judges and guest speakers. 

• Prizes are the best incentive. Although prizes are not necessary, they are the best incentive for people to participate. 

Photo from the YouTube + Vidcode Hackathon

Virtual Hackathons

Especially with COVID-19, virtual hackathons have become more popular. Virtual hackathons are very similar to regular hackathons. The competitions and workshops are still there, the only difference is that there isn’t a physical venue for the event. In some ways, virtual hackathons may be easier to host. Participants code at home and submit their projects by a certain deadline. There are workshops held via livestream or Zoom, and there are staff members available virtually through platforms like Discord or Slack. In fact, hosting a virtual hackathon makes it easier to reach out to a wider range of people in different regions of the country or world!

Well, what are you waiting for? You better get hacking!

Case Study: Computer Science for Grades 6-12 at Young Women’s Preparatory Network

Founded in 2002, the Young Women’s Preparatory Network is a nonprofit agency that partners with public school districts across Texas to operate the largest network of all-girls, public schools in the nation. Their schools are located in struggling urban neighborhoods, and have been recognized amongst the top public schools in Texas and the nation.

In 2019, Young Women’s Preparatory Network (YWPN) was looking for ways to engage girls in computer science. They partnered with Vidcode to create new computer science courses in middle and high school that would reach over 550 students over the course of the school-year. 7 school districts launched computer science programs at the middle and high-school level: Grand Prairie ISD, Dallas ISD, Fort Worth ISD, San Antonio ISD, Midland ISD, Lubbock ISD, Houston ISD.

550 students • 28 classes • 7 schools

Vidcode Implementation Results

• 7,852 Coding projects created

• 25 hours of coursework completed by all 550 students on average

• 90 hours of coursework completed by top 20% of students

One of the teachers running new computer science courses with Vidcode was Ms. Kilgore, a Robotics, Engineering, and Computer Science teacher at Young Women's Leadership Academy San Antonio. She emphasized how much using Vidcode “helped during distance learning” because of the ease in which assignments could be assigned and accessed on the student-side.

““If the girls were learning fast, I was able to assign other modules, and the icons on Vidcode were especially helpful when differentiating in a remote setting [because they distinguished between tutorials and challenges]. Tutorials were given to everybody, but challenges were given to the faster students” ”

Ms. Kilgore assigned one module per week and found that accessing Vidcode online was much easier for the students than downloaded coding software. When asked about a favorite project, she mentioned the Digital Card Project:  

““ I edited the assignment slightly so that the girls got to create their card for a health worker on the front lines of the pandemic and they really enjoyed that””

All in all, Ms. Kilgore was very grateful to have Vidcode as a resource in her engineering and computer science classrooms, as she has found it difficult to find robust, long-term, CS curriculum for middle school. “Vidcode is engaging and has allowed me to impact more students with coding material than ever before.”

---

YWPN Students’ Published Projects

For loops, pop art activity

For loops, 5 star rating

Functions, create a filter

User interaction, cross roads

String manipulation, silly sentence

User interaction, create an app

Conditionals, heartbeat

Conclusion

The seven participating school districts saw strong learning outcomes and positive student and teacher feedback from the first year of Vidcode programs. Students were able to complete a substantial amount of computer science curriculum.

Students were introduced to intermediate levels in core object-oriented programming concepts, such as arrays, variables, functions, loops, and algorithms. As students advanced, they learned about and created simulations, data networks, and other core K-12 CS Framework concepts. Teachers loved that the curriculum is linear and that they are provided with teacher resources that make it easy for student-driven learning with teacher mentoring.

““With no prior coding experience, the Vidcode curriculum was a life-saver for me and my students! It provided the structure and sequencing I needed to offer an introductory coding course to my students. The teacher resources provided enough information to introduce each lesson and then turn it over to my students and enjoy their creativity. The sandbox was great when students wanted to explore their unique ideas.” ”

— Sandy Smith, Technology Teacher, Lubbock ISD

Learning to Code at the Library

Now that school is out, it’s the perfect time to start offering coding clubs and independent learning resources at your library. This blog post will dive into different methods and resources to get your library started supporting everyone (with a focus on tweens and teens) in learning to code at your library!

Coding + Community at your Library

There are many reasons to offer computer science education and learn to code resources at your library. Some are:

• Increasing confidence and abilities of the members of your community

• Generating positive exposure to computer science

• Transforming perspective and identity

• Supporting their futures - every company is becoming a tech company

• Carving professional pathways for all students - learning to code can help students no matter what their career interests are, and can even help them start their own companies!

School districts often don’t have the time or teachers with the correct certifications to offer inclusive computer science and coding classes. Often students don’t have space in their schedule for a coding elective, or it won’t be offered until upper high school. Libraries are able to fill these gaps for the tweens and teens in their communities.

Library Coding Clubs

Coding clubs are ideal for tweens and teens who want a structured environment and time set aside to code each week. It has the benefit of creating a community of new coders. Students get inspired to create more advanced coding projects when they see or remix what their fellow club attendees create. If you can, connect coding to real life - bring in guests working in tech from the local community for mini-lessons and to talk with students about their roles.

Why are coding clubs great?

• Students learn more by coming back over time - can build through the levels

• External motivation for students to keep learning

• Help and mentorship when they get stuck

• More advanced students can support newer ones, or older students can mentor younger ones

• Students build advanced portfolios and learn important skills

Watch a sample coding club for help planning out your first day. Vidcode has Coding Club Kits and free resources specifically for libraries starting their first club, create an educator account to access them.

Vidcode offers our own Virtual Coding Club that meets once a week, and is a completely free way for students ages 10 and up to learn how to code. Sessions occur every Tuesdays at 3 pm ET. Club sessions will allow students to dive deeper into programming concepts and connect with other programmers for future collaboration.

Many libraries link directly to the Coding Club signup page from their websites as an easy option to offer their patrons an entry point into coding. Librarians are welcome to come drop in and see a session for themselves, and get inspiration for their own clubs! The downside is that it doesn’t offer the small groups and collaboration that a smaller in-library club allows for.

Workshops

Not every library is ready to dedicate the time and resources to an ongoing coding club. Many offer one-off events first as a way to gauge interest and give their library’s members a low-stakes introduction to coding. Code the News is a great project to use in a one-day workshop, because it involves filmmaking and recreating something students are familiar with with code. The Snapchat Filter tutorial is also a great workshop project, since the idea of learning to code a Snapchat filter can be a great draw for the tweens and teens you want to reach. It’s important during the workshop to show attendees how code connects to their lives, and the things they use every day.

Code the News example project

Snapchat location filter example project

Snapchat face filter example project

Hackathons

Sample hackathon schedule

Another one-day event option to get your members engaged in coding is a hackathon. Hackathons are friendly, sometimes competitive, coding events offering programmers and creators a space for playful, exploratory programming. Participants in teams of 2-4 spend the day gaining a practical understanding of the engineering design process as they tackle a meaningful open-ended challenge (often community-related).

6th grade students at a hackathon using Vidcode to make apps for their local community

Independent Learning

Your library can offer resources for your patrons to start learning computer science & JavaScript independently as well. Independent learning is great because it’s flexible - your library members can work at their own pace from wherever they are, and come in with specific questions or for guidance with a coding pathway. Vidcode virtual learning options make it easy for tweens and teens to choose the pathway that works best for them. They can learn JavaScript and Python while creating interactive memes and building their own projects in a fun coding sandbox. Share a link with your library members to create their own student accounts or add them to a group for your library.

Get Started with Vidcode

1. Sign up for a free Vidcode educator account

2. Try a few tutorials yourself 

3. Download the lesson plan PDFs from your Vidcode Educator Dashboard

Over 50% of librarians running coding clubs with Vidcode don’t have any previous experience coding.

Review the corresponding Vidcode lesson plan for the tutorial you want to demo for your club that week. In the lesson plans, you can see which coding concepts are covered (arrays, functions, loops, etc.). Vidcode tutorials circle back on the same concepts as student progress through the course, so even if you lead a discussion or show a presentation for a Level 1 project, students on Levels 2+ will benefit from it and be able to participate.

More Great Content for Your Club

CodeScty is another incredible resource that can be used in conjunction with Vidcode’s coding curriculum. They combine the excitement of Hip Hop music with the effectiveness of videos to teach programming. Librarians can play their videos during a virtual club meeting or even have members download their mobile app to watch videos and learn on their own time.

Some Places to Start

• Watch a sample coding club

• Watch a webinar Hands-on Coding Events for Libraries

• Explore a project for your members called “Code the News”

• Create an account and add students for free

Community Resources

Looking for additional resources, or want to connect with other librarians focused on their coding programs? The Vidcode Forum is an online platform where you can post projects that you’ve just published, ask questions about coding challenges you are facing, and gain inspiration from coders all over the world.

Virtual Learning for Individuals

Today, we will show you how to learn code if you are an independent learner working from home. Vidcode was built to be a tool for both classroom teachers and independent learners. For many independent learners, a parent/guardian signs up as an educator to fulfill the role of mentor for their kid. Educators receive answer solutions that students don’t.

Self-Guided Learning 🤓

To get started, create a free Vidcode account, to access over 200+ independent coding tutorials that encompass multiple years of academic Computer Science curriculum. By the end of your experience, you’ll have made an interactive meme, solved puzzles, and created data visualizations. You will also have the equivalent of multiple years of competitive high school or college coding courses with certificates to exhibit your skills.

Bumpers On or Off? 🎳

We know it takes a community to teach a person to code. That’s why we offer two pathways for learners on Vidcode - one with an instructor led class and one fully independent.

Instructor led

Vidcode Staff led courses are run by experienced educators, artists and coders who are passionate about teaching kids to code. Click here to learn more about our Instructor Led courses.

Fully independent + GUARDIANS

Over 100,000 people use Vidcode independently each year to learn to code. We used our experience of supporting over 10 million learners worldwide to help support our independent learners through email and chat. Our independent pathway is also a perfect option for guardians who want to get involved! Parents/Guardians can sign up as an educator and add their kids to their account via our class codes. Track progress, access answer sheets and have access to complete the coursework alongside your family!

Click here to sign up as a Student individually (ages 13 and up)

Click here to set up your account as a Guardian

Click here to sign up as a Student with a Guardian

A Community with ❤️

The Vidcode Forum is an extensive resource and database with learning from 6 years of working with over 12,000 CS teachers. Navigate here to find great resources outside of the website. Have a question? Want some inspiration for your next project? Wondering if there’s someone else experiencing the same challenge as you? Check out the forum, read some posts, or post something of your own.

Coding For K-3!

codeSpark is a well-known ipad application that teaches you to code starting with the absolute basics. Their interface is great for younger students and those who only have access to a mobile device.

codeSpark is incredible for the early elementary years starting in kindergarten. If you are not yet ready to start text-based programming this is a great option for you.

codeSpark’s use of bright colors and animated characters make it the perfect alternative to watching television and playing video games for any child. Instead of quickly losing focus over monotone audio and black and white writing, your child will become enamored by and invested in all the characters of codeSpark.

Enjoying this Independent Learning Journey

Learn core computer science skills through fun multimedia projects:

• Famous Filters: photo editing, filter creation

• Spinning Squares: animate objects

• Video DJ: user interaction, audio manipulation

With over 16 coding courses, individual learners have the opportunity to complete any and all at their own pace. By the end, you will be ready to apply for internships in computer science or take even more specialized courses in programming. Who knows? Maybe you’ll code an app or a website that leads to the next significant innovation to be used for generations to come.

Good Luck and We Can’t Wait to See All You Accomplish!

Click here to sign up for Instructor Led courses (student with Vidcode instructor)

Click here to sign up for Independent Learner courses as a Guardian.

Click here to sign up for Independent Learner courses as a Student with a Guardian.

Click here to sign up as a Student individually (ages 13 & up)

Summer Coding Programs for Teens

Are you someone that wants to learn a new skill? Are you a student finishing up school and getting ready for the summer? If either of these describe you, then why not learn how to code this summer!

Why Learn to Code?

Once you learn how to code, you can create anything you want to express yourself, show an opinion, and help others. Coding is such a straightforward skill that be easily turned into a tool.

Coding is another language. Once mastered, you can begin to converse with other members in the coding community and collaborate.

It is never too late to learn to code and you can start by reading some advice and tips shown below.

Learn on your own

Vidcode offers a variety of free courses that you can follow along with, completing tutorials and projects. You can pick and choose which courses interest you most and take them like that or you can follow the sequence below. Either way, you will come away with a solid foundation in coding. Sign up for a student account to access self-guided courses on JavaScript, Python, and Computer Science Fundamentals.

Join a Summer Camp

Virtual Creative Tech Summer Camp

Another option that you have this summer is enrolling in one of Vidcode’s sessions within their Virtual Creative Tech Summer Camp.

Sessions are for anyone ages 12-17 and no prerequisites are needed. Each session is capped at a maximum of 10 students who are matched with 1 instructor.

Camp runs from Mondays through Thursdays, 12 pm to 2 pm ET and each session lasts 1 week. The first hour is when the instructor will go over their lesson plan and the second hour is when you will be able to work on your project and use your instructor as a resource.

All you need is internet access and a computer or tablet to join a community of other coders.

Sessions

• Intro to Javascript June 29 - July 2

  Build a portfolio of video filters, games, chatbots, simulations, and more.

• VR Camp July 6 - July 9

  Creating 360 degrees images and use physical objects to create VR experiences.

• Web Development July 13 - July 16

  Make your own website.

• Music + Code July 20 - July 23

  Make music and music visualizers.

• Game Development with Javascript July 27 - July 30

  Make video games, like a pet simulator and a guessing game.

Learn more and apply

Whichever way you choose to learn, you’ll walk away with a new skill and a portfolio of awesome projects!

Case Study: Virtual Learning Academy Charter School & Vidcode

Vidcode has partnered with Virtual Learning Academy Charter School (VLACS) to help empower students to code in non-traditional classroom settings. VLACS is a nonprofit virtual charter school for grades 6-11 in Exeter, New Hampshire, the only public online high school in the state.

VLACS has incorporated Vidcode into their course catalogue with 3 career/computer science courses: Creating Coding 1 (Beginner); Creative Coding 2 (Intermediate); and Creative Coding 3 (Advanced). All the courses are student-paced but students are given a recommended 9 week completion time for each course. As students progress they are able to create increasingly complex projects.

When adding these new courses to their catalog, VLACS looked for certain criteria, including flexible pacing, specialized assessment and remediation. Specifically when looking at STEM/STEAM courses, curriculum has to align with CSTA K-12 CS Standards and offer real-world practice for skills that are translatable into the workforce. The Vidcode curriculum offers VLACS students open-ended projects, tutorials, and assessments that are aligned with multiple standards including CSTA. 

“We have partnered with Vidcode for several years using their creative coding courses. We were attracted to these offerings because they are highly interactive, immediately get students coding, and students see the results of their work in real-time. These highly engaging offerings have been well received by middle and high school students new to coding or with some previous experience with other coding languages. Students particularly enjoy the hands-on approach of these courses with minimal text and lots of interactive coding practice.”

— Scott, Director of Instruction at VLACS 

Student projects from Creative Coding 3

“Vidcode provides engaging content for learners of all levels - including beginners.  My students have no trouble using the easy-to-follow, user-friendly interface. Vidcode lessons allow for creative freedom while learning standards-based material.  As a virtual instructor, I feel confident facilitating my students’ journey through Vidcode courses.”

— Tammie, VLACS Instructor

Virtual Computer Science Class Case Study: North Carolina Virtual Public School

Vidcode has partnered with North Carolina Virtual Public School to help bring computer science to students in non-traditional classroom settings.

North Carolina Virtual Public School (NCVPS) is the state run online class program in North Carolina. As of 2017 the system was the second largest online class program in the United States. Through online, blended, and mobile courses, students grades 6-12 are provided e-learning opportunities that prepare them for college and their future careers. NCVPS is using Vidcode’s computer science curriculum as their Middle School creative coding elective. The class runs in semester increments, and students learn beginner to advanced computer programming with JavaScript. In addition to following tutorials and creating projects, students participate in class through LMS forums and share their work through Canvas.

What drew NCVP to Vidcode was the LTI Integration that was easily adaptable to their existing Canvas system. They also liked Vidcode’s student-first focus on flexible individualized learning and strong alignment to the CSTA and North Carolina Computer Science standards. At NCVP, students in the Vidcode creative coding elective are given an exploratory space to evoke curiosity through autonomous discovery, while ensuring they are mastering content.

Vidcode is available free while schools are closed, sign up to teach computer science remotely in your school.

Creating Lessons Intertwining Digital Citizenship and Coding

Have you ever heard of the term digital citizen? A digital citizen is someone who effectively uses technology to engage responsibly in society. Furthermore, it’s a top priority for many educational institutions in today’s tech-savvy age. K-12 coding strives to foster environments where every student is able to become a digital citizen. There are so many various components that make up K-12 coding and directly contribute to the multi-faceted process of becoming a digital citizen. 

1. Creative Commons Media

Creative commons media are specifically chosen images that have been curated for the purpose of reusing content free of charge. Vidcode is a startup company with features that allow users to upload their own creative commons media. Vidcode offers computer science courses focused on open-ended projects that are both research-backed and standards-aligned. Creative commons media can be found on creativecommons.org and images can be browsed or specifically searched for. 

PROJECT: MUSEUM SLIDESHOW

STEP ONE

Students can download creative commons media from their favorite art museum and upload it directly to their Vidcode coding sketch to create a slideshow. 

www.vidcode.com

STEP TWO

Students’ can then properly cite the source in the title and description of their Vidcode sketch after they press the ‘Submit’ button. See example below:

www.vidcode.com

Try this project yourself ——-> Link to lesson plan

2. Licensing

When an image or piece of content is not free to use by anyone a license is applied to track the content. Students can use licensing, including Creative Commons Licenses, in their own projects, so that their peers can properly cite them as sources when remixing their work. 

Navigate to the project gallery on Vidcode’s website. Find a project that you would like to remix into your own. Next, click the remix button and you’ll be brought to a new screen. You are now able to see the code from the project you are interested in remixing and also see the rest of its skeleton. You now have the freedom to make the project your own and  customize it in your unique fashion.

Once you’re done, re-name your new project and cite the name of the original project with a link in your new project’s title/description box. Voila! You have successfully referenced the contributions to your work. This is the first step in safely citing material so that you can always go back and reference where it came from in the first place. 

3. Reputable Sources

Many coding projects may need a background or foundational knowledge that comes from reputable websites and sources. Girl Scouts of Greater New York is an after school organization whose Vidcode projects focus on making Public Service Announcements with three facts that properly refer to reputable sources. That’s a lot to do in one coding sketch! 

Here’s an example of a project that this student group made which was an informative video about the issues surrounding equal education for all. In addition to including multiple types of media, they also had to do research to look for reputable facts, and then incorporate those facts into their code, culminating in an overall instructive way. 

Students can check information such as Author (who wrote a piece and what their background is), and domain (the domain .edu is reserved for colleges and universities, while .gov denotes a government website), to make sure the sites they’re referencing are credible sources.

Vidcode and digital citizenship work hand in hand together in K-12 coding. K-12 coding is such an important undertaking, Vidcode eases the process by teaching students about creative commons media, licensing, and reputable sources in a much more visual and relatable manner.

---

About the Author

Veronica Zhang is a first-year student at New York University studying Mathematics with a keen interest in Computer Science and K-12 Education. In the future, she hopes to work in an area that combines her passion for community service and with her skills in technology.

Vidcode is Going Free to Support Educators & Students During School Closures

Dear Community:

The Vidcode team knows how concerning the novel coronavirus (COVID-19) has been for educators and students, and we would like to support you in any way we can. As such, we’re offering our full platform and curriculum for free to help schools and districts as they plan for potential school closures and student absences.

If your school or district is planning a closure for health-related reasons, please submit this form to get access to Vidcode’s full computer science curriculum and coding platform at no cost. We will provide you and your students with access to our courses, lesson plans, and virtual PD resources until May 2020 (but we will happily extend this offer until your school reopens). Students will be able to access courses from home as a supplement to your other e-learning measures.

Additionally, we will be running a series of virtual webinars and expanding the support we provide on our community platform. Explore our webinar list for more details and to sign up to trainings.

Please share this message with other educators, schools, and districts affected, as this offer is available to all K-12 schools. This offer wouldn’t be possible without our current Vidcode school subscribers, to whom we say thank you for your continued support.

How else can we support you? As communities make plans for possible school closures, we’re actively exploring other ways we can be helpful to educators, students, and guardians. Please let us know if you have any suggestions — please message us at [email protected].

On behalf of the entire Vidcode team, we thank every educator for the impact you make every day.

Best regards,

Alexandra Diracles, Vidcode CEO & the Entire Vidcode Team

Growing up with Vidcode

By Maya Williams

‘The place where it all started’

At the age of 12, I discovered my passion and love for coding during a  weekend workshop with the Girl Scouts of Greater New York and Vidcode. This event was the start of the coding journey I’m going to share with you. 

Ever since that day, I’ve sought to be a  part of every program Girl Scouts of Greater New York has offered with Vidcode ...at least two or three.  These programs are called Breaking the Code and The STEM Next Academy. 

During these after school programs, we coded video projects about ‘Education for All’ and other pressing topics. We also coded fun videos before all of our more pressing project concepts. 

After spending so much time at these events I essentially became a TA; helping the younger girls when the staff couldn’t handle all of them at once. At one of these programs, Leandra (co-founder of Vidcode) and I presented together in front of a large audience.

At the age of 14, Leandra (co-founder of Vidcode) and I finally spoke, and you’ll never guess what happened...she offered me an internship! I was beyond excited about this and I really couldn’t believe it. It wasn’t my first internship, but it’s the first one that I got on my own. 

Presenting at the Whitney, summer 2019

‘Working over the summer and school year’

I interned at Vidcode over the summer of 2019 for about two weeks and it was the best two weeks. I had fun working alongside another Girl Scout who was interning as well that summer.

We helped modernize the Vidcode website as well as helped test out programs and lessons. It was really awesome learning from Leandra and Miles, in addition to seeing the behind the scenes of processes of creating programs and parts of the website. I got to experience what it would be like to work in a real office with other people. It was an amazing real world experience, it prepared me for what I want to do when I graduate college. 

After my summer internship I was given the opportunity to come back to Vidcode and work during my school year, and lucky for me I had plenty of breaks and holidays from school. By continuing to engage with the team, I got even more time to learn and be a part of the Vidcode staff.  

‘Why did you intern with Vidcode’

 I interned with Vidcode for countless reasons, not only because I was comfortable with the site but because I also wanted to bring my ideas to the table and wanted to bring them to the table. I believed my ideas would modernize the site a bit (we still had Grumpy Cat Lessons...) and make it more appealing for the people using Vidcode who are my age or younger. 

‘My favorite project created with Vidcode’

My favorite creative project that I’ve made in Vidcode was my project called ‘Science Time’. It’s a button project that starts with an image of a cat, then when you press the button it goes from ‘Sleep Mode’ to ‘Awake Time’. Finally, when you click on it for a third time Bill Nye pops up and the button changes to ‘Science Time’. I love it!

My favorite informational project is ‘Education For All’ where a group of Girl Scouts where we created a video speaking about the unfair system in schools.

https://www.vidcode.com/share/Hgzwie05rz

What’s next in your coding journey?

 I’m not quite sure what my next journey is but I’m positive I’ll be majoring in Computer Science along with Animal Science; I’ll be double majoring in college. I also want to continue to help out at Vidcode as much as I can. I hope to make a living out of my passions.

Vidcode Wins 2020 Parents' Choice Award

The Vidcode team is delighted to have received the 2020 Parents’ Choice Award.

Vidcode is a website that encourages preteens and teenagers to explore computer programming with JavaScript. Through a series of tutorials, students begin by creating and modifying video and image objects, adding filters, text, and other graphics. As the projects become more complex, the lessons cover all the basics of object-oriented programming, from simple linear programming to complex object properties with user interactions, creating games and simulations. Programming is taught through interactive tasks, requiring minimal parental or teacher preparation and oversight, and teens are encouraged to add their own style and sense of humor to the projects they create. Unlike many introductory programming sites, this successfully targets older youths without either being painfully cute or overcomplicating the coursework. The look and feel are clearly for middle and high school: users can choose from a generic library of images (including, for example, the well-known “Doge” meme star) or even upload their own videos and photos. Completed projects can be saved and shared through the site.

Read more here.

Fulfill your Boy Scout Programming Merit Badge requirements with Vidcode

So, your scouts are thinking about getting their Programming Merit Badges, but you don’t know where to get them started. With so many different platforms and coding languages, how do you know which ones are the most valuable and best for beginning coders? Where can they fulfill the badge requirements and also make something awesome to show their friends?

If you ask most software developers, they will tell you that learning JavaScript is a great way for anyone to get started coding, no matter the age. It continues to be one of the most widely used languages because of its range of compatibility, and it is the backbone of most web development, used by Uber, Paypal, Google, and Facebook. JavaScript is also a great way to get started coding because it’s already built into web browsers and requires no external setup. 

The Programming Merit Badge requires that scouts create content in 3 different programs, using 3 different languages. When choosing a platform for using JavaScript, look no further than Vidcode, a student-led creative coding platform that introduces tweens and teens to the fundamentals of computer science and JavaScript programming. Scouts can use the opportunity to learn to code JavaScript by creating content in their everyday interests: personalized memes, game avatars, video and Instagram filters, and even augmented reality. Not only can Scouts apply skills in problem solving and critical thinking, they can also share their creations with friends. Vidcode takes them beyond the drag-and-drop block coding found in other learning platforms, teaching them to actually write their own code.

Today, Vidcode serves over 1 million students globally and leverages their research-backed curriculum to teach computer programming through rigorous and visual projects. When Vidcode collaborated with the other youth serving groups, some amazing things happened:

• The youths’ confidence in their coding abilities increased from 37% to 89%.

• The extent to which youth identified themselves as programmers increased from 42% to 89%.

The best part: Vidcode is built for youth and proctors alike to jump right into programming, even without any prior JavaScript or coding experience! Coders can complete a project on their own in just a few minutes. As one Vidcode educator stated:

“I have kids say ‘I was afraid of JavaScript at the beginning. I didn’t really want to do that.’ And with Vidcode they’re not afraid of [coding]. And that’s a big deal, for these kids to not be afraid to try another kind of coding.”

Who knows what else it might encourage your Scouts to explore!

Boy Scouts of America’s goal with the merit badges has always been to “enhanc[e] our youths’ competitive edge”, and this is now more important than ever in the computer science sectors. The U.S. Bureau of Labor Statistics suggests computer science job opportunities will continue to expand over the next decade, much faster than any other job sector. Regardless of kids’ access to computer science and STEM education in their school classrooms, Boy Scouts of America is committed to their mission of introducing boys to the world of coding. Vidcode’s content follows the same mission: Provide accessible, fun, activity-based curriculum centered on youth culture and creating content they love.

Access coding tutorials here.

Happy Coding!

Vidcode Certified Educator

Vidcode now offers both free and low-cost virtual training. Congrats to Levent for completing his Vidcode Certified Educator course!! Levent is a talented teacher, curriculum writer, and advocate for STEM in Texas.

Learning to write essays through code

Teacher feature time! Melissa-Ann Pero, a superstar English teacher in Pennsylvania, is using coding to teach revision in English class! Mrs. Pero, who helps students who have trouble in other parts of school, uses coding lessons to teach coding and revision at the same time.

She approaches revision practices much like she would coding. Both require repetition: “It’s forced repetition - if it doesn’t work, [students] have to go back and try again. That’s how it works, when they come to me I say we have to go through it together.”

Also like programming, if an English paper doesn’t contain the correct syntax (i.e. complete sentences, paragraphs, etc.), it creates an error. Mrs. Pero draws a comparison between a successful paper and a functioning computer program: “the computer won't check the code logic until the syntax is [correct].” Likewise, multiple revision attempts (“debugging”) might be necessary before a paper can communicate the student’s ideas clearly.

With Vidcode, teachers can integrate coding into their existing coursework to foster creativity and accuracy, no matter the subject area. Interested in how you can incorporate coding into your classroom? Sign up free.

Vidcode Connects With Makey Makey to go Bananas: A New Computer Science Project

Ever played music with apricots? How about gamed on potatoes? How about used bananas to produce special effects? You and your students can follow this tutorial to code a Vidcode project that does exactly that! We are making video art with code + common breakfast fruits in conjunction with Makey Makey.

Makey Makey is a STEM education kit that lets kids use conductive materials as video controllers. They not only learn to code, but to have fun with hilarious tactile controllers made from everyday items in fantastic DIY invention projects.

Vidcode is a great curriculum set and workstation for kids to learn JavaScript in a way that’s fun, completely interactive, and speaks to tween culture -- they code meme generators, Snapchat filters, and interactive games.

You and your students can create this project in conjunction with the Vidcode Coding Sandbox and Makey Makey lab kit to let kids to control videos they upload with the controller of their own making, pixelating and distorting their video as they wish.

Vidcode + Makey Makey Project Tutorial



You and your students are going to be making a controller that can change their video’s pixelation. See the final project on Vidcode.

To start, you’ll need:

• A Vidcode educator account - make one for free

• A Makey Makey

• Alligator clips

Part 1: Signup

To access this coding project with your students, sign in or create a free Vidcode educator account, and add students from your class dashboard.

Guide students to the Sandbox under “Coding Kit”.

Part 2: Code

1. Students select a video, or upload one of their own. Your students’ video will appear, and so will the code that makes the video run!

2. Next, have students drag “Pixelate” into the text editor. Change the number 50 in pixelate(50); - what happens? What’s the highest the number can go before it stops changing? What happens if students put in a negative number?

3. Set pixelate to a variable. For example:

var pix = pixelate(10); 

This variable stores the pixelate() function, so that it can be changed later in the project’s code.

4. Next, students drag in whenKeyDown under Effects. Look at the code - it creates an event listener that runs a function when someone presses a particular key. You and your students define what this key is in your code.

movie.whenKeyDown = function(key) {

    //your code here 

};

The name whenKeyDown describes what kind of event you want to "listen" for, and since it is a method, we set it equal to a function that’s listening for a key on your keyboard to be pressed.

5. You’re almost done with the coding part of the project! Next, you and your students need to specify what happens when a specific key gets selected. When a user presses the up arrow on their keyboard, the video should get more pixelated. When they press the down arrow, it should get less pixelated.

The first step is to write a conditional in the whenKeyDown function. The most common conditional is an if-statement. Imagine if you're giving someone directions. You can say, if you see a red house, turn left. An if-statement is like that, but in a language your computer can read.

Have your students write an if-statement inside of their whenKeyDown function. This will look like:

movie.whenKeyDown = function(key) {

    if (true){

      //students will add code here soon!

    }

};

Which key gets pressed will be the condition that gets checked in your conditional statement. The condition is set inside the parenthesis after if.

6. Set your condition so that if key pressed is 'ArrowUp', the amount of pixelation in your video will change. For example:

if(key == "ArrowUp"){
    //increase pixelation on my video
}

In English, this is saying check if the key that’s pressed is ArrowUp, or the up arrow.

Have your students set their condition to key == "ArrowUp". Nothing should change yet. That's okay!

7. Now that a condition is set, your students will have to specify what happens when the up arrow is pressed. Remember, when the up arrow is pressed, the amount of pixelation affecting the video should increase.

Let's make this video get more pixelated! Increment means "add one to". It looks like this: pix.amount +=1;

Have your students add the code pix.amount +=1; inside of their conditional. The final code should look like this:

movie.whenKeyDown = function(key) {

    if (key === 'ArrowUp'){

      pix.amount +=1;

    }

};

Try pressing the up arrow! Students’ videos should get more pixelated every time the up arrow is pressed.

8. Student Challenge: Write another conditional inside the whenKeyDown function that decreases pixelation when the down-arrow is pressed. Key should be set to 'ArrowDown'. You can always look at the final project if you need a hint!

Amazing! Now that the coding part of the project is done, your students can publish their projects. They can always go back later to add additional effects.

Part 3: Connecting to Makey Makey

Time to connect your Makey Makey! First, turn your Makey Makey on by plugging it into your computer with a USB cable.

You’ll want to connect to your up arrow to the Makey Makey. Connect an alligator clip to the up arrow on your Makey Makey. You’ll also connect an alligator clip to “Earth,” at the bottom. If you touch the two clips together, they’ll make a circuit, and your video will increase in pixelation!

Instead of just connecting the circuit with alligator clips, you can connect something to be your controller - like a banana! To do this, just connect the alligator clip going from Up Arrow into a banana. Now, you can hold the clip going to “Earth”, and touch the banana to increase the video’s pixelation.

Do the same thing to “Down Arrow” - connect an alligator clip to the down arrow on the Makey Maky. You can connect this to another banana, and hold the “Earth” clip to use both to controller the pixelation of your video! Have all your students try it.

How else could students create fun controllers for their video? How about giant up and down arrows made of tinfoil? Students could also go back into their code and add more conditionals tied to multiple effects and different keys. They could change the color of their video, or whether or not it’s black and white, and make a Video DJ controller to use on a project that’s uniquely to them!

See the final project & code!

Research: Student Learning Outcomes in Computer Science

Vidcode’s curriculum has proven to show significant growth in student’ learning outcomes in computer science in just 2 weeks of classroom time.

The items measuring knowledge of core computer science concepts such as variables, sequencing and loops were adapted from a researcher-developed content assessment that was piloted, refined and implemented in WestEd’s Computer Science Pedagogical Content Knowledge Research Study.

ACCESS THE FULL REPORT HERE

The girls were all over it, I was very pleased with the fact that they were equally as interested as the boys seemed to be.

Middle School teacher

If you’re interested in learning more about Vidcode’s research or platform, or to learn about how to build your district’s computer science program, get more information or set up a time to talk.

Job Spotlight: Computer Programmer

Every month in 2019, Vidcode is going to be releasing a new blog post focusing on career pathways and role models related to computer science, along with related activities that you can do with your students.

The January Job Spotlight is: Computer Programmer

Computer programmers write the code that powers everything, from apps on your phone to websites you visit to software that powers hospitals and schools. They often work together, reviewing code and pair programming. Computer programmers write code in languages such as JavaScript - the language students learn to create projects with on Vidcode. For example, computer programmers customize Instagram filters - one of the very first free activities you can do with your students on Vidcode.

After completing the “Create a Filter” tutorial on Vidcode, you can discuss with your class: What do computer programmers make? How does coding change agriculture, energy and education, or other industries? How do computer programmers fit into that?

This month’s career role model is Lauren Reeves, a software developer at Postmates. Read her story with your students to get inspired by her journey into software development.

In the “Create a Filter'“ tutorial, students code a cool filter for a video by using JavaScript functions, and learn the syntax of calling a function. To complete “Create a Filter” with your students, sign up here and add students to you class. “Create a Filter” is the first activity in “Creative Coding 1.” You can access it free with your account.

Case Studies: Coding across subject areas with Vidcode

Vidcode offers several cross-disciplinary courses that serve as an introduction to programming in connection with other subject areas. Cross-disciplinary computer programming activities serve as an introduction to students who might not otherwise get exposure to computer science and coding! Here are some case studies of amazing teachers that have used Vidcode to teach JavaScript programming across subject areas.

PS 34 Oliver H. Perry Elementary School

Brooklyn, New York

90 students

Subject: Social Studies

Code Objectives: Properties, conditionals, and loops

Other Learning Objectives: 21st century communication and digital literacy skills; Using technology to research, organize, evaluate, and communicate information

ESL Spotlight

“I don’t think I would have gotten as many ESL students involved if I hadn’t proclaimed - This [coding] is done in partnerships. This is how the world works. It’s not built in isolation. Students who struggle with writing or academics, or are new to the country, showing them that this is done in community and in partnerships, in friendship. Also made it interesting for my ESL students. The vidcode curriculum helps dispel the stereotype that there is this lone programmer working by themselves”

- Shanti Crawford, 5th Grade Teacher

Project Example

“Students researched women who made a positive impact in the world. Some students chose Dolores Huerta. Others chose Michelle Obama and Marie Curie. Students coded motivational quotes and facts about their person of choice which appeared at the end of the animation.”

- Shanti

Seth Low Intermediate School

Brooklyn, New York

60 students

Subject: Science

Code Objectives: Repeat functions, and mouse interaction

Other Learning Objectives: 21st century communication and digital literacy skills; Using technology to research, organize, evaluate, and communicate information

Teacher: Candace Miller, 7th Grade Teacher

Project Examples

Milbourne Lodge Prep School

Esher, United Kingdom

90 students

Subject: Literature

Code Objectives: Properties, conditionals, and loops

Other Learning Objectives: 21st century communication and digital literacy skills; Using technology to research, organize, evaluate, and communicate information

“At my school we have freedom with curriculum. The theme is Arthur Ransome and we collaborated with IT and Art. Students created 1930s postcards that represented places in Arthur Ransome’s ‘Swallows and Amazons.’

I tried other platforms—and found them cold, distant, too adult. Vidcode is so young and vibrant. It gives students a sense of ownership. Vidcode is wonderfully visual and students don’t get left behind, as can easily happen on other platforms. I want students to leave a lesson feeling comfortable with JavaScript.”

- Sybil Cary, 6th Grade Teacher

Project Examples

Kennedy Middle School

Redwood City, CA

90 students

Subject: Math

Code Objectives: Properties, data types, and if/else statements

Other Learning Objectives: Students learn advanced concepts in JavaScript and the use of programming integrating math concepts from algebra and geometry.

“With Creative Math on Vidcode, I can literally take any assignment I’m working on in my math unit and have students reflect on what they are learning through Vidcode by having them create a digital media representation of the math concept”

- Emily Thomforde, 7th Grade Teacher

Falling in love with code at a museum

As the co-founder and CEO of Vidcode, I found my passion for code in an atypical location - a modern art museum.

Heat Sculpture, 2013 - gelatin, glass, copper, 2 usb coffee mug warmers, an arduino, and a kinect

I fell in love with art in high school. Flash forward ten years, and I’m a working photographer in New York City. Around this time I went to an art exhibition at the MoMA called "Talk to Me" - which was all about interactive art and human-computer interaction. It changed my life forever. I had no idea, until that moment, the role that technology could play in the things I loved - art, psychology and education.

Interactive installation, 2013

I started building interactive art projects - a heat sculpture (made out of copper tubing and circuits) that melts plastic according to the number of people walking by it. A large gallery installation, where two projections create a lenticular display. Never before had I been able to make art that responded to the audience.

Flash forward another few years, that spark inspired me to start a company - Vidcode - so that teens today don’t have to go through a 10-year discovery process to learn that their love for art and creative expression is directly connecting to computer programming.

I invite you to share this post with your students and have them start art coding today! A great place to start is our Hour of Code Art + Code activities.

Back to School with Code

With such high demand for computer science courses in schools, teachers across the world have stepped up to make sure their students have access to these learning opportunities. These educators work to provide up-to-date tools for their classrooms, regardless of whether they themselves have a traditional technology background. We are honored to work with these dedicated teachers in increasing the number of students interested in STEAM subjects.

The start of the new school year is almost upon us and we have some back to school tips to help you be at your most ready. Follow along to make the most of your Vidcode curriculum!

1. Create a class

To get started, you can create a brand new class for the year and add your students. Students sign up using their Google accounts - just use the link in your teacher dashboard to add them to your class.

2. Plan ahead

Review lesson plans ahead of time: simply click “Lesson Plans” in the left-hand menu and you will have access to all your unit material.

3. Explore free tutorials

Check out our newest free tutorial, End Plastic Pollution! The goal of this coding lesson is to increase students’ awareness of the problem of plastic pollution and is perfect for beginners.

Are your students ready for the next step? A great tutorial for students with coding experience is another Hour of Code lesson: Eclipse! Explore all of the free activities by assigning "Free Activities" to a class from your Teacher Dashboard.

4. Get in the Back-to-School spirit

Get your students excited for the year of coding with a popular activity that lets them code back-to-school Snapchat filters. Use these links to for the activity, lesson plans, and a gallery of past projects:

• Tutorial
• Lesson plan
• Gallery & Inspiration

Want more? Go even further with our Creative Coding One course. This course introduces students to the essential foundations of computer science and basic programming with a focus on identifying how code connects to and can enhance their existing interests. Learn all about Creative Coding 1!

Happy coding and good luck with the start of the year!