While working at Softwebo (design agency), I was entrusted with the design of an app for Hoffmann-La Roche. It is a Swiss multinational healthcare company that operates worldwide under two divisions: Pharmaceuticals and Diagnostics. In this particular case, I was designing iPad based app, for medical representatives.

When starting to work on the project I was given a basic PowerPoint, desktop presentation, that had to be converted into a mobile format. The main aspect that had to be designed was the navigation. Users had to have quick and easy access to presentation’s table of context, as well as “medical terms” index.

After several iterations of navigation, I have decided to use the above layout as the core. First of all, navigation starts, by familiarizing the user with the possible use of swipe gestures, while suggesting the possible use of the arrow. In the next step users see four core navigation elements. What they all have in common is adaptability through continuous animations, which relate to their changing purpose, function. In other words:
What is also worth mentioning is the three dimensional aspect of the menu. In case of Roche app, it has created very clear division between being in and outside of the presentation slide, while still being able to see current position.

Another interesting element of the navigation, was very literal “burger menu”. It has allowed to follow the presentation chapters without additional division and restructuring of the menu. As a result, it is easier to follow presentation’s material, as it has been divided, in an intuitive manner.

All of the material presented has been a result of the decision process combining user data, constraints and client requirements. Below, we can see how initial sketches influenced final form of the iPad app.

Initial navigations ideas were different. I remember being split between the use of classic, left navigation, burger menu and top bar, slider menu (violet). Both were promising, but early stages of UI testing have proven me wrong. Users were more used to classic burger menu (rule of familiarity) and did not understand how sliding menu worked.

Above you can see the preview of screens that have been shipped in the final version of the app.

Overall, I consider the final design to be successful. App is easy to navigate and thus fulfilled its core task. I have most definitely learned the importance of listening to the user primarily and adjust my choices to their taste and way of thinking. After all its medical representatives that are going to use the app and no one else.