Portfolio Category ArchivesIdentity

Stack Lighting

Stack Hero Image

About

While working with the amazing team at Octopus Creative, I took the lead in designing the identity, web presence and iOS app for Stack Lighting.

A little about Stack Lighting: As the world’s first responsive lightbulb, each Stack light contains an embedded sensor that allows it to intelligently respond to the surrounding world.

Brand Identity

Stack Logo

Stack Lighting is more than just a bulb, it’s a customizable network of lights that you build to suit your needs. Hence the work “stack” and the imagery to support the idea of stacking components on top of one another.

Logo Placement

Stack Logo on Product

Here is an example of their initial product with logo placement.

Unused Logo Marks

Stack Alternate Marks

There were so many good alternate logo marks that I couldn’t resist showing them. While we are more than happy with the final design, there were a couple that I might have been a bit too attached to.

Marketing Site Overview

Stack Website Overview

Along with the identity for Stack Lighting, we designed a marketing site where users can learn more about a day in the life with “Alba”, place preorders, and stay up-to-date on the latest news from the company.

If you would like to check out some of the animations and other portions of the site, you can visit them at their website: Stack Lighting

Please note, now that this is has been released, what you see live might not match what I have here.

Marketing Site Illustrations

Marketing Site Illustrations

These are some of the custom illustrations that were created to highlight four of the key features of the product.

iOS App

My pride and joy in this project was being able to work with the team at Stack and help bring their product to life in the mobile app. This has honestly been one of the more challenging app builds I have done. Their product (behind the scenes) is rather complex and has an overwhelming amount of user features.

Since we were working with a startup who needed to hit a hard deadline, in order to present at Tech Crunch Disrupt, I did not have time to user test these designs outside of our immediate circles. I was able to create a fully tappable prototype with Invision App, which we used as the basis for our in-house testing.

iOS Wireframes

iOS Wireframes

Due to the complexity of this app, clearly understanding what I was creating was vitally important. Most of the architecting phase was spent building out detailed wireframes (as seen above).

Once the wireframes start to become coherent, I then began placing them into annotated user flow document for the clients review.

User Flows

Stack User Flows

Here is an example page from the user flow document. Each major function in the app is broken out into it’s own page and basic functions are annotated below their associated screen. The client can then cross reference this with their spec doc and answer any questions I have outlined in the doc.

iOS App Overview

iOS App Overview

Now that the app has made it past all of the major wireframe reviews, it’s time to start fleshing it out. Every wireframe gets a coat of paint and is then placed into a tappable prototype. If there are any questions on the functionality, the user flow has been updated to show the mockups so the client can easily cross reference the document.

Final Thoughts

Taking someones idea, and building out complete product from it, is one of the most rewarding things I can experience as a Product Designer. Sometimes it might feel a little overwhelming with all of the stages involved. But the thrill of seeing it slowly come to life and then end up in the hands of the users is more than worth the effort.

It’s also pretty awesome to see your work up on the stage at events like Tech Crunch Disrupt and then slowly make it’s way into blogs that I read on a daily basis.

So, if you had to ask me what I do for a living, this would just about answer it.

AmpLynx

Amplynx Web App and Mobile App

About

AmpLynx, while still in beta, is a startup focusing on innovative ways to distribute content. The offering is currently focused on music distribution, but it’s ultimate goal is to encompass all media.

I was approached in the initial stage to help create a brand for AmpLynx and then see the idea into production by creating wires, mocks, illustrations, and working with dev’s to implement the designs.

Logo Design

Amplynx Logo

Homepage Overview

Amplynx Homepage

Homepage Details, Card Sorting

Amplynx Homepage

Homepage Details, Illustrations

Amplynx Homepage

Content Filtering

Amplynx Content Filtering

Track Previewing

Amplynx Track Previewing

Uploading Confirmation

Amplynx Uploading

Sample Portion of the UI Style Guide

Amplynx Styleguide