The Challenge

With Apple’s announcement of the SlideOver and SplitScreen features in iOS 11 for iPad, and the premise of a soon to be filled App Store with dozens of similar apps, I had to swiftly envision an intuitive and beautiful user interface.

My Approach

After getting the design brief from Matthew Bischoff, Partner at Lickability, I designed wireframes to get a feel of the overall structure of the app. After getting the approval on the wireframes, I moved to designing the user interface.

Iterate, iterate, iterate

A crucial aspect of the UI are the file icons. These little squares are dynamic spaces where we can display a little preview of the file (this being a later addition) or simply show a placeholder icon. Since most of the UI has been kept clean and subdued in style, this was the first thing I started working on. Over the course of 2-3 weeks, I created a total of 4 high-fidelity icon sets.

The first version I created featured a very bold color palette and some depth here and there to make them pop on the dark background of the app. While attractive, the flaws of this iteration were that the icons were too small.

So, for the second iteration, I made the icons quite a bit bigger. This allowed us to include the file extension and, if available, a preview of the contents of the file. The generic icon set was expanded with alternate icons for different files. Still, the main style of the icons was just a bit too reminiscent of app icons you’d see on an Android device. This was a no-go for the team and, in hindsight, a valid point of critique.

For version 3, I experimented with a more muted color palette as well as less rounded corners on the base of the icons. Making the corners less rounded allowed for more space when there was a preview available. This round came a lot closer to what we ultimately settled on, but we still weren’t convinced of both the color palette as well as the overall roundness of the icons.

For the final version, I opted for a more flat approach and a further reduction in color saturation. This gave the app a more professional look which, in the end, suited the target market. A bit better.

Result

In the end, Lickability made the decision not to release the app on the App Store due to limited resources. For me, however, this was quite a successful project due to the fact that I had a limited amount of time. In about 6 weeks time, I created a full-fledged UI that could support SplitScreen, SlideOver, portrait, and landscape modes while, at the same, is pleasant to use and look at.