TheStudioCollaboration_CaseStudy_HeaderImage.png
 

BACKGROUND

Currently, both SMB and large brand retailers face imperfect information about the textile factories they work with in terms of speed, quality, and trust.

At the start of 2019, The/Studio had launched their plan of creating a new B2B-focused business model that focused on providing an on-demand supply chain platform that enabled both SMB and large brand retailers and their respective textile factories - Ecosystem. We hoped to reduce the overall pain brands face when working with textile factories.

WHAT I DID

I had full lead in designing The/Studio’s ‘Collaboration’ feature for the platform, making sure to incorporate both user and business needs.

 

ROLE, RESPONSIBILITIES, & DURATION

Lead Product Designer | The/Studio
B2B Web Dashboard
User Research, Interaction, Visual design, Prototyping & UserTesting

December 2018 - May 2019

 
TheStudioCollaboration_CaseStudy_Problem.png
 

User Research:

This process relied heavily on the ability to understand the user needs on both sides of the supply chain. For retailers, in one single ‘style’ project, various team members with distinct roles are involved in the process. To add onto complexity, these roles vary if the retail is considered a SMB or large brand retailer. The same scenario exists for the factory side. 

Together with my co-Product Designer who was tasked to design out other features in the platform, we interviewed various people in the supply chain through a series of formal to informal webcam user interviews.  

USER RESEARCH GOALS

  1. Understand the current workflow and pain points

  2. Understand the roles and responsibilities of members at each level

  3. Be informed of the tasks that needed to be accomplished at each level

  4. Establish how our ‘Collaboration’ platform provides a real solution

 
 

A screenshot of a user interview discussion - trying to understand the complexities of a clothing review session

 
 

Journey Map:

Through several interviews, it was clear that different users from brands and factory side would use the platform differently to accomplish their tasks.

To provide our team and additional stakeholders with more visibility, we created a user journey map of the supply chain.

JOURNEY MAP GOALS

  1. Understand the full flow textile manufacturing supply chain

  2. Create a map of every role’s responsibilities and tasks - our personas

  3. Guided our feature ideation so that we can provide a true solution to their pain point areas

JOURNEY MAP INSIGHTS

We discovered that the general development cycle consisted of three phases: development, sampling, and a production.

 
 

Setting a Base Design System:

Since the The/Studio Enterprise project encompassed several different features being designed and iterated at once between my co-Product Designer and I, setting a base design system was essential to mitigate design inconsistencies in our platform.

My design system case study can be found here.

Ideations and User Testing:

I proceeded to make a series of sketches and low fidelity wire frames to show my initial ideas for different use cases for Collaboration. I set initial prototypes within Figma and set up additional interviews for user testing purposes. Once I had positive reactions to my designs, I started making high fidelity designs.

USER TESTING GOALS

  1. Test usability of new ‘Collaboration’ flow that encompasses steps for a users to go through sampling and production phase tasks

  2. Test discoverability of the ‘one-click response’ function

  3. Learn user behavior and correct assumptions about flow

Communication Process:

The whole process of communication I had with the VP of Product and our team of remote engineers was a very close collaborative process. Every week, whenever I had initial designs ready to be reviewed, I provided either low to high fidelity mocks and iterated on feedback from the engineering team. This was very important to me because I wanted to understand if there was any constraints or edge cases I needed to be aware of and understand the ‘must haves’ vs. ‘nice to have’ and what should be considered a fast follow.

COMMUNICATION GOALS

  1. Understanding of both sides of engineer constraints that might affect design and adjust accordingly

  2. Have another opinion into the design

  3. Understand must haves vs. nice to have and how that affects the MVP

 
 
 
 

Working with Engineering and Delivery

To help engineers better understand the flow of communication, I created series of rules and specification documentation to help with the process ontop of Zeplin and JIRA notes.

  1. Collaboration Specifications: After doing an initial visual QA, I noticed a series of design inconsistencies once design was implemented. I created a specification key to note font sizes, specific hex codes, and padding for each area of ‘Collaboration’. This helped a lot in the next implementation.

  2. Status Key: The other half of ‘Collaboration’ involved status updates for both sides of the supply chain. These global updates happened in two parts - within notification dropdown and within ‘Collaboration’. I created a key with explanation on which status activated at what of the process.

 
 
 
TheStudioCollaboration_CaseStudy_Solution.png
 

Communicate, view project details, and assign tasks easily


With ‘Collaboration’, brand members can easily coordinate tasks to their respective teammates with build in one-click responses and built-in actions.

Brand members can also view their order summary pages easily from this access point.

 
 

Easily approve or requests edits for sample fits


After receiving a sample review requests from the respective factory, easily approve or requests edits in our built-in approval application.

Users can easily select reasons for edits, add/edit notes, and upload more images to give factories more direction.

 
 

A quick and easy way for brands and factories to communicate on pricing quotes


Catering to both sides of the supply chain, brands and factories can communicate easily to view production request orders, set, and review production quotes.

As an added feature from requests, factories can set pricing breaks so brands can see all options to get more bang for their buck.

 
 
 

Mobile Friendly

Our platform needed to be mobile friendly. Depending on the complexity of the functions, custom modules were created on mobile and handed over to development.

 

Learnings and Outcomes

This project really helped me learn the importance of prioritizing, setting simplicity, and seeking feedback early.

Together, my co-Product Designer and Product Manager set out a strategic launch plan over the course of 2019. To meet our launch goals, we had to balance having top user experience needs with business goals and designed out the must haves and decided what can be pushed out for later iterations. However, delivering a quality product was our top priority through this project. In addition, taking in feedback from all types of users and keeping stakeholders in the loop was an essential part of the process. Every user interview and testing session provided valuable feedback that corrected our assumptions and ultimately saved our time and effort.

We launched Ecosystem and provided access to the MVP version of The/Studio Enterprise software in May 2019. The/Studio currently has two beta-testers who have confirmed to be on our Enterprise plan to help us iterate and ultimately begin the process tailoring the platform to better their custom needs.