Northern Vessel

UI | Branding

Photo by Lucas Leeland

UI Design Overview

Northern Vessel has big plans for Des Moines. They are looking to develop a mobile application for their clientele that makes ordering coffee easy, whether it be for pickup, delivery, or catering. To do this, they need to show potential investors exactly how they are going to succeed. They asked me to create UI comps of what their mobile application could look like that they can include in their investment pitch. They gave me a list of functions they want the app to perform, but the design and the user flow was left to my discretion.

 

I used the brand colors and typeface that have already been established for them and used a menu and sub-menu system for quick and easy navigation. I followed Human Interface guidelines to the best of my knowledge because I was designing the comps on an iPhone mockup.

UI Comps
Brand Marks Overview

Northern Vessel brought me in to create a more cohesive brand for them. They already had a combination brand mark and a letter mark in the NV but needed a set of sub-brand marks. They were looking to section out the company and wanted each facet to have its own branding underneath the Northern Vessel umbrella. I created both sub-brand marks for Fleet and Coast, their delivery service and coffee cart, respectively. Northern Vessel requested a very clean, contemporary, and somewhat elegant aesthetic out of the marks. I designed each mark with future expansion in mind, making sure to adhere to a cohesive system as I went. The elements that create the abstract marks in each sub-brand mark were taken from the main NV letter mark and made to be much lighter in weight, then rearranged to create the marks.

 

Once those were complete, I asked Northern Vessel if they would allow me to re-design their combination mark. I picked a new typeface that better matched the existing letter mark and paid close attention to the kerning and padding between the elements to create a clean and balanced lockup.

Ideation

These digital sketches are a sample of how I arrived to the final form of the Fleet mark. This shows how the elements in the NV mark were used to create the final shape.

Final Sub-Brand Marks
Final Main Brand Marks