Namshi

Based in Dubai, is an online e-commerce site offering footwear and apparel fashion brands.

Project Goals & Tasks

Namshi, is a well-established brand in Arabian countries was using only the website as the main source for its market, both for desktop and mobile devices. It needed to change with a specifically tailored application for each of both markets: iOS and Android.

Set up and my role

I had the chance to work closely with iOS and Android developers. Based on the communication with the stakeholders, I had the role of creating the design for both native mobile applications, and to provide high-quality assets and documentation for developers. 

Solutions

In result, we ended up with fully working applications that increased the revenue and customer satisfaction.

 

User Flow

To fully understand how the user will navigate a detailed user flow was created specifically to showcase that.

Wireframes

The second step was to create the wireframes which would determine the needed screens as well as the information to be displayed in it. This step included many iterations and as a living system it had changes in the production stage and it still continues to change.

iOS

With many iterations and versions, iOS was first to be released. You can see the current application in App Store. Below are some mockups, but not all of them ended up in the application.

Animations and Microinteractions

To delight the user, to keep connection, to show flow come in hand microinteractions. These subtle details unnoticed from the start give life to static elements. Pixate was a great tool which I have used to create the animations, both as a showcase and detailed specifications for developers. 

Product List to Product Details

As a part of the job, I had to do microinteractions. In this example, the goal is to have a meaningful transition from the list to the specific product. One of the challenges was to mimic instant loading of a bigger picture, solved with enlarging the smaller picture from the list and replacing it with high resolution one ones it's available.

Product Details Scroll

To have a pleasing experience reviewing the information of the product, a smooth parallax scrolling was added. The challenge was what to keep always visible to avoid multi-layering, therefore the screen was split into 3 parts and header with the footer stayed always fixed. 

 

Apple Watch

When the mobile application was ready it didn't have to stop there, the market of wearables was emerging and as a real shopper, of course, you want to be always up to date with newest trends and collections.

Apple TV

Was more like an experiment of what can be done and how it will look, it got never been implemented, though it was interesting to explore new mediums for displaying design.

Android

Still mobile, but different

Since iOS was a front-runner, Android had to catch up. Even some would think that design for mobile was already done, for us was very important to provide the user an application which follows the native OS paradigms and is easy to use and familiar for its user. Here came in hand Material design Guidelines with very well explained and detailed information about it.

Challenges

• One of the challenges was to create a design for the right-to-left reading application. It is open minding and giving you a different perspective on your design.

• Provide an application which works flawlessly and everybody will use it as it's intended to.

• Work fast and provide a design for both platforms in parallel. 

Learnings

• Both Android and iOS have a good support for flipping the content to right-to-left.

• Test as much as possible, you'll be surprised how many things you found in your application that you didn't think before.

• Communication and working closely with developers brings many benefits, one of which is cutting time of significant changes.

•    •    •

Check other projects

Copyright © All rights reserved.
Using Format