R4KUM4RT_CN

Redesigning a cross-border e-commerce platform to boost user engagement, trust, and conversion.

ROLE:

Product Designer

YEAR:

2024

DURATION:

6 months

USER RESEARCH

UX STRATEGY

PRODUCT DESIGN

What began as a platform full of potential—but weighed down by confusion—became a clear, guided and genuinely human import experience. I redesigned Rakumart end‑to‑end: the dashboard, the workflows, the marketplace, and even features that didn’t exist yet. This is the story of how a scattered international product became something users could finally trust.

[01] CONTEXT

Rakumart connects European importers with suppliers in China. It’s a complex environment by nature: quotations, negotiations, logistics, payments, shipping, documents. When I joined, all of this lived inside a product that technically worked, but emotionally overwhelmed. Users felt lost inside long pages without hierarchy, support tickets piled up, and the platform’s growth was limited by a lack of clarity.

[02] ROLE

I led the end-to-end product design for this project – conducting user research, defining the information architecture, creating wireframes and high-fidelity prototypes, and working closely with the development team through implementation. We had a tight timeline of just a few months to deliver a solution, which meant prioritizing the most impactful improvements first.

[03] CHALLENGE

Rakumart brought me on as the Product Designer to revamp the platform into a modern, user-friendly experience that would increase user retention and conversion. The project’s scope went beyond a visual refresh – it aimed to solve fundamental UX issues and add new capabilities. In particular, we needed to address the following challenges:

MAIN CHALLENGES:

>

Guiding New Users: Many first-time users dropped off early because they didn’t understand how to use the platform or navigate the import process. We had to provide better onboarding and self-help resources to build confidence.

>

Building Community & Trust: Rakumart lacked any community features. We hypothesized that enabling users to connect, share tips, and learn from each other would encourage them to return and engage more with the platform.

>

Streamlining Order Management: The existing system made it difficult for users to track their orders and quotes, leading to confusion. We needed to make the buying process more transparent and manageable, so users always know the status of their purchases.

>

Modernizing the UI: Lastly, the site’s look and feel needed an update. A clean, modern UI with clear navigation would not only improve usability but also convey trustworthiness to users and differentiate Rakumart from competitors.

[03] GOALS

I framed the redesign around two complementary types of goals: the ones the business needed to grow, and the ones users needed to feel in control. Keeping them visible throughout the project helped ensure every decision supported both sides.

BUSINESS GOALS:

>

Reduce dependency on Customer Support.

>

Build a scalable, modular design foundation.

>

Increase trust across international markets.

>

Improve clarity around quotations, payments and shipments.

USER GOALS:

>

Understand where their order is at all times.

>

Quickly find saved suppliers and products.

>

Move through quotes and payments without friction

>

Learn how importing works without leaving the platform

These goals became guide-rails for the entire redesign.

[04] PRODUCT DESIGN

DESIGN_PRINCIPLES

└── Foundations/

To avoid getting lost in the complexity of import workflows, I defined a set of principles that acted as anchors throughout the redesign. They helped keep the experience grounded and consistent, even as we reshaped large parts of the platform.

Core Principles

  • Reduce cognitive load: surfaces must feel calm, not crowded.

  • Make the workflow predictable: users should always know what comes next.

  • Design for scanning: clear hierarchy, chunked information, consistent spacing.

  • Unify both markets: one visual language usable in Spain and China.

These weren’t abstract guidelines—they actively shaped every layout and interaction.

I began with research and discovery. I interviewed a handful of active Rakumart users and some new sign-ups to understand their pain points. Several insights emerged: new users felt lost on how to start importing, and existing users craved a community to exchange knowledge (many had resorted to external forums). I also reviewed support tickets and found recurring questions about order statuses and procedures – a sign that important information wasn’t easily accessible on the site. In addition, I analyzed competitor platforms (like other import/export marketplaces) to see how they onboard and retain users. These findings informed the core directions for the redesign.

↳ Through user research, I was able to generate three user archetypes in order to understand the needs of each one and subsequently segment them. This allowed me to move towards a product design tailored to each segment and thus democratize the product. In addition, I used this segmentation to create an individual value proposition for each one, in addition to the product's value proposition, allowing me to create a user-centered design without forgetting the business goals.

