Archive for the ‘Zoom Creates News’ Category

Zoom Creates Campers

Monday, August 30th, 2010

On Friday morning we packed up and headed out on the 1st Annual Zoom Camping trip. The seasoned campers were were efficiently packed with all the necessary camping gear. Others were still wondering exactly how exactly the lack of room service, not to mention electricity, was going to work. Still others worried about the weather — when we reserved the sites back in January we were picturing the August weather a little bit differently. But every last one of us was excited for the adventure and hilarity that was sure to ensue.

We lucked out with the weather, sure it could have been a little warmer, but we didn’t see a single drop of rain. We ate like kings and queens and even had our own floating island. We also learned a thing or two. Kris taught us that the water in the lake is wet! Who knew? Thanks to Eva we realized that when laughing uncontrollably while laying on a floating island in the middle of a lake, its best to keep hold of a handle. Kurtis demonstrated exactly why half shirts went out of style. June and Lisa informed us that camping is dirty. And Tim taught us that short ribs are even better when cooked over the fire in the wilderness. But most importantly, we learned that with a group of Zoomers working together, we can accomplish anything!

Hello Zoom, an Android App Tutorial

Wednesday, August 4th, 2010

In my last post, I talked about the neat little phones that me and Justin picked up (not the phone that Justin won, lucky…), the Samsung Vibrant. It’s an Android powered phone, with an awesome screen and all that jazz. Feel free to check out that post for all my hype, because this post is about writing Android apps.

Most beginner tutorials out there that I found over the last few weeks have just regurgitated the Hello World demo app from Google. I found that pretty useless, because Google has a perfectly fine demo on how to print text to the screen. I set out to build a little app that displays an image, has button, can update the screen, and gives user feedback (I used the vibration feature of my phone). I even had enough time to set up a basic options menu, so that will be in this tutorial too.

I won’t be covering how to set up your development IDE, as Google has done a great job with that too. I followed the tutorial on setting up the Android API in Eclipse, and was up and running without a hitch in about 30 minutes (there was a lot to download). I developed this app on Ubuntu 10.04, but I’m pretty sure that you can use this code on any platform. Click through to get started!
(more…)

KITT Happens

Tuesday, August 3rd, 2010

Last weekend was the fifth annual 2010 Adult Pinewood Derby at my buddy Rob’s house and Zoom Creates was there representing. Kris and I both made cars this year and Kris volunteered to build a web-based online scoring tool. He borrowed a projector from Justin, hung a sheet in the garage and we were all able to see the leader board,  who was currently racing and who was on deck. It worked like a charm.

This year was a little different. In the past four years, there were strict traditional rules; weight limit; length limit; no propulsion, etc.. This year the rules were open to interpretation. There was no weight limit. Cars could be no longer than 8 inches—at the start of the race. Any non-flammable forms of propulsion were allowed. It was crazy. There was a remote controlled, gear-driven car, a remote controlled propeller-driven car, a rubber band propeller driven car, a wind-up spring driven car, and the winning CO2 propelled rocket car. There were also a handful of good old gravity driven cars. Mine was one of the latter.

This year, I decided to do make a model of KITT, the 1983 Pontiac Trans-Am driven by Michael Knight (David Hasselhoff) in the 1980′s TV show, Knight Rider. I got the idea when I saw a Tiny Cylon Kit at sparkfun.com back in February. Kurtis, who was allegedly too busy to build a car this year, offered to help me modify and install the lights from this kit into my car so it could be used as a functioning scanner in the front of the car. Well, before I knew it, it was July and I had not ordered the Tiny Cylon Kit or (just like every other year) started building my car. I decided to forgo the  functioning lights due to the time constraints.

I modeled up the car in Illustrator then printed and cut out paper templates. I needed to add some width and height to the original block of wood. I measured and cut out wheel wells and glued pieces of wood to the original block.

I took this modified block of wood along with my templates to Tim’s house and used his mini table saw and belt sander to cut out the rough shape of the car. I then build the hood scoop and spoiler out of thin plywood and glued them into place, cut out the scanner notch and drew the hood, lights and door lines. I also hollowed out a compartment underneath to hold the weight.

Then I primed and sanded and primed and sanded.

Then spray painted him gloss black.

While the paint dried, I cut the lights out of colored paper and drew the license plate in Illustrator. For the windows, I printed out a subtle gradient that would match my diorama. I cut these out of paper and spray mounted them to clear vellum and glued them to the car.

For the diorama, I found a photo of El Mirage Dry Lake in the Mojave Desert in California, added a better sky, adjusted the colors to look like an old TV whose color is going out, printed it out and mounted it to some foam core. I left a curve in the transition from horizontal to vertical to try and create the illusion of a seamless background.

