Design Exploration - Paper Critters

In reviewing the 'Flash Forward' entries from the Adobe Edge Dec. 2007 newsletter, I found the site papercritters.com to be particularly entertaining - from a couple points of view.

This website was designed and developed by JR Fabito as his final project at the Academy of Art University MFA Computer Arts New Media Program. It was created using the Adobe Creative Suite CS3, ActionScript 3.0, 3DS Max (3D animation) and the open source Papervision 3D engine.

The website offers you a chance to either be a 'Toy Creator' and create your own Paper Critter and then print it out and fold/stick it together or you can print and construct one of the thousands already existing in 'The Colony'. If you decide to create your own critters, you can save the critter to The Colony at which point you get to name and characterize it (cute/evil, etc.). You can also save your favorite critters from The Colony in your own 'collection' (subset).

The paper critters are all the same basic block'ish shape. What users have a chance to do is to decorate them.

The idea of paper model making has been around quite awhile - Japan, of course, with its origami art is the most recognized proponent. There is a Japanese program called Pepakura that I purchased for my son when he was in middle school that is seriously impressive - it takes 3D model files and creates printable paper models... very complex models. He downloaded complex spaceships from some of the online games he played and built them - beautiful models. Very impressive technology went into this program. You can check out their website if you are interested in what people are doing with the Pepakura program:

You could consider Paper Critters a free and much downsized parallel to this program that is conveniently available from your browser. I could easily see elementary school children LOVING this - a 3D version of paper dolls. Adults can immortalize their favorite person, cartoon character... or simply have fun with the boss (print and stick pins in it!). What's nice is that it is simple, easily understood... the critters are not hard to put together (I made one).

What is entertaining about this website is two fold - from a graphic design point of view, the site is very nicely designed. It is austere, but colorful and edgy. Appropriately, given the culture that most recognizably brought us paper-folding, it is somewhat Japanese in its appearance. The page backgrounds are very muted - the main page is white, the secondary pages are a very washed out and somewhat cloudy gray... very light, but the color and its faint texture do give the secondary pages added dimension. The site uses black, turquoise, and a bright green as its primary colors. The font family used for the titles and larger buttons is cute, appropriate for the paper critters... almost cut out looking itself. The logo uses one decorative font and the larger buttons actually a secondary, slightly edgier font that is a bit more linear. The large round buttons are fun and bubbly in design and echo the font used in the logo. The graphic design is an interesting and effective blend of fun with a feeling of tech - introduced by the use of black and gray and the clean interface design.

Secondarily - the functionality is simply creative and fun... and the implementation is awesome. From the main page you are offered the opportunity to enter the site within the browser or full screen. There are also links to view 'critters in the wild' (photographs of constructed paper critters in their 'natural environment'...). I particularly like the use of a LOT of the constructed critters to form a pretty cool collage on the wall behind a young lady.Or the currently selected '10 best' critters as voted on by the user community.

The Colony page is a rather cool navigation design - you see two rows of paper critters, one behind the other. The movement of your mouse on the screen creates some movement of the displayed critters which does nothing functionally but it does encourage you to 'come closer' and float your mouse over the displayed critters. If you do that, you get the 'stats' on the critter you mouse over - the username of the designer, how the design has been characterized (cute/evil, rebel/loyal, the critter's name and when it was created. You can click on the back row of critters to bring it forward. Moving your mouse off the back row returns to the original display. At the bottom of the page there are controls that allow you to sort the critters displayed. What is very pleasing is the smooth movement in the pages - the front and back rows sliding smoothly, just managing to move at a reasonable pace without jumping at you. From The Colony you can click on the critter and from there you are able to view a 3D version, spinning and examining it from all sides by moving your mouse. You can leave the designer a comment...

The Toy Creator is a simple digital art program entirely focused on decorating the paper critters. On the left hand side you can chose which side of the critter you want to work on. Tools include a marker, line and shape drawing tools, and stencils. You have a color chooser, zoom tool, the ability to create opacity, the ability to choose a solid body color, the ability to add a grid, and a welcome addition - the ability to upload a single image of constrained size. You can only upload a single image, but the interface allows you to apply it to the critter repeatedly... like a custom stamp tool. The interface is easy to use, intuitive... you can preview in 3D at any point to see how you're doing with your design. There is an 'ink' something or another near the zoom tool that I wasn't quite sure about, it seemed to be a meter or ? because it did nothing I could tell functionally but that was the only obtuse part of the interface.

There are a couple things about the site navigation that are funky - if you get into the Toy Creator or The Colony there is no way to get back to the main page directly (without using the BACK button and that doesn't necessarily do what you want either). So, a smallish OPPS. You want to click on the logo to return to the main page, but that functionality isn't there. Also, functionally... in the Toy Creator... you can clear the design from the critter you are working on but you cannot clear and upload another image without exiting the page and re-entering. Not cool. That was the only thing that I found strongly objectionable.

I would have liked one simple and one more complex addition to the site - I would have liked to have been able to print out a page with the blank patterns on it to sketch on... and I would have liked to have been able to upload image files for each side of the critter so you could design more complex designs in Photoshop or ? HOWEVER, I understand why JR Fabito would have chosen not to do the latter.

The website clearly demonstrates a lot of the same Web 2.0 principles and focus that Karl pointed out to us with BuzzWord, the web-based word processing program designed using Flash.
It makes a strong effort for collaborative design and sharing of designs... the functionality focuses on online community building to draw users to the site and involve them.