Codetober Spooky Time

This very spooky CodePen Chicago event was partnered with Girl Develop It and hosted by Arelia, GDI members were encouraged to present their wonderful pens. Marvin Cespo, @mcespo, helped with the photography and documenting of presentations and a few presenters came dressed up in costume for a wonderful surprise :D


Arelia Jones presenting animations Halloween 2017 CodePen

Arelia Jones wearing a witch hat presenting her pen

Arelia showed a wonderful sprite animation with z-index manager. Tuna the cat's sprite picks the keyframes through steps in the animation.

Stacy's Not so Spooky Pumpkin Facts

Stacy in Bee costume presenting pen

Stacy broke down the latest CSS Grid Layout and open type features while showing some new pumpkin fact, and one about Illinois being the largest producer :O

Jon Petto's Invisible Draculas

Jon Petto talking about Invisible Draculas

Jon showed us the Animation and Intersection Observer API that fires a callback when an element enters a specified position in the rendered DOM. Bats fly across the screen randomly and if they cross the vampire it reveals the hidden character.

Marvin Cespedes Pixel Punch grid site

Marvin Cespedes presents Pixel Punch and happily representing Vox

Marvin Cespedes showed off his latest project after many proof of concepts using CodePen to test out latest of CSS Grid for Pixel Punch project.

Sean Codes on Fake Shadows

Sean Codes talking about the complex light interactions around objects

Sean Codes created lighting effects around corners from one moving source and a stationary source all through a canvas element.

Brian Montana presenting particle Circle Packing and was asked to show Particle Things: The Upside Down again

Brian Montana presenting circle packing a particle system

Circle Packing creates negative space that looks like large circles in a sea of randomly generated circles. I showed Particle Things last year but there were requests to present it again this year, wonder whyyy... :)

Bryn presenting Starfield Generator

Bryn talking about making Starfield

Brian Gu showing a starfield generator that recycles DOM nodes by resetting their animations after exiting the frame and talked about the memory issues of constructing new DOM elements instead of recycling.


The spoopy photo album A skeleton sitting on a couch with people in the background A view of the attendees while Jon Petto presents Our host Arelia talking about Girl Develop It while wearing a witch hat

Thank you!

Thank you to Arelia for hosting and Girl Develop It members. A big thanks to Media Temple for sponsoring the food. Colt and Backstop Solutions for hosting us and providing beverages. Thanks to Austin for the Material Design Icon posters again and Marvin, our photographer, for an awesome job of documenting the event! Thanks to all of our presenters without you Show and Tell can't happen!

Food and beverages sponsored by Media Temple. Media Temple is also offering all attendees 20% off any web hosting for an entire year, using coupon code CODEPENMEETUP.

Please fill out this survey to help make CodePen Chicago a better experience :D

1,407 1 7