Next, I translated these insights into a clear plan. I sketched user flows and drafted a revised information architecture that would accommodate new sections (like Community and Help Center) and reorganize the user account area. The goal was to make navigation intuitive despite adding substantial new content.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

With the structure in place, I moved into design and iteration. I created wireframes for key pages – the home page, dashboard, community, help center, order flow, and profile – focusing on layout and functionality. We iterated on these in collaboration with stakeholders. For example, early designs considered placing community tips directly on the homepage, but user feedback indicated it was better to give Community its own dedicated section for clarity. I also refined the order management flow multiple times to make statuses like “Pending quotation” or “Awaiting payment” clearly visible and understandable.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

After validating the wireframes, I built high-fidelity prototypes in Figma to flesh out the visual design. I adopted a clean, modern aesthetic with Rakumart’s branding, using consistent colors and typography to unify the experience. Throughout the process, I periodically tested interactive prototypes with a few users to gather feedback. These tests led to small but important tweaks – such as adding a personalized welcome message on the dashboard to make the experience feel more friendly, and introducing tooltips in the Help Center for complex terms.

We prioritized a mobile-responsive design as well, ensuring the new UI works smoothly on various devices. By the end of this phase, we had a polished design system and a complete set of screens ready for implementation. I collaborated with developers during implementation to clarify workflows and ensure the final product matched the design intent.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

DESIGN_DECISIONS

└── Decision_making/

Throughout the redesign, several decisions shaped the product in meaningful ways. These weren’t just UI tweaks—they were strategic choices that redefined how users navigate the import journey.

1. Making the workflow linear and narrative Instead of scattering actions across multiple pages, I reorganised the experience so that quotations, payments and shipments naturally follow one another. This reduced hesitation and helped users feel guided rather than dropped into disconnected steps.

2. Prioritising hierarchy over density The old interface tried to show everything at once. I chose to reveal information progressively, grouping content into digestible blocks. This made the product feel calmer and significantly easier to scan.

3. Introducing new features only when they solved real pain Collections and Community weren’t added for the sake of innovation—they responded to two persistent frustrations: losing saved items and not understanding the import process. Both features were added only after research confirmed they filled genuine gaps.

4. Standardising components to accelerate engineering I created a modular framework of cards, lists, states and badges. This wasn’t just about aesthetics—giving engineering a predictable system reduced development time and improved consistency across markets.

5. Designing for two cultures simultaneously Every layout was tested against both European expectations (clarity, structure, transparency) and Chinese patterns (density tolerance, fast-access controls). The final system balances both without compromising usability.

6. Building trust through clarity and tone Microcopy, titles, and indicators were rewritten to be direct and reassuring. In a workflow involving large payments and international logistics, tone becomes part of usability.

[05] SOLUTION

The outcome of this project was a revamped Rakumart platform with new features and an improved UX, all aligned with our initial goals. Below are the key components of the solution:

