Hey, this is important! Make the world a better place and update your browser. You're missing so much of what the web has to offer, including the contents of this website.
div.b div.b_top { background: #fff; } div.b div.b_bot { background: #fff; } div.g { background: #fff; }

Interactive

Studio 306

Studio 306 is one of the premier photography studios in the Twin Cities and it shows from their work. Their attention to detail is unrivaled and they truly make their work an art form. How do you make a website to capture this?

You get out of its way. Working closely with Studio 306 we went through many iterations until the photos were really doing the talking. Bigger photos, more of them, de-emphasize everything else. In this case, showing is telling. The work speaks for itself.

div.b div.b_top { background-color: #17a55f; background-image: -moz-linear-gradient(top, #18b76a 0%, #15a15d 100%); background-image: -webkit-linear-gradient(top, #18b76a 0%, #15a15d 100%); } div.b div.b_bot { background-color: #17a55f; background-image: -moz-linear-gradient(top, #15a15d 0%, #148e52 100%); background-image: -webkit-linear-gradient(top, #15a15d 0%, #148e52 100%); } div.g { background-color: #17a55f; background-image: -moz-linear-gradient(top, #18b76a 0%, #148e52 100%); background-image: -webkit-linear-gradient(top, #18b76a 0%, #148e52 100%); }

Interactive

Greenlight

Greenlight builds devices that plug into the OBD2 port of your automobile. These devices monitor everything about your vehicle: location, performance, speed, braking, and problems. The data is sent via cellular connection to a centralized database.

What Greenlight needed was a way to aggregate and display these analytics as well as offer features such as geofencing and maintenance help in an easy and intuitive way for users. The site was built for both desktop and tablet and is also fully themeable for their insurance partners as a white-label product. The design makes heavy use of mapping and charting API's and updates in almost real-time as the user drives.

div.b div.b_top { background: #fff; } div.b div.b_bot { background: #fff; } div.g { background: #f29a3d; }

Design

DevMode Branding

DevMode is a software development company specializing in cloud-enabled mobile and web applications. The concept for the branding of DevMode came from the computer science concepts of recursion and software design patterns.

The "D-E" at the beginning and end of the logo is connected, as if the end of the name is also the beginning of another. This not only adds an element of recursion to the logo but it also doubles as the company mark. The mark is then combined in various ways to produce background patterns. The idea is to conjure up ideas of software design patterns, agility and reuse.

To that end, DevMode also specializes in their own various "Modes", or software products they sell as services to clients. All of the various Modes have their own logos, based off of the main DevMode logo type.

div.b div.b_top { background: #dc484b; } div.b div.b_bot { background: #dc484b; } div.g { background: #dc484b; }

Interactive

Milwaukee Art Museum Lab Voting Kiosk

The Milwaukee Art Museum wanted an interactive voting kiosk for the opening of their new Kohl's Education Center. This Kiosk allows patrons to vote for their favorite works and is the result of a collaboration with the education staff of MAM. It includes five touchscreen displays for the patron voting as well as a large results screen showing the most recently selected works and the current top 20 works in the voting tally with live updates.

The entire kiosk is an HTML5 web app running on Google App Engine in Chrome browser. Animations are done via CSS Transforms and almost 200 works are pulled randomly from a selection of MAM's permanent collection.

In-gallery photos by John R. Glembin.
Google App Engine development by Gumption, LLC.

div.b div.b_top { background: #f26fa5; } div.b div.b_bot { background: #f26fa5; } div.g { background: #00b2e7; }

Interactive

Bistro Timeline

The Bistro Timeline is an interactive date-driven timeline on the history of projects produced by the Bistro group. The timeline is built purely by data and expands appropriately with every passing day. Developed for both desktop and tablet.