Go Native

Until recently, my role at work has been to design for responsive. Designing native apps was something new (but exciting) to me. So when at the end of 2015, a mobile app designer left the team I decided to raise my hand and take on her work. Little did I know that designing for responsive is very different vs. native apps especially when you throw iOS and Android into the mix.

Late 2015, I participated in a Hackathon. The idea that my team chose (and worked on) was creating an internal LinkedIn, where employees can connect with each other on the go. Although our idea did not win (LinkedIN released lookup at around the same time!) it was chosen as an app to be designed and released to employees this year. As I am one of the UX designers on the employee side and I wanted to work on native apps, I was tasked with designing this app for employees, a task I couldn’t wait to sink my teeth into.

I started by utilizing the work done at the hackathon and researching similar to get a sense of what some possible design combinations may look like. In addition, I had user stories from the product owner that I needed to incorporate so that was a consideration in design.

My first design (wireframes) was iOS focused which meant incorporating the bottom navigation into the app. The design worked well on iOS and received positive feedback from employees that looked and interacted with the app (via a clickable prototype). When designs were presented to the stakeholders however, there was one small detail that was left out; Android.

Android vs. iOS can be quite different. For starters, droid has a physical back button. In addition, droid doesn’t use a bottom navigation element, it tends to rely on a hamburger or top navigation. These surfaced as some of the more common aspects of droid design, ones that I missed because I was iOS focused as I am an iPhone user.

To understand Android vs. iOS and avoid creating two sets of designs, I did some quick desk research by comparing various apps in both devices. In addition, I read blogs about iOS vs. Android and got up to speed on material design. This quick research helped me develop a design that worked for both platforms. The result? I removed the bottom navigation from the app and added a

hamburger instead. In addition, I added the back button for iOS where necessary but made a note to the developer to not add a back button to the app when building for Android. In addition, confirmation/action specific screens had to be designed for both platforms. This design decision enabled the app to truly be platform agnostic, able to be ported to either OS with ease. This design also eliminated the need to have two completely different designs while providing a consistent user experience to iOS and Android users.

My designs (wireframes) enabled developers to get a head start on building the application for both platforms. This head start will also enable gathering of feedback earlier via an alpha version; feedback that will go back into the application in order to improve the user experience. In addition, my design decisions enabled a seamless transition to a visual designer who is currently working on the visual design aspect of the project. Visual design is the last step to creating a rich and engaging user experience and once complete, the application will be ready to go into beta testing.