Skip to content

Instantly share code, notes, and snippets.

View ryantroyford's full-sized avatar

ryan troy ford ryantroyford

18 followers · 8 following
View GitHub Profile
@ryantroyford
ryantroyford / layers_to_sprite_sheet.js
Created October 1, 2013 20:57 — forked from jessefreeman/layers_to_sprite_sheet.js
// Put this file in Program Files\Adobe\Photoshop\Presets\Scripts\
// In PhotoShop menu File > Automate > Scripts: layersToSprite.js
// Arrange layers into a sprite sheet.
if (documents.length > 0)
{
// --------------------------
docRef = activeDocument;
@ryantroyford
ryantroyford / index.html
Last active December 21, 2015 23:29
new mapbox attribution wordmark
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script>
<link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' />
<style>
body {
margin:0; padding:0;
font:15px/1.67 'Helvetica Neue', Helvetica, Arial, sans-serif;
@ryantroyford
ryantroyford / gist:5871005
Created June 26, 2013 19:51
design-related tumblogs
old-school:
http://midcenturymoderndesign.tumblr.com/
http://uzicopter.tumblr.com/
http://rekall.tumblr.com/
@ryantroyford
ryantroyford / responsive-vimeo.md
Last active December 17, 2015 06:49
responsive vimeo frame

i used this on my jekyll site, works like a charm. not sure how far back the browser support goes, but works on all modern ones.

this was largely figured out by Young Hahn and Garret Miller.

<div class='vid-frame' style='width: 100%; height: 0px; padding-bottom:56.25%; position:relative;'>
<iframe mozallowfullscreen='mozallowfullscreen' src='http://player.vimeo.com/video/YOUR-VIDEO-NUMBER-HERE' webkitAllowFullScreen='webkitAllowFullScreen' allowFullScreen='allowFullScreen' frameborder='0' height='100%' width='100%' style='position:absolute'> </iframe>
@ryantroyford
ryantroyford / video-process-post.md
Last active December 16, 2015 20:10 — forked from gundersen/video-process-post.md

Mapping Monsters

Replete with monsters and robots, our new video shows how social maps are, and how they are part of everything mobile.

For starters, I hashed out a storyboard. Visually representing the points we aimed to highlight took some trial and error, so everything started on paper - specifically notecards on which we had quickly drawn the ideas for individual shots.

notecards

The shots were arranged into cohesive scenes that flowed from one to another. Once the story was locked down, I got to start doing my favorite part of an animated project: everything.

More specifically: designing characters.

@ryantroyford
ryantroyford / video-process-post.md
Last active December 16, 2015 19:19
process post for mapbox frontpage video

a little while ago, we added an animated video to our homepage. replete with monsters and robots, it gives a quick rundown of mapbox - our services, skills, and products. i had a ton of fun making it, and i want to share a little bit about how it came together. we're all about being open, after all.

when i first started, an entertaining and engaging video was first on my to-do list, so saman, eric, and i sat down and hashed out a storyboard, discussing the main concepts we wanted to emphasize. visually representing the points we aimed to highlight took some trial and error, so everything started on paper - specifically notecards on which we had quickly drawn the ideas for each individual shot.

notecards

we set to work arranging shots into cohesive scenes that flowed from one to another. after locking down the story, i got to start doing my favorite part of an animated project: everything.

more specifically: designing characters.

@ryantroyford
ryantroyford / layers_to_sprite_sheet.js
Created March 8, 2013 02:14 — forked from jessefreeman/layers_to_sprite_sheet.js
// Put this file in Program Files\Adobe\Photoshop\Presets\Scripts\
// In PhotoShop menu File > Automate > Scripts: layersToSprite.js
// Arrange layers into a sprite sheet.
if (documents.length > 0)
{
// --------------------------
docRef = activeDocument;