Creative Coding Playground

$300
Learn how to incorporate fun, interactive graphics using browser-friendly creative code
InstructorFernanda Ruiz
Sun icon

Apr 19, 2022May 18, 2022

Tuesdays from 9:30 pm12:30 am UTC

Intermediate
On Zoom
Artwork by Olivia Charlesworth
This item could not be added to your cart.
InstructorFernanda Ruiz
Sun icon

Apr 19, 2022May 18, 2022

Tuesdays from 9:30 pm12:30 am UTC

Intermediate
On Zoom
Artwork by Olivia Charlesworth
This item could not be added to your cart.

Do you want to learn how to use code as a creative tool to design fun, interactive graphics that you can ALSO insert in your websites? Are you ready to be mistakenly called a full stack developer and having to infinitely reiterate your actual role as a creative who codes? Then this is for you.

In this 5 week course, you will learn how to create browser friendly graphics using creative code that you can insert anywhere on a website. In doing so, you'll break free from the dependencies of libraries that only run on special programs installed on your computer, such as Processing. While there are plenty of JS libraries that we can use to achieve the main course goal, we will be starting with p5js as it is one of the most popular and accessible; once we gather more knowledge and skills on JavaScript, it will become much easier to master other libraries.

Learning Outcomes

  • Learn to use code as a creative tool for the web
  • Generate graphics with code, and add interaction to them
  • Gain leverage over popular JavaScript libraries
  • Understanding (or even mastery of) p5js

Prerequisites

Proficiency with HTML5 and CSS3, basic understanding of JavaScript, heightened sense of curiosity and patience when experimenting with code.

Instructor Bio

Fernanda Ruiz (she/her) is an independent digital designer from Mexico. She previously designed and shipped websites with Paris based studio Future Corp, and lead the digital projects department at Monterrey studio Monumento. Her favorite kind of work focuses on creating engaging websites with fun, interactive twists, using code as the tool to execute them.

She spends half of her time responding to emails and DMs clarifying her role as a creative who codes, not a web developer.

Syllabus

Week 1: Introduction to Creative Coding
What is it, brief history, limitations and uses in the context of the web

Week 2: Coding Playground! Part 1
Learn how to create objects and transform them using p5js, add interaction to these objects

Week 3: Coding Playground! Part 2
Insert created Canvas to a webpage; use CSS to style canvas + webpage; make it mobile!

Week 4: Personal Project Start
Review and discuss project ideas

Week 5: Final Projects Presentation

Scholarship

Index scholarships are designed to benefit underrepresented groups, BIPOC members of our community, and those for whom the class price is not accessible. These need-based scholarships will go to the candidates who best demonstrate why they should be chosen for the free spot to our class based on the following criteria:

  • Belong to groups that are traditionally underrepresented in the graphic design and creative industries
  • Do not have jobs that would pay for these courses as professional development
  • Cannot independently afford the class at list price
  • Share our value of intentional community

The number of selected applicants chosen is subject to the discretion of Index and the instructor, but every course will select at least one. Applications are due April 12, 2022 and recipients will be notified April 15, 2022.

See also