When a friend requested a way to present a piece of print media online without losing the novelty created by its multiple folds, we weren't sure if CSS Transforms and Animations would suffice...

As RedwoodJS gains more terrain, it's time to see if its generators and well organized structure will help us out with building the front end of a CraftCMS site.

CSS animation of a classic optical illusion of rotating items.

When it was time to do an audit of the different image sizes in a Drupal site, I found that there were quite a few image ratios... Just how different were they? I had to find out of course.

Experiment. What do you do when your beautifully designed large headings seem a little overwhelming against those inevitable small stories? Well, first of, try a little redesign maybe? But then... if the problem persists, perhaps we could get a little... funky with :has().

A very clean semantic HTML progress bar styled with nothing but CSS, requires only one class to style all steps, finished or unfinished.

Animated illustrations that use @patrykzabielski's script, and Jun Luo's digital paintings. Patryk's parallax script is an elegant piece of code that use a data value to animate layered images parallaxically (?). With a few tweaks to the styles, I've added greater control to the ratio of the image, that way we're not limited by a fixed height.

Bash scripts to backup your server's sensitive data to Dropbox, using AndreaFabrizi's Dropbox Uploader script.

A python script to help you back up your SlideShare presentations to PDF.

In September 2015, the people of Pacasmayo were bracing themselves for a the next possible El Niño phenomenon. At UN Diario, images of the last "big hit" were available in the archives and we thought it would be valuable to refresh people's minds of the devastating effects it can have when not prepared.

Stepping out of the comfort zone and trying out different grid systems.

A PX to EM calculator for the non-mathie CSS writer.

Collaboration with old friend, classmate, and colleague, Jun Luo.

An experiment with animated css text-shadow through javascript.

Base12 is a framework that provides you with a basic SCSS folder structure for your projects. Its measurements are built around the number 12 for increased flexibility & math goodies.

This is a baseline grid overlay created using some CSS gradients. it simulates a baseline grid based on ems which will allow you to size it according to your site's base font size.

I created a quick HTML file to test the basic look, arrangement, and alignment of HTML elements, primarily typographic elements. I use it in almost every project to make sure that they work well with each other.

Website design for interior designer, Dale Kahn.

A small URL shortener developed as a small project within CrunchyWeb. This project was a collaboration with Ryan Merl and Wil Hall who developed the backend while I worked on the UI and UX.

In 2011 Carlos co-founded CrunchyWeb, a small web design company focused on creating websites for new and small companies as well as offering consulting services.

Interactive portfolio website for Web Production I class.