Redesign of the Module Hiring Flow in the E-commerce Management Area
Managing an e-commerce business requires efficiency, and hiring and integrating essential services should be a straightforward process. However, users often faced a frustrating experience—navigating dropdown menus without clear visibility into what each service offered or which ones were already activated. To address this, I redesigned the hiring experience, replacing dropdowns with a dedicated interface that centralizes information and simplifies module selection. This case study explores the journey toward a more intuitive and efficient module hiring experience.
Context
Within the management area of a supermarket-focused e-commerce platform, there was an existing feature for hiring services such as CRM, messaging, banners, and third-party integrations. Access to these modules was done through a limited dropdown menu, which included repeated or outdated options and offered no visibility into the activation status of each service.
01.
Difficulty visualizing all available modules.
02.
Lack of clarity on what each module offered.
03.
No information on which services were already active.
04.
Unintuitive navigation with multiple clicks and separate screens.
User and Company Pain Points
Goal
Redesign the hiring flow to deliver a centralized, clear, and efficient experience aligned with the manager’s operational needs.
My Role
Conducted desk research, analyzing competitors and similar solutions.
Created early user flows using quick wireframes (Excalidraw) and later developed high-fidelity prototypes in Figma.
Collaborated with the Customer Experience team to validate pain points and refine the flow.
Presented the solution to the development team during the business refinement phase to ensure technical feasibility.
Note
Due to confidentiality (NDA), some sensitive data has been removed from the mockups. Module names, description, values and so on were adapted for presentation purposes.
3. Design Process
-
Desk Research: Other CRMs were analyzed to understand how they organized module hiring.
-
Wireframes: Initial sketches were created in Excalidraw to speed up layout definition.
-
Prototyping: The wireframes were refined and transformed into navigable prototypes.
-
Validation: Feedback was collected from the Customer Experience team, which praised the clarity and organization of the new flow.
-
Business Refinement: The solution was presented to developers to assess technical feasibility, with no negative feedback.
-
Implementation: The final design was sent for development.
4. Proposed Solutions
-
Dropdown Replacement: Instead of opening a dropdown menu, the "Modules" option now directly leads to a dedicated screen.
-
Unified Visualization: All modules are listed on the screen with a brief description and activation status.
-
Enhanced Experience: Users can quickly evaluate which modules meet their needs without having to enter each one individually.
5. Wireframes and Final Screens
-
Initial wireframes developed in Excalidraw.
-
Prototyping and final implemented version.
-
"Before and After" comparison to highlight the improvement in user experience.
6. Learnings
-
Business Refinement strengthens the solution → Validating with developers before implementation prevented rework.
-
Simplicity improves experience → Reducing clicks improved usability and efficiency.
-
Feedback is essential → Collaboration with Customer Experience helped refine the solution.
-
Functional design is more important than visual innovation → Even a simple change can have a significant impact on usability.