Tumult Hype Responsive Canvas with Dynamic Text


Download the responsive Tumult Hype Template with Dynamic Text Content

Tumult Hype is my favorite go-to keyframe based animation app for creating HTML5 content. These two templates are adaptations of Tommy Hodgins’ responsive hype to enable scaling repsonsiveness https://gist.github.com/tomhodgins/f76b936ea90c4286b8f88285edbf231d and a script using JSON elements to import text dynamically into the Hype document using css classes.

Dynamically adding text content via JSON allows for an easier workflow for translating text content into other languages. Do you have an alternative way to translate your hype documents into other languages? If so, I’d love to hear your workflow in the comments.

VS Code Snippet Formatter

, ,

If you use snippets when working on projects in vscode, you are going to want to bookmark this page.

This simple, yet handy app for converting your base code into a json friendly format used by visual studio code was created by my good friend Rocco Cutri.

Project Workflow for Agencies, Design Teams, and Production


How I take on new clients or projects with a simple but effective process that can be applied for any project.

Isolate Products in Seconds with Photoshop Action

, ,

This Photoshop action isolates products that were photographed against a pure white background and saves the images with transparent backgrounds.

Create Flexible Sitemaps with Gloomaps


Building site-maps is an important part of website design/development. With GlooMaps it’s really easy to create your own sitemaps fast and efficiently and share them with other collaborators. It’s free to use and you can create an unlimited amount of maps.

Image Optimization using ImageOptim


Have a Mac and need to compress an image fast? Check out this awesome app that not only compresses images but also removes any private EXIFmeta­data that gets embedded into images from digital cameras. Once it is installed you can set up your system preferences to ctrl+click on any image and get the option to compress your image without even opening the app! Check out how fast it is in the video.

Image Optimization with Fotosizer


Sometimes projects like designing websites or creating ads require mass image production. I’ll generally start off exporting out of the program that the image was created in, like Photoshop, but when it comes to batch resizing, renaming and optimization, Fotosizer is my go to when I’m working on a Windows machine.

Install Grunt & Grunt-cli on Ubuntu

Sometimes installing gruntJS on Ubuntu can be problematic if your new to the command line in Ubuntu. The following commands can help you get started.

Create Disk Images with Etcher

Have you ever tried to create a bootable disk to launch an operating system? How many steps did it take to actually get the drive to boot? Lost count midway through the process? Yeah, me to, until I found Etcher. Etcher can create a bootable drive with 3 clicks. Choose your OS then the drive you want to use to boot with, then click “Flash!”

Miro Video Converter

Miro is an awesome lightweight video converter for Mac that I use when I need a quick and dirty video conversion for the web, without diving into Adobe Media Encoder. It will take just about any file format and output it to .MP4 or WEBM.