Thank you!
ArtScape
A comprehensive art e-learning platform for young art enthusiasts with freemium membership
About Kala
Kala is a B2B PaaS solution that powers online marketplaces and brand sites to sell products from local retailers, getting products to shoppers faster with Buy Online, Pickup In-Store (BOPIS) or fast local delivery, thus increasing these marketplaces and sellers’ revenue. Kala’s ecosystem is illustrated in the photo to the right.
Our project brief with Kala’s owners helped define the project scope - design Kala’s Marketplace Management web portal. Marketplace stakeholders are end-users who sign up to enroll and manage sellers, product listings, and access interactive reporting dashboards. The key functions of Kala’s Marketplace Management Portal include:
Account Management (including enrollment and integration, and account editing)
Product Management
Seller Management
Reporting and Analytics
Kala’s ecosystem
Existing Design of Other Kala Platforms
Kala has existing designs of their Seller Portal and customer-facing screens. The brand identity is already established and the company kindly provided us with digital assets to aid in maintaining cohesiveness across Kala’s platforms. An existing style guide was also provided, necessary in knowing our design constraints.
Understanding the Problem
UX Designer | Researcher
Competitive Analysis
User Stories
Wireframing (Lo-Fi & Hi-Fi)
Prototyping
Presentation
My Role & Contribution
5 weeks
March 14-April 18, 2023
Duration
Yingyang Zhou UX Designer
Blake Burnett UX Designer
Michael Baisa UX Designer
Team
Project Scope
Kala’s Marketplace Management Portal which includes:
Registration and Integrations
Reports and Analytics
Seller Management and
Product Management screens
The Problem
Marketplace Management Portals present a complex array of information to users. One of the significant challenges in designing these portals is simplifying this information, making it easier for users to understand and act upon. Another challenge is the onboarding experience, which can be complicated and time-consuming for marketplace operators. Furthermore, once the onboarding process is complete, the learning curve for using these portals can be steep, making it difficult for users to get the most out of their features.
The Challenge
We faced a formidable challenge of designing the entire web portal, which included registration screens, within a tight timeline. Given the vast scope of the project, we tackled the challenge by categorizing the work, while ensuring that the end product would remain cohesive. Despite the time constraints, we meticulously iterated on the designs based on valuable feedback from Kala’s owners. Although the 5-week schedule did not allow for user testing, we remained focused on delivering a high-quality solution.
A B2B PaaS solution that empowers marketplace operators the ability to offer local product sales, deliver products to the customer faster through BOPIS (buy online pickup in-store) or fast local delivery
Strengthening communities by increasing sales from local stores
A B2B PaaS solution that empowers marketplace operators the ability to offer local product sales, deliver products to the customer faster through BOPIS (buy online pickup in-store) or fast local delivery
Strengthening communities by increasing sales from local stores
Secondary Research | Competitor Analysis | User Stories | Information Architecture | Wireframing | Prototyping | Collaboration
UX Designer | Researcher
Competitive Analysis
User Stories
Wireframing (Lo-Fi & Hi-Fi)
Prototyping
Presentation
My Role & Contribution
5 weeks
March 14-April 18, 2023
Duration
Yingyang Zhou UX Designer
Blake Burnett UX Designer
Michael Baisa UX Designer
Team
Project Scope
Kala’s Marketplace Management Portal which includes:
Registration and Integrations
Reports and Analytics
Seller Management and
Product Management screens
Project Timeline
Overview
The Problem
Marketplace Management Portals present a complex array of information to users. One of the significant challenges in designing these portals is simplifying this information, making it easier for users to understand and act upon. Another challenge is the onboarding experience, which can be complicated and time-consuming for marketplace operators. Furthermore, once the onboarding process is complete, the learning curve for using these portals can be steep, making it difficult for users to get the most out of their features.
The Challenge
We faced a formidable challenge of designing the entire web portal, which included registration screens, within a tight timeline. Given the vast scope of the project, we tackled the challenge by categorizing the work, while ensuring that the end product would remain cohesive. Despite the time constraints, we meticulously iterated on the designs based on valuable feedback from Kala’s owners. Although the 5-week schedule did not allow for user testing, we remained focused on delivering a high-quality solution.
Solution Overview
Enrollment & Integrations. The enrollment process provides a seamless onboarding experience which incorporates clear and concise forms and progress indicators so users can track their advancement and feel confident that they are making headway towards completion. To ensure that the onboarding process is not overwhelming, we have included an option for users to skip certain sections that they can complete at a later time.
Web Portal Screens. Kala’s web portal screens has a carefully crafted layout that simplifies the presentation of complex data. Through our user-centric approach, we have developed an intuitive design that enables users to easily grasp the information presented to them. To maximize screen real estate, we have incorporated a collapsible navigation bar that provides a sleek and clutter-free interface. This allows users to focus more on the content of the page, improving their overall experience.
The Process
Competitive Analysis
By conducting a comprehensive competitive analysis, we gained a deeper understanding of Kala's platform by analyzing its competitors' products. This allowed us to identify their strengths and weaknesses, and gain valuable insights that informed the development of a better user experience. While some of these platforms may not be Kala’s direct competitors, they offer similar solutions to the same target market. It is worth noting that the competitive analysis presented below provides only general information about their products and not their platforms' usability. Despite the challenge of limited access to these platforms, our team was able to conduct a thorough analysis by studying their screens from demo videos, ensuring that we were equipped with the necessary knowledge to develop Kala’s platform.
Kala has opportunities to stand out from these competitors as outlined below:
Since we didn’t have access to competitors’ platforms, I researched user reviews of these platforms. ChannelAdvisor and Zentail are Kala’s direct competitors and this is a summary of user paint points from which Kala can learn from:
Defining the Problem
Scope of the Problem
The scope of Kala’s Marketplace Management Portal is best described by the Information Architecture we created. The portal is designed to provide 5 core functions - Seller Management, Product Management, Account Management, Order Management and Reporting & Analytics. We also incorporated a Landing Page or Dashboard as one of the functional requirements of the portal. Working closely with Kala’s owners, we proceeded to design the first four functions, including the Landing Page. I took charge of designing the Enrollment and Integrations part of the Account Management category and the Product Management screens.
Kala’s Marketplace Management information architecture
User Flow - Enrollment and Integrations
The registration flow contains a multi-step process with sections for: Business Information, Contact Information, Policies, Commission Structure, Authorized Selling Locations, Notification Options, User Management, Terms of Service, Integrations and Systems. Creating a user flow helped me visualize the steps users take and anticipate potential pain points or obstacles that could arise in the user journey.
Enrolment and Integrations initial user flow. This first user flow is a linear process where users need to complete steps in succession.
I raised a concern about the potential issue of users feeling overwhelmed during the registration process due to the extensive amount of information required. This could be exacerbated by the user's lack of necessary information or their limited decision-making authority. As a solution, we proposed a non-linear process that allows users to complete certain steps at a later time. The only mandatory steps in the process are providing essential information such as Business Information and agreeing to Kala’s Terms of Service, enabling users to start using the portal immediately. Kala’s owners were in agreement with this approach.
Revised user flow. This revised user flow allows users to complete some parts of the registration process at a later time to reduce frustration and avoid abandonment of the registration process.
User Stories
User Stories are an indispensable tool in the design process as they ensure that the design is centered on meeting the users' needs and goals. By providing valuable context, prioritizing features, aiding in collaboration, and promoting empathy, user stories play a crucial role in delivering a seamless user experience.
In developing Kala's Marketplace Management Portal, we leveraged user stories to focus on the tasks that users need to complete to achieve their goals while using the portal. Although we didn't have sufficient information to develop User Personas, we were able to understand Kala's target users, which helped us create general user stories. Kala's target market comprises businesses of all sizes, ranging from startups to large enterprises, and we identified Marketplace Owners/Administrators and Marketplace Managers as the primary users of the platform.
We developed User Stories not just for the Registration and Integration process but also for the main functions of the portal, ensuring that all aspects of the platform were geared towards meeting the needs of the users. You can find the entire User Stories document by following the link provided.
While these user stories could be broken down further into more specific stories, the time constraints we faced limited us to creating general epics. Nonetheless, we were able to provide valuable context that helped us better understand the users' goals at every step of the process.
Design Considerations
In architecture, finding innovative ways to solve problems is critical, but it's equally important to consider the established methods in the industry to create functional, efficient, and aesthetically pleasing designs. I applied the same approach to the design process of Kala's marketplace management platform, taking cues from other platforms' onboarding processes to understand the principles that would work best for Kala.
Through my research, I identified several key considerations that were instrumental in creating a successful onboarding process for Kala's platform, including:
Simplifying the process
Collecting only essential information
Providing feedback and status updates by visual cues
Breaking down the process into manageable chunks
Using clear and concise language
Testing the user experience
Simplify the process
Break down the process into manageable chunks
Provide feedback and status updates by using visual cues
Test the user experience
Collect only essential information
Use clear and concise language
Ideate
Registration - Sketches and Wireframes
After creating initial rough sketches of the registration screens, I progressed to medium-fidelity wireframes to solicit feedback from Kala's owners. At this stage of the process, we required additional clarification regarding the registration process steps and portal red routes. To maintain UI consistency with other Kala platforms (such as the Seller Portal and customer-facing screens), we employed assets from those designs. The placement of the navigation bar on the left side allows users to quickly locate their position within the registration process, with instructions located on the right side of the screen. Instead of a progress bar, a status statement (e.g., "Step 1 of 9") is included to indicate progress. I iterated on the wireframes twice after receiving feedback from the client on two separate occasions.
Marketplace Management Portal Wireframes
Designing screens for a platform that involves a large amount of data can be challenging, as it requires balancing complexity and simplicity to ensure a seamless user experience. In the case of Kala's portal wireframes, we faced this challenge and went through two rounds of feedback from Kala's owners. During this process, we collaborated closely with the owners to determine which data and information should be included, making changes as necessary to ensure a clear and intuitive design.
Prototype
Style Guide
To ensure consistency and maintain Kala’s brand identity, we expanded upon the style guide developed by the previous team and created a comprehensive library of components specifically for this portal. Our goal was to establish a cohesive and visually appealing design that aligns with Kala’s branding.
We paid attention to every detail, from typography to color scheme, to ensure that the components we created were consistent with the established brand guidelines. By doing so, we aimed to provide a seamless and consistent experience for the users, while also adding our own touch to the overall design.
Enrolment and Integrations Prototype
Notable details in the design of the Enrolment and Integrations process include the following:
Navigation Bar: To ensure that users are aware of their progress, a navigation bar highlights the current section they are on. Completed sections have a green check mark icon, while uncompleted sections have a warning icon, reminding users to finish them at a later time.
Error, Success and Warning States: Input forms were designed with different states to prompt users if data was successfully added, or if there are errors in the format of the data they provided.
Manageable Chunks: To avoid overwhelming users, the entire process was divided into manageable chunks, with simplified parts. Wording and text in the heading and instructions were carefully crafted with Kala’s owners to ensure clarity and simplicity.
Progress Indicator: A progress indicator, such as "Step 1 of 9", was included at the top right of every page.
Selections: Pills and radio buttons were used for sections with selections to make it easier for users.
'Buy Local' Template Selection: Unique to Kala, the 'Buy Local' template selection was designed with clickable photos to provide users with a clear idea of what they are selecting.
Interact with Prototype here.
Kala’s Enrolment and Integration process
Marketplace Management Portal
The design of the Marketplace Management Portal boasts several noteworthy details, such as:
Collapsible Navigation Bar: In order to maximize the display area for data, we implemented a collapsible navigation bar, enabling users to focus more on the screen data.
Intuitive filter systems: Given the vast amount of data (e.g., product listings, seller management, order management), it was crucial to establish filter systems that are specific enough to help users locate the information they require.
Infographics: The presentation of summary data was carefully designed to ensure that users can filter data by various topics, dates, and more. We collaborated extensively with Kala's owners to ensure that the design meets their needs.
Buy Local reports and analytics: Our team member created an interactive map that facilitates navigation to selling locations and provides valuable insights on their status and data. This design is data-rich and highly informative, empowering marketplace users to make informed business decisions.
Interact with Prototype here.
Testing and Iteration
Throughout the design process, we placed great emphasis on gathering feedback from Kala's owners to ensure that their expectations were met. We carefully incorporated their insights and suggestions over the course of three rounds of review to refine and improve our design. While it was agreed that usability testing would be a valuable step in validating our decisions, the project timeline unfortunately did not allow for it. Nevertheless, the scope of this project required extensive communication and collaboration with Kala’s owners to gain a deep understanding of the product they aim to launch. The owners mainly commented on the content of the screens - the choice of words and the desired layout. Here are some of the screens after three rounds of feedback:
Key Takeaways
Communication and Collaboration. I learned the importance of effective communication and collaboration. By asking questions and seeking clarifications, I was able to gain a deeper understanding of the problem, and Kala's responsive and cooperative owners made the process much easier.
The Power of Design Tools. I also discovered the value of collaborative tools in streamlining our workflow and making our work more efficient. In particular, I found that learning and utilizing design tools like Figma's auto-layout, styles, and component libraries allowed us to produce more consistent work in a shorter amount of time. I also appreciated the ability to communicate within the tools, which helped to keep our team in sync.
Understanding the Problem and Research. I gained a newfound appreciation for the importance of research and understanding the problem. Although Kala's industry was unfamiliar to me, I found it both fun and exciting to learn about B2B PaaS solutions through the research we conducted. By taking the time to gain a deeper understanding of the problem, we were able to create a better product that met Kala's needs.
Moving Forward
Ideally, the next phase of the project will involve preparing for user testing, which includes writing the test script, selecting and recruiting participants, and scheduling the test sessions. The testing phase itself will involve observing actual users interact with the portal and gathering feedback to validate design decisions and identify areas for improvement. Based on the insights gained from user testing, the designs will be iterated and refined to optimize the user experience and ensure maximum usability and user satisfaction. By incorporating user feedback and iterating on the designs, we can create a marketplace management portal that meets the needs of our users and provides a seamless and intuitive experience.
Marketplace Management Portal
Thank you!
Other case studies
Secondary Research
In our quest to better understand Kala's Marketplace Management platform, we left no stone unturned in gathering data from a variety of sources. We pored over Kala's website, meticulously reviewed documents provided by Kala's owners that detailed the portal requirements, delved into articles about Kala, and combed through industry reports relevant to e-commerce marketplace operations. The information we collected from these sources allowed us to paint a comprehensive picture of how Kala's platform operates, giving us valuable insights that informed our design decisions.
Existing Design of Other Kala Platforms
Kala has existing designs of their Seller Portal and customer-facing screens. The brand identity is already established and the company kindly provided us with digital assets to aid in maintaining cohesiveness across Kala’s platforms. An existing style guide was also provided, necessary in knowing our design constraints.
Complex setup - setting up can be complex and time-consuming, requiring extensive integrations with various marketplaces and ecommerce platforms
Limited customer support: Some customers have reported that ChannelAdvisor's customer support is not always responsive or helpful, which can be frustrating when dealing with technical issues or other challenges
Steep learning curve: Learning to use ChannelAdvisor effectively can take time and effort, and some customers have reported that the platform is not very intuitive or user-friendly
Limited integrations: Zentail has a smaller number of integrations with marketplaces and ecommerce platforms compared to some other SaaS marketplace management platforms, which can be a drawback for retailers looking to sell on a wide range of platforms.
Limited reporting features: Some customers have reported that Zentail's reporting features are limited, which can make it difficult to track performance metrics and make data-driven optimizations.
Product data errors: Some customers have reported that Zentail's product data management features can lead to errors and discrepancies, which can be frustrating when trying to manage large volumes of product data across multiple marketplaces.
Limited customization options: Zentail has a more limited range of customization options compared to some other SaaS marketplace management platforms, which can be a drawback for retailers looking to tailor their listings and storefronts to their specific needs.
Kala needs an easy and simple registration and integration process
Kala’s platform needs to be intuitive and user-friendly
Kala needs to offer a wide range of platforms and other systems
Kala’s reporting features needs to be comprehensive, intuitive and easy to understand
Understanding the Problem
About Kala
Kala is a B2B PaaS solution that powers online marketplaces and brand sites to sell products from local retailers, getting products to shoppers faster with Buy Online, Pickup In-Store (BOPIS) or fast local delivery, thus increasing these marketplaces and sellers’ revenue. Kala’s ecosystem is illustrated in the photo to the right.
Our project brief with Kala’s owners helped define the project scope - design Kala’s Marketplace Management web portal. Marketplace stakeholders are end-users who sign up to enroll and manage sellers, product listings, and access interactive reporting dashboards. The key functions of Kala’s Marketplace Management Portal include:
Account Management (including enrollment and integration, and account editing)
Product Management
Seller Management
Reporting and Analytics
Kala’s ecosystem
Enrolment and Integrations
Secondary Research | Competitor Analysis | User Stories | Information Architecture | Wireframing | Prototyping | Collaboration
Overview
Solution Overview
Enrolment & Integrations. The enrolment process provides a seamless onboarding experience which incorporates clear and concise forms and progress indicators so users can track their advancement and feel confident that they are making headway towards completion. To ensure that the onboarding process is not overwhelming, we have included an option for users to skip certain sections that they can complete at a later time.
Web Portal Screens. Kala’s web portal screens has a carefully crafted layout that simplifies the presentation of complex data. Through our user-centric approach, we have developed an intuitive design that enables users to easily grasp the information presented to them. To maximize screen real estate, we have incorporated a collapsible navigation bar that provides a sleek and clutter-free interface. This allows users to focus more on the content of the page, improving their overall experience.
Secondary Research
In our quest to better understand Kala's Marketplace Management platform, we left no stone unturned in gathering data from a variety of sources. We pored over Kala's website, meticulously reviewed documents provided by Kala's owners that detailed the portal requirements, delved into articles about Kala, and combed through industry reports relevant to e-commerce marketplace operations. The information we collected from these sources allowed us to paint a comprehensive picture of how Kala's platform operates, giving us valuable insights that informed our design decisions.
By conducting a comprehensive competitive analysis, we gained a deeper understanding of Kala's platform by analyzing its competitors' products. This allowed us to identify their strengths and weaknesses, and gain valuable insights that informed the development of a better user experience. While some of these platforms may not be Kala’s direct competitors, they offer similar solutions to the same target market. It is worth noting that the competitive analysis presented below provides only general information about their products and not their platforms' usability. Despite the challenge of limited access to these platforms, our team was able to conduct a thorough analysis by studying their screens from demo videos, ensuring that we were equipped with the necessary knowledge to develop Kala’s platform.
Competitive Analysis
Project Timeline
Kala’s Marketplace Management information architecture
Enrolment and Integrations initial user flow. This initial user flow is a linear process where users need to complete steps in succession.
The registration flow contains a multi-step process with sections for: Business Information, Contact Information, Policies, Commission Structure, Authorized Selling Locations, Notification Options, User Management, Terms of Service, Integrations and Systems. Creating a user flow helped me visualize the steps users take and anticipate potential pain points or obstacles that could arise in the user journey.
User Flow - Enrolment and Integrations
User Flow - Enrolment and Integrations
Complex setup - setting up can be complex and time-consuming, requiring extensive integrations with various marketplaces and ecommerce platforms
Limited customer support: Some customers have reported that ChannelAdvisor's customer support is not always responsive or helpful, which can be frustrating when dealing with technical issues or other challenges
Steep learning curve: Learning to use ChannelAdvisor effectively can take time and effort, and some customers have reported that the platform is not very intuitive or user-friendly
Limited integrations: Zentail has a smaller number of integrations with marketplaces and ecommerce platforms compared to some other SaaS marketplace management platforms, which can be a drawback for retailers looking to sell on a wide range of platforms.
Limited reporting features: Some customers have reported that Zentail's reporting features are limited, which can make it difficult to track performance metrics and make data-driven optimizations.
Product data errors: Some customers have reported that Zentail's product data management features can lead to errors and discrepancies, which can be frustrating when trying to manage large volumes of product data across multiple marketplaces.
Limited customization options: Zentail has a more limited range of customization options compared to some other SaaS marketplace management platforms, which can be a drawback for retailers looking to tailor their listings and storefronts to their specific needs.
Complex setup - setting up can be complex and time-consuming, requiring extensive integrations with various marketplaces and ecommerce platforms
Limited customer support: Some customers have reported that ChannelAdvisor's customer support is not always responsive or helpful, which can be frustrating when dealing with technical issues or other challenges
Steep learning curve: Learning to use ChannelAdvisor effectively can take time and effort, and some customers have reported that the platform is not very intuitive or user-friendly
Limited integrations: Zentail has a smaller number of integrations with marketplaces and ecommerce platforms compared to some other SaaS marketplace management platforms, which can be a drawback for retailers looking to sell on a wide range of platforms.
Limited reporting features: Some customers have reported that Zentail's reporting features are limited, which can make it difficult to track performance metrics and make data-driven optimizations.
Product data errors: Some customers have reported that Zentail's product data management features can lead to errors and discrepancies, which can be frustrating when trying to manage large volumes of product data across multiple marketplaces.
Limited customization options: Zentail has a more limited range of customization options compared to some other SaaS marketplace management platforms, which can be a drawback for retailers looking to tailor their listings and storefronts to their specific needs.
Defining the Problem
Scope of the Problem
The scope of Kala’s Marketplace Management Portal is best described by the Information Architecture we created. The portal is designed to provide 5 core functions - Seller Management, Product Management, Account Management, Order Management and Reporting & Analytics. We also incorporated a Landing Page or Dashboard as one of the functional requirements of the portal. Working closely with Kala’s owners, we proceeded to design the first four functions, including the Landing Page. I took charge of designing the Enrollment and Integrations part of the Account Management category and the Product Management screens.
Kala has opportunities to stand out from these competitors as outlined below:
Kala needs an easy and simple registration and integration process
Kala’s platform needs to be intuitive and user-friendly
Kala needs to offer a wide range of platforms and other systems
Kala’s reporting features needs to be comprehensive, intuitive and easy to understand
I raised a concern about the potential issue of users feeling overwhelmed during the registration process due to the extensive amount of information required. This could be exacerbated by the user's lack of necessary information or their limited decision-making authority. As a solution, we proposed a non-linear process that allows users to complete certain steps at a later time. The only mandatory steps in the process are providing essential information such as Business Information and agreeing to Kala’s Terms of Service, enabling users to start using the portal immediately. Kala’s owners were in agreement with this approach.
Revised user flow. This revised user flow allows users to complete some parts of the registration process at a later time to reduce frustration and avoid abandonment of the registration process.
User Stories
User Stories are an indispensable tool in the design process as they ensure that the design is centered on meeting the users' needs and goals. By providing valuable context, prioritizing features, aiding in collaboration, and promoting empathy, user stories play a crucial role in delivering a seamless user experience.
In developing Kala's Marketplace Management Portal, we leveraged user stories to focus on the tasks that users need to complete to achieve their goals while using the portal. Although we didn't have sufficient information to develop User Personas, we were able to understand Kala's target users, which helped us create general user stories. Kala's target market comprises businesses of all sizes, ranging from startups to large enterprises, and we identified Marketplace Owners/Administrators and Marketplace Managers as the primary users of the platform.
We developed User Stories not just for the Registration and Integration process but also for the main functions of the portal, ensuring that all aspects of the platform were geared towards meeting the needs of the users. You can find the entire User Stories document by following the link provided.
While these user stories could be broken down further into more specific stories, the time constraints we faced limited us to creating general epics. Nonetheless, we were able to provide valuable context that helped us better understand the users' goals at every step of the process.
Prototype
Style Guide
To ensure consistency and maintain Kala’s brand identity, we expanded upon the style guide developed by the previous team and created a comprehensive library of components specifically for this portal. Our goal was to establish a cohesive and visually appealing design that aligns with Kala’s branding.
We paid attention to every detail, from typography to color scheme, to ensure that the components we created were consistent with the established brand guidelines. By doing so, we aimed to provide a seamless and consistent experience for the users, while also adding our own touch to the overall design.
Enrolment and Integrations Prototype
Notable details in the design of the Enrolment and Integrations process include the following:
Navigation Bar: To ensure that users are aware of their progress, a navigation bar highlights the current section they are on. Completed sections have a green check mark icon, while uncompleted sections have a warning icon, reminding users to finish them at a later time.
Error, Success and Warning States: Input forms were designed with different states to prompt users if data was successfully added, or if there are errors in the format of the data they provided.
Manageable Chunks: To avoid overwhelming users, the entire process was divided into manageable chunks, with simplified parts. Wording and text in the heading and instructions were carefully crafted with Kala’s owners to ensure clarity and simplicity.
Progress Indicator: A progress indicator, such as "Step 1 of 9", was included at the top right of every page.
Selections: Pills and radio buttons were used for sections with selections to make it easier for users.
'Buy Local' Template Selection: Unique to Kala, the 'Buy Local' template selection was designed with clickable photos to provide users with a clear idea of what they are selecting.
Interact with Prototype here.
Kala’s Enrolment and Integration process
Marketplace Management Portal
The design of the Marketplace Management Portal boasts several noteworthy details, such as:
Collapsible Navigation Bar: In order to maximize the display area for data, we implemented a collapsible navigation bar, enabling users to focus more on the screen data.
Intuitive filter systems: Given the vast amount of data (e.g., product listings, seller management, order management), it was crucial to establish filter systems that are specific enough to help users locate the information they require.
Infographics: The presentation of summary data was carefully designed to ensure that users can filter data by various topics, dates, and more. We collaborated extensively with Kala's owners to ensure that the design meets their needs.
Buy Local reports and analytics: Our team member created an interactive map that facilitates navigation to selling locations and provides valuable insights on their status and data. This design is data-rich and highly informative, empowering marketplace users to make informed business decisions.
Interact with Prototype here.
Testing and Iteration
Throughout the design process, we placed great emphasis on gathering feedback from Kala's owners to ensure that their expectations were met. We carefully incorporated their insights and suggestions over the course of three rounds of review to refine and improve our design. While it was agreed that usability testing would be a valuable step in validating our decisions, the project timeline unfortunately did not allow for it. Nevertheless, the scope of this project required extensive communication and collaboration with Kala’s owners to gain a deep understanding of the product they aim to launch. The owners mainly commented on the content of the screens - the choice of words and the desired layout. Here are some of the screens after three rounds of feedback:
Enrolment and Integrations
Design Considerations
In architecture, finding innovative ways to solve problems is critical, but it's equally important to consider the established methods in the industry to create functional, efficient, and aesthetically pleasing designs. I applied the same approach to the design process of Kala's marketplace management platform, taking cues from other platforms' onboarding processes to understand the principles that would work best for Kala.
Through my research, I identified several key considerations that were instrumental in creating a successful onboarding process for Kala's platform, including:
Simplifying the process
Collecting only essential information
Providing feedback and status updates by visual cues
Breaking down the process into manageable chunks
Using clear and concise language
Testing the user experience
Simplify the process
Break down the process into manageable chunks
Provide feedback and status updates by using visual cues
Test the user experience
Collect only essential information
Use clear and concise language
Marketplace Management Portal
Key Takeaways
Communication and Collaboration. I learned the importance of effective communication and collaboration. By asking questions and seeking clarifications, I was able to gain a deeper understanding of the problem, and Kala's responsive and cooperative owners made the process much easier.
The Power of Design Tools. I also discovered the value of collaborative tools in streamlining our workflow and making our work more efficient. In particular, I found that learning and utilizing design tools like Figma's auto-layout, styles, and component libraries allowed us to produce more consistent work in a shorter amount of time. I also appreciated the ability to communicate within the tools, which helped to keep our team in sync.
Understanding the Problem and Research. I gained a newfound appreciation for the importance of research and understanding the problem. Although Kala's industry was unfamiliar to me, I found it both fun and exciting to learn about B2B PaaS solutions through the research we conducted. By taking the time to gain a deeper understanding of the problem, we were able to create a better product that met Kala's needs.
Communication and Collaboration. I learned the importance of effective communication and collaboration. By asking questions and seeking clarifications, I was able to gain a deeper understanding of the problem, and Kala's responsive and cooperative owners made the process much easier.
The Power of Design Tools. I also discovered the value of collaborative tools in streamlining our workflow and making our work more efficient. In particular, I found that learning and utilizing design tools like Figma's auto-layout, styles, and component libraries allowed us to produce more consistent work in a shorter amount of time. I also appreciated the ability to communicate within the tools, which helped to keep our team in sync.
Understanding the Problem and Research. I gained a newfound appreciation for the importance of research and understanding the problem. Although Kala's industry was unfamiliar to me, I found it both fun and exciting to learn about B2B PaaS solutions through the research we conducted. By taking the time to gain a deeper understanding of the problem, we were able to create a better product that met Kala's needs.
Moving Forward
Ideally, the next phase of the project will involve preparing for user testing, which includes writing the test script, selecting and recruiting participants, and scheduling the test sessions. The testing phase itself will involve observing actual users interact with the portal and gathering feedback to validate design decisions and identify areas for improvement. Based on the insights gained from user testing, the designs will be iterated and refined to optimize the user experience and ensure maximum usability and user satisfaction. By incorporating user feedback and iterating on the designs, we can create a marketplace management portal that meets the needs of our users and provides a seamless and intuitive experience.
Thank you!
Other case studies
Since we didn’t have access to competitors’ platforms, I researched user reviews of these platforms. ChannelAdvisor and Zentail are Kala’s direct competitors and this is a summary of user paint points from which Kala can learn from:
The Process
Ideate
Registration - Sketches and Wireframes
After creating initial rough sketches of the registration screens, I progressed to medium-fidelity wireframes to solicit feedback from Kala's owners. At this stage of the process, we required additional clarification regarding the registration process steps and portal red routes. To maintain UI consistency with other Kala platforms (such as the Seller Portal and customer-facing screens), we employed assets from those designs. The placement of the navigation bar on the left side allows users to quickly locate their position within the registration process, with instructions located on the right side of the screen. Instead of a progress bar, a status statement (e.g., "Step 1 of 9") is included to indicate progress. I iterated on the wireframes twice after receiving feedback from the client on two separate occasions.
Marketplace Management Portal Wireframes
Designing screens for a platform that involves a large amount of data can be challenging, as it requires balancing complexity and simplicity to ensure a seamless user experience. In the case of Kala's portal wireframes, we faced this challenge and went through two rounds of feedback from Kala's owners. During this process, we collaborated closely with the owners to determine which data and information should be included, making changes as necessary to ensure a clear and intuitive design.
Kala - A UX Case Study
Kala - A UX Case Study
Kala - A UX Case Study
Thank you!
ArtScape
A comprehensive art e-learning platform for young art enthusiasts with freemium membership
Other case studies
ArtScape
A comprehensive art e-learning platform for young art enthusiasts with freemium membership
ArtScape
A comprehensive art e-learning platform for young art enthusiasts with freemium membership
Other case studies