Lean UX, wireframing, low and high-fidelity prototyping
Qualitative Research (Usability Testing, Diary Studies, Focus Groups, User Interviews), Quantitative Research (A/B Testing, Five-Second Testing, Surveys), Competitive Research, Market Research, Brand Research, Card Sorting
UX Researcher, UX/UI Designer, UX/UI Lead, Visual Designer, Interaction Designer, Logo Designer, UX Strategist, Interviewer,
Pen and paper, OmniGraffle: Process Flow, Wireframe
Sketch App: UX / UI Design, Logo Design, Map Design, Documentation
Invision App: Rapid Prototyping
Adobe Photoshop: Visual Design
Zeplin: Engineering Handover
Insights & Discovery
Every season partners were invited to showroom for 1-2 days in sell in period (2 weeks) to observe sample products for future seasons. Nike.net B2B tool that we designed for laptop usage was being used to create their assortments and order. Every season sales team and partners were complaining about some technical & business related problems and we were trying to fix individually to save the day. But complaints are not finished. Therefore, we set up a team to understand what is the real problem.
Building a Team
The initiative created awareness; therefore with the help of sales director a cross-functional team was being recruited to move faster. productive and to keep everyone focused:
– Sr. UX/UI Designer (Me)
– Sales Director
– Finance Director
– DGTM Manager
– Operations/Logistics Manager
– Category Manager
– Sales Executive x2
– Sr. Software Engineer
Focus Group Sessions
We’ve conducted focus group sessions with both sales executives and partners individually to pinpoint current frictions in order to define the real problem.
- Where is the sample in the showroom?
- %5 of samples are lost.
- Checking the differentiation excel list of products to find out drop / carry over products takes so much time.
- Is this product offered to my client?
- Where is the sample in the showroom?
- Is this product offered to us?
- Can I get paper to write down my wish list of products?
- Limited amount of sell in time in showroom to decide which product to purchase.
Defining the Problem
With data that we gathered from sales executives and partners and structured discussions that include HMWs on white-boarding and voting with the team, we defined the problem statement as this:
Our current product was designed to be showcase all future products so partners can learn about the products and place orders for future sell-in for employee. We have observed by doing field studies, user surveys and focus group sessions that digital product doesn’t show availability of samples and is not available on mobile. Because of the limited fixture on showroom, sales executives and partners spend so much time on trying to find missing samples and creating orders templates.
How might we improve/design our B2B future sell in process in our showroom to create seamless experience?
Research, Evolution and Strategy
Finding the Convenient Solution
We decided to create a mobile app that helps to locate desired product in our showroom instantly while creating shopping lists.
Because of the strategical release restrictions of the Nike.net tool, designing a mobile version of the application is not really the option; unless we want to wait for another 2 years. Therefore creating a mobile app where data can be shared easily with Nike.net was the best option. With this mobile app, it was going to be very easy to implement this feature to mobile version of the product when it is ready.
Therefore designing the new application in a way that helps to locate desired product in our showroom instantly while creating shopping lists was the main goal of the application.
Defining the Personas
To create an optimal mobile application, we had to decide the user personas that are going to use the application. From the research that we’ve conducted at the beginning of the process we decided to create an app for our customers and account executives.
Competitive & Market Research
In addition to user research, we’ve conducted competitive research to find out what’s going on the market and how can we be one step ahead related with our product in order to create premium Nike experience with our users. We did research on all B2C sales applications of Adidas, Reebok, Under Armour, Zara, Burberry, Farfetch and many more as well as B2B applications like Shopify, Woocomerce. Since we already designed Nike.net, we already had a clear idea about the application, on the other hand research helped us to broaden our horizon.
To create a tool that satisfies all users need, we’ve performed various numbers of focus groups, interviews and surveys with the sales executives and partners. After gathering the information, I’ve conducted design thinking workshops with the core team to define the strategy and requirements of the mobile application. With card sorting, voting and prioritization we defined information architecture of the application and decide what’s most important features to finish for MVP.
- Search, filter and QR scan functionality that helps to user to find the desired product.
- Create and export functionality for wish lists.
- Multiple language option for all countries.
- Product information page that includes name, code, category, gender, season, channel, sample availability, carry over and drop information.
- Showcase functionality to put forward seasonal stories.
PLANNING & MANAGEMENT
AGILE PROJECT MANAGEMENT
We divided functionalities of the mobile application in several design sprints with backlog prioritisation. Daily stands ups, bi-weekly sprint plannings, weekly refinement and design review sessions are set by scrum master with selective design and development team along with core team.
SKETCHING & WIREFRAMING
It was very important to create wireframes of the application for visualisation and UX strategy. I designed various numbers of sketches and wireframes to give clear insights to the team along with high-fidelity mock ups.
Even though personas of the users are decided, one thing was certain that all of the users are Nike users; therefore application should represent the brand guidelines perfectly. To achieve this challenge, I did comprehensive research while working with our brand team on other Nike applications like NRC, NTC, SNKRS APP and NIKE.COM to create pixel perfect experience from font to the other UI components.
Since the app is planned to be used by only customers and inner employees, alternations for onbarding screen were needed. One of our goal was to speed up the sell in process by saving time for our users, therefore we decided to limit the log in process with only email credentials of the user that is matched with their store code in the system.
Because of the future product sell in process, the application needed be accessible to only the user personas. As a result of this, we restricted the usage of the application within our company network system. In order to use the application, one must be in company and user credential should matched with the store code in the database.
Learnings from Testing
Conducting “Usability testing”, “Diary studies”, “Five-Second testing” and “A/B testing” sessions with users before the development really helped us to improve the user experience. In sessions, we found out that product details information is unnecessary for users, it allocates so much space and restricts users to see essential codes of the product like division, category, segment. For same reason, product photo sizes are minimised to optimum as well.
Name & Visuals
Along with the company strategy, our aim was to create a digital experience; hence the application was going to be used for future season products, we decided the name the product Nike Future Experience.
In order to create futuristic onboarding for application, I worked closely with our brand team to find the right visuals. At the end, I decided to use Spring 2019 Nike Tech Pack Collection visuals to give the out of the world feeling to the users.
The color look of futuristic Tech Pack Collection and neo-noir science fiction movies were the key inspirations for the colors of the application. As a fan of neo-noir science fiction, my first thoughts were the neon colors; as a result of this Navy Blue and Noir Green were chosen the represent the future experience. Far Purple was chosen as a secondary neon color in case of any addition to be added to the NFX for further releases.
Navigation & Iconography
It was very important to create brand way, user friendly and simple menu bar for smooth navigation through mobile app. To achieve this challenge, with the help of the process flow diagrams that I created before, I did comprehensive research on brand’s and competitor’s mobile applications.
Product Status Icons
Including product status information like sample availability, drop and carryover in product information page was essential. In order to create instant visibility to the users, designing vivid shapes and assigning color to each icon was very crucial. Therefore, I designed three icons to represent the each status.
Showcase, QR Scan, Products & Search Screens
In order to create premium experience for finding the product in showroom, I designed new and interactive showroom map with the help of the floor plan.
Continuous Challenges & Improvements
It is very important to come up with mutual solutions with developers in order create feasible product. In our sprints, when developers are stuck with the design handovers, designing alternative work arounds regarding to the feedbacks is the top priority.
With the feedbacks that we receive from the users, our next step is to add recommended products functionality to the product page and improve the summary section in wish list detail page with creative and branded icons.
I would like to thank to Taglette team for their amazing work on implementing whole design to the code while making RFID technology work both in showroom and application.