In 2011, before the flat UI aesthetic had been popularized, while Apple’s depth-heavy iOS design guidelines were still in play, we had the opportunity to work with Brit Morin to build a native iPhone app for her widely popular Brit + Co. brand. Given the site’s bright, clean aesthetic, we felt the need to extend that look to the iPhone. This meant eschewing much of the bubbly style that was standard on iOS at the time, while focusing on custom navigation and interactions to allow the brand to extend its personality into mobile.
Before beginning any hi-fi design, we'll often wireframe the overall information architecture of the product, ensuring that we identify potential interaction points before moving to more detailed work. This process goes hand in hand with our interaction design and prototyping.
The Value of Prototyping
In the design phase, we’ll often take time to prototype interactions in Adobe After Effects or Edge Animate. We find this to be a quick and easy way to identify and diagnose interaction challenges before they become problems.
Prototyping this animation was a great way to discover an easier way to trigger share actions in the app. Overall, avoiding standard iOS UI allowed the app to grow into something completely unique.
The Final Product
In the end, the result was a simple app filled with the bright, welcoming personality that Brit+Co. had already established. It earned us a Webby award nomination and pushed their brand forward on its upward trajectory.
At the time, designing without depth on iOS was fairly unexplored territory. Without ornamentation, the character of the app was dependent on its interactions - so we decided to push the current design boundaries and implement a custom navigation system.
Maintaining the feel of the already popular Brit&Co. website was a key tenet in ensuring a smooth transition of the brand from web to mobile.
The design of articles was focused primarily on readability and accessible sharing.