Explore Our Resources
We're always building and learning because the best solutions and thinking evolve with time.
Our Lab Projects
-
CodePen Redesign Process
All the behind-the-scenes action that went into (and continues to go into) redesigning the CodePen experience.
-
Apprenticeship Curriculum
A guide to the Sparkbox apprenticeships. We build responsive, standards-compliant, content-focused, well-crafted, accessible, beautiful web sites and apps—and this curriculum will help you learn to do the same.
-
Full-Stack Beginner’s Guide
Take the next step in your web development career with this online guide to full-stack web development, inspired by Sparkbox's Full-Stack Apprenticeship curriculum.
-
WCAG 2.1 Study Guide
Review the 13 WCAG 2.1 guidelines with this easy-to-read study guide for the Web Accessibility Specialist Exam. Follow along and learn how to create accessible websites.
-
Young Adult Web Training
Sparkbox has taught our local Girl Scouts how to build websites during a one-day training for several years—and expanded that to a multi-week training workshop with our local libraries. Start learning or find what you need to do the same.
-
Bouncy Ball
Comparing web animation techniques by showing how to bounce a ball with each one.
-
Email Lab
Starter kit for developing HTML emails using modern build tools. Build emails the way you build websites.
-
Mina Circle
A Ruby Gem that uses Mina and Circle CI to let you to deploy to any server of your choice without the need for a bunch of server dependencies.
-
Forte
Create an authorized_keys file for a shared shell account from a repository of public key files.
-
mediaCheck
Control JS with media queries with a simple wrapper around matchMedia to run code on entry and exit from media queries.
-
mediaQuery Bookmarklet
Determine current page dimensions and current media query in convenient, bookmarklet form.
-
Building Seesparkbox.com
Watch how our latest site evolved and see how we got to where we are now.
-
Style Prototypes
Style Prototypes can potentially save a lot of hours—and sometimes headaches—in the design process.
-
Visual Priority Guide
It's sort of a mobile-sized content prototype wireframe thingy—a single deliverable that provides direction for content-focused design and mobile-first development in something resembling a wireframe.
-
Content Priority Guide
It's part content modeling, part stripped-down wireframe, and useful throughout developing a site.
-
Collaborative Notes
We've been taking group notes at conferences, workshops, and talks since 2014. Check out all the smarts speakers have shared with us and other attendees.