All that was left to do was prepare the wheels and axles. I cannot reveal my technique for axle prep but can reveal that it involves a file, sandpaper, steel wool and a few other secret ingredients. For the wheels, I used a silver Sharpie to draw a thin silver ring where the tire meets the rim and colored the head of the axle (nail) black. I also made an iron-on KITT HAPPENS T-shirt to wear to the derby.

After aligning the wheels I added the weight, polished it up and took it to the race where it placed 5th overall out of  24. Not too bad considering.

Zoom Creates does OSCON

Wednesday, July 28th, 2010

Zoom Creates does OSCON

Last week O’Reilly put on the 2010 Open Source Convention (OSCON) here in Portland. The Zoom Dev team took Thursday morning to check it out. There were many exciting open source projects on display, and SWAG everywhere! We through caution and our identities to the wind and dropped business cards in jars and filled out forms for drawings. By lunch time, we returned to the office with bags full of t-shrits, coffee mugs, pins, pens, toys, and papers. It was a great way to spend the morning: talk about nerdy stuff with other geeks, and have something to wear for the next day. After a start like that, productivity was pretty much shot for the second half of the day, but we managed to get some work done… until we started getting phone calls for the forms we filled out and business cards we dropped. But the calls were not sales calls. Amazingly, in addition to the generous SWAG we hauled back to the office, we won three smartphones!

Qualcomm Innovation Center, Inc. (QuIC), whose focus is on integrating software and hardware on mobile devices, had a drawing to win one of ten HTC Droid Incredible phones. Both Justin and I won that drawing. And Symbian, the company that manages the operating system on Nokia phones, had a drawing to win one of three Nokia 5800 XpressMusic phone. I won that drawing too. Not bad for a days work!

Thanks, O’Reilly, Qualcomm, and Symbian for the gifts and for your support of open source projects! OSCON is coming back to Portland next year, so be sure to check it out!

First Annual Rainbow Day

Wednesday, June 30th, 2010

Rainbow Day was brainchild of the Tweedles, inspired by the Jimmy Dean Ad campaign and a line up of brightly colored shirts. The plan: everyone would sign up for a color and then could wear a top or dress of your chosen color for the day. (Note: your color had to appear solid from 3 feet away, no plaids allowed!) We brought in treats in a rainbow theme and we even caught a snapshot of the Zoomers in full rainbow attire, complete with Kurtis as the pot of gold! I don’t think you could get anymore bright and cheery then this colorful group!

If you haven’t already caught the Jimmy Dean ads on TV, you should head on over to YouTube and check out our very own rainbow inspiration.

The Tasting Panel featuring BellaSvago and Zoom Creates

Tuesday, May 11th, 2010

BellaSvago™ and Torkscrew™ are two brands that we at Zoom Creates are extremely proud of. From inception to product name to brand/identity to voice and messaging, we’ve been there from day one. Two beautiful logos, one lovely e-commerce website, to-die-for product packaging that’s sure to impress and a plethora of printed materials, including business systems, marketing sell-sheets, advertisements, large format and tabletop signage, as well as point of purchase concepts. These are just some of the fruits of our labor over the last 7-8 months.  Each and every Zoomer had some part in this and we all feel very close to the project for many reasons. The first is that the inventor of Torkscrew (a fabulous all in one screw cap/corkscrew/champagne/beer bottle opener) is our very own Leisa Bates, one of four Zoom Creates principals and our finance extraordinaire. (You can read more about Leisa here and Torkscrew here.)

If you combine a super cool kitchen/wine gadget with an idea that sprung out of a great mind that we know and love… you can imagine the heart and soul that went into this project. Long story short: Torkscrew and it’s parent company, BellaSvago, is growing and making their mark on the world. Enter The Tasting Panel magazine, whose May 2010 issue features a full page editorial outlining the  Torkscrew Story and touches on the minds behind the brand (that’s US). Please enjoy.

Does good SEO mean bad design?

Wednesday, April 21st, 2010

Over the years, I’ve heard from more than a few people that “good Search Engine Optimization cannot co-exist with aesthetically appealing design.” In other words, the site that remains after being fully optimized is not as good looking as the originally designed site. Why is this?

I think we can all agree that search engine results are important. In fact, statistics claim that up to 85% of online shoppers use search engine results to find what they will eventually end up purchasing. This means from search bar to search results to click through to purchase, or something like that. Because of this, having a website that will show up in search results is of utmost importance. SEO is the “man behind the curtain” that makes those websites appear in the search results. When we speak about “optimizing” a website, we are speaking specifically about preparing a site to show up as often and as close to the top of the page as possible when a user is conducting an applicable internet search. How is this done?

Allow me to explain…

