Organic Bloom Designer

My Roles: Back-end Architecture, UI Design
During my time at The Organic Bloom I headed up development of a tool for their clients. They needed the ability to accurately and easily design wall arrangements with the end goal being the ability to purchase an accurate, full-size hanging guide. The end result was a slick, extendable application that utilized the HTML5 canvas element extensively.

This app was to be built from scratch with no existing infrastructure to utilize. This being my first foray into JavaScript application development, I wrote and discarded a few different iterations before finally landing on a simple interface that centered around a Frame and Wall designer toolkit.

The two large toggle switches allow for easy distinction between the two modes. Slide-out menu panels make it easy for users to access the various frame options while still allowing the focus to remain on the work area.

The frames are pulled in via the existing database and the provided frame dimensions allow for the calculation of appropriate sizes.

An added drop-down allows users to easily access old projects or create new ones.

And of course, users can easily share their creations. Each share is linked to a special page that allows users to copy the shared project for their own use.

An inspiration page showcases user's shared walls as well as frame creations. Visitors can also start a project from any of the frames or wall images.