I did some work for a friend’s startup triv.io. It’s a cloud-based data storage and manipulation platform. It’s like having a dumptruck to take your data back and forth from the cloud! I went with an origami theme for this one.
The site is just one long sign-up page, but the header follows you around as you scroll. You can also click the invite button to scroll down to the email sign up.
Last summer I played Softball on a team with a long-running history of hilarious team names. That year was no exception. I made our logo and we got these printed large and proud on our shirts and looked fab all season.
As co-founder and VP of Pixels of Zeep Media, I was in charge of basically everything visual. Here’s a roundup of some of what I made.
Name & Logo
The name Zeep Media came out of day-long brainstorming session (read: beating my head against desk). I think it references the sound of a cell phone when it both beeps and vibrates on a hard surface.
I was in charge of designing and implementing the HTML/CSS layer of the website, as well as light front-end programming duties.
The homepage was meant to get potential advertisers going right away. They could fill out their ad copy and move directly to the next step of creating their first campaign.
How it works
This is a step-by-step explanation of the campaign creation process. I included it to show some of the icons and illustrations I made.
Creating a campaign
This is one of the steps in our “wizard” style interface for creating a campaign.
A bunch of us at Vibes have entered the Chase Corporate Challenge race. 3.5 miles of pavement pounding in downtown Chicago. Here’s the logo I designed for our shirts. I’ll post photos when they’re printed.
Here’s how I made it
I made a few sketches using my running shoe as a reference. I chose this one and took a picture of it with the Photo Booth app.
2. Start a-Vectorin’!
In Illustrator, I placed the scanned image as the top layer, set it’s opacity to 30% and it’s blending mode to Multiple. This let me create the vector shapes underneath the scan while using it as a reference.
3. BAD Vectors!!!
So here’s a view of the finished illustration that shows all of the vector shapes that make it up. The negative shapes between the white parts of the illustration are actually strokes. This is kind of a disaster when trying to print on a shirt because you really only want one shape to describe the white image.
4. Ahh, that’s better
After about an hour of cleaning up the vectors, I’m done. Check out the difference between this version and the one above it. Way cleaner and easier for a printer to interpret where the ink needs to go.
Because this is a one colour print (white on blue shirt), I needed to convert the faint speech bubble behind the shoe into a halftone pattern. This lets the printer simulate a fainter shade of the color it’s printing.