Keywords and phrases: These are chosen based on the who, what, why and where of your site. What is your site about? What is your product? A keyword best describes what the content of your page is. This is one of the most important pieces of optimizing a site.

Meta tags:
There are many types of meta tags, but the most popular of them are the description and keywords meta tags. Meta tags go in the head section of the page. The meta keywords tag should contain a list of the most valuable keywords and phrases used on the page on which it is placed.  Each page should have a meta keyword list specific to that page.  The meta description tag is a description or summary of the page.  In many cases, this description is displayed by the search engine to the person searching for your keywords.  It should use your keywords and suggest to the user that this is the page they’re searching for.

Image Alt Tags:
An image Alt attribute is a textual description of an image. It is used by screen readers to describe the image, but also by search engines to determine the image’s relevance.  Because “an image is worth a thousand words”, keywords used in alt attributes are heavily weighted.  And because computers are not very good at analyzing the content of images, they rely on the text of the alt and title attributes. To fully optimize the graphics and website, it is important to insert a readable keyword phrase within the Img Alt Attribute.

Title Attributes:
Just about any html element in a web page can have a title attribute.  These are like img alt attributes as they are used to describe the element on which they belong, and are also read by search engines.  They should contain valuable keywords.

Title Tags:
The Title tag of a web page should always contain the most important keyword phrase of the page. This is because it will aid in getting higher search engine ranking results.  Titles should also be inviting and descriptive to encourage people to click on them. “mywebsite.com – home” is not inviting or descriptive.

Text:

Text:
Text plays a key role in determining a website’s page ranking; it is thus of vital significance to optimizing a website. Text for a site should contain plenty of important key words and phrases used in different ways. A generic rule of thumb: keywords and phrases should appear at least three times. but don’t go overboard. Over-using a keyword could look to a search engine like keyword abuse which could lower your page rank, so don’t over-do it.

With that being said, I want to circle back to my original question: why do so many of the properly optimized sites appear so unattractive to look at (IMO). For example, this site comes to straight to the top of the search results for “hot air balloon”, but what it HAS in optimization, I feel it LACKS in design. Ads all over, copy galore, is this even a real site? I do not feel extremely confident about this site. It feels more like a bed for advertising than anything else, which is the exact opposite of what any legitimate site would want their viewers to feel.

However, on the other end of the spectrum, when searching for “dog”, the site below came up in the search results at almost the very top. To me, the site has a better look and feel, is easier on the eyes and I come away feeling a little more trusting in the site itself. It’s still busy, yes, but it is obvious that some thought was given to the user experience and making the site a little easier to navigate. “A” for effort.

What is the solution? I am of the school of thought, as I believe most reputable design agencies are, that SEO is something that should be considered from the get-go. The reason for this is that if left until after the site has been designed and developed, the only real option is to begin adding things to the site. This would mean that although perhaps the original vision for the site was dead on, the afterthoughts being added here and there and everywhere will ultimately cheapen the overall look and feel of the site. If SEO is considered at the onset, the proper keywords, phrases, tags, links, text and so on can be built in, all while maintaining the branding, aesthetic appeal and positive user experience. While some feel that optimizing a site is the LAST thing that is to be done, there are those among us that believe all things work TOGETHER for good.

Conclusion? Let’s do the brand, message and website a favor and think of SEO as part of the big picture, rather than something that is done after the fact. As with anything, there are times that optimizing a site will be the last thing that is done, or maybe due to circumstances, a site isn’t built for SEO at the beginning. With the right team of professionals (ahem, Zoom Creates) having a beautiful site built from the ground up while still being fully optimized for the highest search rankings is not a pipe dream, but in fact, a reality.

Zoom Creates a Self Promo—For Reel

Thursday, February 11th, 2010

Yesterday our amazingly talented, patient, smart, nerdy, impatient, committed, ingenious, thoughtful, creative, resourceful and brilliant development team put the finishing touches on the Zoom Creates self-promo reel. These guys are absolutely unbelievable. We described our vision for the reel and they told us: “That’s impossible. You can’t do that. The technology doesn’t exist. You cannot change the laws of physics. We will need super-computers, expensive software, years to write code, more chips, salsa and milkshakes than you can afford.” Then, five minutes later (slight exaggeration) came back to us with a solution–an ingenious solution: open-source software. The only hitch was they had to teach themselves how to use it. And that they did. They figured out how to use Blender for the 3d animation and Kdenlive for the video post processing. Sprinkle in some Flash and great ideas of their own (watch the mouse pointer jump from one panel to the next and the animated atom) and there is no stopping these guys.