↳ Personalized Dashboard: We created a new user dashboard that welcomes users by name and provides an overview of their account at a glance. This main panel consolidates important information that was previously scattered. For example, as shown above, users can immediately see how many orders are in progress, which orders are pending actions (like awaiting payment or quotation), and quick links to their latest activities. By surfacing these details on the landing screen after login, we reduce user anxiety and increase transparency – users no longer have to dig through menus to know the status of their imports.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Curated Home Collections: The homepage was redesigned to feature curated product collections and categories. Instead of overwhelming users with a generic catalog, the new home screen (above) highlights popular categories, promotions, and seasonal collections. This approach helps guide discovery – for instance, a user might see a “Summer Gadgets” or “Top-trending Fashion” collection and be inspired to explore products they wouldn’t have otherwise found. The cleaner layout and visual hierarchy make it easier to browse, and the curated collections drive engagement by connecting users to relevant products faster than the old free-for-all product list.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Community Section: One of the biggest additions is the Rakumart Community – a dedicated space for users to help each other and share knowledge. In the new Community section (shown above), users can find tutorials, webinars, marketing tips, and forums to ask questions. We organized the community into topics (e.g. Tutorials, Webinars, Advice, Marketing, Ecommerce) so that content is easy to navigate. This feature fosters a sense of camaraderie and trust among Rakumart’s users. For example, a new importer can read “10 Tips for Importing Successfully” or ask a question about shipping procedures, getting answers from more experienced members. By integrating user-generated content and peer support, Rakumart not only keeps users engaged on the platform longer, but also reduces the load on customer support.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Help Center: To support onboarding, we built a comprehensive Help Center (example above) with step-by-step guides and FAQs. This section addresses common questions like “How do I place an order?” or “How does Rakumart’s quotation process work?” in a clear, accessible format. The help center is directly accessible from the main menu and within relevant pages (for instance, a link to “Help” appears if a user is viewing their orders). By providing these self-service resources, we empower users to find answers on their own. This not only improves the user experience – users feel more confident and informed – but also likely decreases support emails/chats, as many issues can be resolved by consulting the guides. The content in the Help Center includes text and visuals (illustrations and screenshots) to cater to different learning preferences.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Streamlined Order Management: We overhauled the order management and tracking experience. The new Order pages (see above) clearly show each order’s status and next steps. We introduced a progress tracker for orders: from quotation requestedquotation receivedpayment madeshippeddelivered, with badges or color indicators for each status. In the screenshot, you can see an order detail view with statuses like “Pending payment” and “Pending quotation” labeled prominently. Users can now tell at a glance what stage each order is in and what action is needed (if any). This level of clarity was absent in the old design, and it significantly reduces user frustration. Furthermore, order details now include relevant info (like expected dates, tracking numbers, and action buttons) in one place. By making order management intuitive, we help users complete transactions faster and with more confidence.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Profile & Account Improvements: We also redesigned the user profile and account settings (example above). The profile page now allows users to easily update their personal information, manage saved addresses, and set preferences (such as notification settings). We added a new “My Collection” feature as part of the account, where users can save products they are interested in. This acts as a wishlist, encouraging users to return to their saved items later and complete purchases. The improved account section builds trust by giving users full control over their data and a personalized space within the platform. It’s organized in a clean, sectioned layout (Profile Info, Saved Collections, Payment Methods, etc.), making account management straightforward. Though less flashy than the community or homepage changes, these account improvements are crucial for rounding out a seamless user experience.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

↳ Information architecture diagram outlining the new structure. This map shows how we integrated the Community and Help Center into the main navigation and restructured the dashboard and account pages. Planning the site hierarchy upfront ensured that new features fit seamlessly and that users could find what they need without confusion.

Visually, the final UI across all these pages is consistent and on-brand – we used Rakumart’s color palette for interface elements (with a fresh, modern hue for CTAs and highlights) and ensured typography was legible and professional. We also introduced iconography and illustrations (for example, icons indicating community topics or illustrations in the help articles) to make the product feel friendly. Every page was built to be responsive, so users get the full functionality on mobile devices without frustration.

INITIATIVES_I_LED

Some of the most impactful improvements were not redesigns—they were inventions.

Collections gave users a way to remember, organise and revisit what mattered.

Community transformed Rakumart from a transactional tool into a companion that teaches and supports.

Both became core parts of the product.

[05] IMPACT

The redesign of Rakumart’s platform has been very successful, yielding positive outcomes for both the users and the business. A few months after launch, we saw measurable improvements in key metrics:

Higher conversion and sales: The streamlined user flow and added guidance translated into more users completing purchases. The conversion rate of users who sign up and go on to place an order increased by approximately 10% compared to the old platform. This is a significant uplift in revenue, attributable to users feeling more confident to transact.

Improved user engagement: Features like the Community and personal Collections led to users spending more time on the platform. Many users began visiting Rakumart not just to buy, but to check community updates or save new products. This drove up monthly active user counts and repeat visit rates (early data showed a notable uptick in returning users week over week).

Reduced support load: The Help Center quickly became a well-used resource. In the first month, hundreds of users viewed help articles. Common questions (account setup, how to track orders, etc.) that previously turned into support tickets were now answered on-site. The customer support team reported a drop in basic queries, allowing them to focus on more complex issues.

Positive user feedback: Qualitatively, we received great feedback. New users reported that the platform felt “much easier to navigate” and that the onboarding was clear. Existing users loved the community feature – dozens of posts and discussions popped up within weeks, creating a lively knowledge-sharing environment. This positive buzz not only retains users but also acts as a marketing asset, as satisfied users are more likely to refer others.

73%

User Adoption Rate

89%

Task Success Rate

+34%

Enterprise Inquiries

©2025 JAVIER SERÓN — ALL RIGHTS RESERVED