oneapp7brandsoneapp7brands

An app that was designed for 7 brands owned by Landmark Group. It was the 2nd iPad app I designed but I consider it first because of its scope and scale. I worked as Co-designer with a colleague, friend, and great designer Diego Faria. We had our own territories to work on. The whole project took both of us 3 months to complete the design, we nearly touched each and every possible use case and designed 300+ screens for the app. 

ipadwithallappsipadwithallapps

Challenge

All 7 brands had their own specific business requirements. The requirement was to follow the new iOS 11 visual style and design the experience in a way that covers the navigation structure of existing iOS apps. Also, to design one architecture that can work with the needs of 7 brands and also gives access to customers to shop across 7 brands and checkout from any of them. 

My Role

I took care of the experience for Discovery (Home, departments & collections), User’s Account and Basket, and that's what I am presenting in this Case Study. My Role was to do the UX and UI for the app. In addition, I worked on the make interactions for stakeholder’s better understanding which later on helped a lot to communicate with the developers. 

Interactions:
Onboarding: https://app.atomic.io/d/prNjuf8SBgEV
Favrourites: https://app.atomic.io/d/7C4pJSJ2zh1X
Basket: https://app.atomic.io/d/LI2I7gJEccd8

Master of all

 “Splash” was chosen to lead iPad app design from the management and then I created the needful cases for each brand (wherever they required). 

masterofallmasterofall

Onboarding

One app for 7 brands, but still each of them needed their own identity. I came up with this idea to have business-specific backgrounds for each brand that can differentiate among brands as soon a user open our apps and at the same time, these backgrounds could help the businesses to keep their customers updated with their latest campaigns. 

Here are the interactions for Onboarding: https://app.atomic.io/d/prNjuf8SBgEV

onboardingscreensonboardingscreens

Architecture

We already had pretty much idea of the structure we were going to build because of the existing iOS applications. We created these wireframes to be more clear before jumping into UI Phase.

architecturearchitecture

Home

One of the requirements I was not much happy with, was to follow the homepage designs of the Websites for app homepage. I got the chance to think differently for Splash and I spent some time with it but that discussion didn’t go long. Stakeholders decided to go with the similar layout as other brands.

homepageshomepages

Collection Screens

collectionscreenscollectionscreens

User Account

We tried 2 interction approaches with My Account experience, both of them had cons and pros.

myaccount2approachesmyaccount2approaches

We mocked up few screens with the both approaches to be sure on what is best to use.

my-account-in-mockupsmy-account-in-mockups

Final Screens for Account

After the internal reviews with management final decision to go with the 2nd approach, they found it more modern, less cluttered, easy to use and the whole screen was dedicated to each action.

Here are the interactions for My Account: https://app.atomic.io/d/FtjbsKPyGRpm

myaccount screensmyaccount screens

Basket

Designing the Basket experience was fun. It has lots of different use cases in it and challenge was to design the screen less cluttered as much as possible. I designed the "Layout 1" it helped to reduce the cluttered but brands wanted to keep the basket layout consistent with the website so we finalized the "Layout 2".  

Here are the interactions for Basket: https://app.atomic.io/d/LI2I7gJEccd8

basketimagesbasketimages

Style Guide

After completing the project I created the Style guide document to communciate with developers.

Other Projects