They even used math! Lots of math. That was the most mind-boggling thing I witnessed. I like math and all but if it were me putting this thing together, I think I would have approached it more organically, finding the music then individually timing and positioning the pieces. Not these guys. After the look and feel/animation comps were completed, they looked at the music, the number of pieces and the frame rate etc. and gave each piece a number and had it all laid out on a table with little pieces of paper. Independently, Kurtis worked on the music while Kris positioned all the pieces and when they put them both together, it was like magic. The animation synced up with the music almost perfectly. It was unbelievable. These guys know what they talking about. Well done, lads.

This entire project has been such a great team effort. Everyone here at Zoom Creates contributed. The countless hours of concepting, discussing, designing, scheduling, production, learning, listening, laughing and collaborating have truly produced a project to be proud of. Not only does it show off some of Zoom’s best work, it is a portfolio piece in itself.

Writing your first Chumby widget

Monday, February 1st, 2010

tic-toc-goes-the-clockSo, you got your first Chumby and have browsed through the 1500 open source widgets, and now you’re ready to contribute to the open source community by writing your own widget. There’s lots of resources out there, so we’ll just cover the basics here.

Here’s what you need:

  • A Chumby
  • Adobe Flash or other developing environment for creating SWF files
  • An account at Chumby.com

Open up Flash. Set your size to 320 x 240 and frame rate to 12 frames per second. In Publish Settings, set the Player to Flash Player 8 and the Script to ActionScript 2.0. Chumby allows widget up to 100kb in size, which is plenty of room for code, but can get tight when working with audio and video.

For this tutorial, we’ll make an analog clock. But there are hundreds of clocks already! Yes there are, but I like to have every other widget be a clock, and I’ve only found about a dozen clocks that I really like. That is one of its primary functions, after all.

First of all, set up your assets. You’ll need three clock hands, positioned in the center of the stage, with the registration point properly set. Name them hourHand_mc, minuteHand_mc, and secondhand_mc.

OK, now the code:

onEnterFrame = function() {
	dt = new Date();
	//set hour hand
	hrs = dt.getHours()+dt.getMinutes()/60+dt.getSeconds()/3600;
	angle = hrs*30;
	if (angle!=hourHand_mc._rotation) {
		hourHand _mc._rotation = angle;
	}
	//set minute hand
	mns = dt.getMinutes()+dt.getSeconds()/60;
	angle = mns*6;
	if (angle!=minuteHand_mc._rotation) {
		minuteHand _mc._rotation = angle;
	}
	//set second hand
	scs = dt.getSeconds();
	angle = scs*6;
	if (angle!=secondHand_mc._rotation) {
		secondHand _mc._rotation = angle;
	}
}

Let’s break it down. On each frame we create a new date object. Then we get the hours of the date object. We also add in the minutes and seconds because we want the hour hand to move a tiny bit every second, not just once an hour. Next we convert the hours into degrees by multiplying by 30. (360 degrees per 12 hours makes 30 degrees per hour). Next we check if the hour hand needs to be changed. It should only be changed once every 12 frames, not every frame. Using this if statement prevents unnecessary redrawing of the screen, which can save processing time and make a widget run more smoothly. Though, you’ll probably not notice any difference in this simple example.

The minute hand and second hand go through the same process.

OK, save it, publish it, and upload it to Chumby.com, but don’t make it public yet. Add it to a channel on your chumby and try it out. You’ll undoubtedly find lots of things to tweak with your clock. Did you even give your clock a face? Maybe it needs a tick sound, or a gong on every hour. Maybe you don’t want a typical analog clock. Changing the code for a digital clock should be pretty easy.

This is a simple example, but it should get you on your way. In my next post, I’ll write about creating a configuration file, and playing with the accelerometer. (unless I forget or change my mind). Until then, make a cool clock.

Digital agencies start taking the brand lead.

Thursday, December 31st, 2009

marauz_100_ideasIn the last couple weeks, two digital agencies have won two very large brand accounts, ones that would typically go to traditional agencies with digital capabilities.

Says Brian Morrissey of BrandWeek, ” Design software company Autodesk tabbed AKQA for digital and traditional work, and Ameri-prise Financial hired R/GA as its lead agency. Such assignments are still the exception to the rule. Most clients aren’t ready yet to trust digital shops with their brand strategy, according to many agency executives. Yet the general expectation is that this will slowly change, particularly as digital initiatives become core not only as marketing channels, but also as internal drivers of innovation.”

It’s no secret that in the agency world, we’ve all been waiting for the exact moment that interactive agencies would finally come to the forefront and nab all business usually distributed to traditional agencies. The consensus is that yes, this will happen, but the process is a slow one.

Enter Zoom Creates: as an interactive agency with strong digital capabilities, we too are excited for the “interactive takeover”. The major value add Zoom Creates brings with our digital capabilities is that we are still extremely strong in Brand/Identity/Strategy. We continue to hone our skills in all areas to ensure that when we are called upon, our skill sets are sharp and we are ready to rock.