Business Problem & Challenge

MikMak acquired Swaven to expand global reach and capabilities, with a goal to create a unified platform serving 3,000+ retail partners across NA, EMEA, LATAM, and APAC. The challenge: merge two distinct visual identities, integrate technical platforms, support global requirements, and deliver a seamless experience for all customers—under the fastest timeline in company history.

  • Brand Integration: Merging two distinct visual identities and brand languages
  • Technical Integration: Combining MikMak's platform with Swaven's European technology
  • Global Expansion: Supporting multiple languages, currencies, and regional requirements
  • Timeline Pressure: Fastest acquisition integration in company history
  • User Experience Continuity: Maintaining seamless experience for existing customers
  • Dashboard & Reporting Integration: Needed to unify dashboards, executive summaries, and reporting metrics for consistent stakeholder visibility

Research & Data-Driven Design

We conducted comprehensive platform audits, analyzed user feedback through Product Advisory Board sessions, and benchmarked against M&A UX best practices. Competitive analysis and feature inventory audits revealed inconsistencies in typography, colors, and component usage, as well as accessibility issues. We mapped dashboards and reporting structures, identifying the need for unified metrics and a scalable design system.

  • Platform audits of both MikMak and Swaven systems
  • User feedback and client needs analysis
  • Competitive and feature inventory audits
  • Accessibility and contrast evaluation
  • Dashboard/reporting audit to standardize metrics
Component database demonstrating the systematic mapping of platform features and dependencies
Research documentation showing real-world implementations of Swaven platform features
Brand implementation analysis documenting Garnier's use of platform features
Shopper experience audit results and evaluation framework documentation
Component Documentation Strategy: Built a unified Notion database to map and document all component relationships, dependencies, and feature usage across both platforms. This enabled rapid onboarding, reduced rework, and ensured design/engineering alignment during the high-pressure integration timeline.
Implementation Research: Cataloged real-world enterprise implementations to identify critical workflows and high-value features. This research directly informed our feature parity roadmap and prioritized migration efforts for maximum business impact.
Brand Implementation Analysis: Analyzed major brand customizations and template usage to uncover common adaptation points and migration risks. This enabled us to proactively address enterprise client needs and reduce post-launch support.
UX Evaluation Framework: Applied Nielsen Norman Group heuristics to systematically evaluate usability, identify quick wins, and align both teams on shared UX standards—accelerating improvements and reducing friction during migration.
Quality Assurance System: Introduced proactive visual flagging in design files to catch technical, accessibility, and edge-case issues early—reducing implementation delays and rework by over 20%.

Research and gap analysis: Partnered with product managers to audit both platforms, mapping capabilities, strengths, and integration risks. This data-driven approach enabled us to prioritize high-impact improvements and ensure a smooth transition for all user groups.

Chart editing interface showcasing improved data visualization controls
Chart editing interface showcasing improved data visualization controls
Visual quality assurance example demonstrating contrast and accessibility improvements
Integration strategy documentation showing platform feature mapping and workflow analysis
Data visualization evolution: Redesigned chart editing for consistency, accessibility, and ease of use. Standardized color treatments and interaction patterns improved usability and enabled faster onboarding for global teams.
Quality control process: Established a visual QA workflow using Notion templates, streamlining accessibility reviews and cross-team validation for complex data visualizations.
Platform integration strategy: Compared data visualization capabilities, navigation, and color systems across both platforms. This guided our integration roadmap and revealed opportunities to close feature gaps with industry leaders.
Color accessibility analysis showing failing contrast combinations
Color accessibility improvements showing WCAG-compliant color combinations
Initial color accessibility: Identified color combinations that failed WCAG standards, driving urgent updates to ensure compliance and inclusivity.
Improved color accessibility: Updated palette to meet accessibility standards while preserving brand identity, supporting a global user base.
Color system documentation showing variable mapping between platforms
Color palette consolidation demonstrating unified brand system implementation
Color palette consolidation: Mapped Swaven's color variables to MikMak's styleguide, enabling consistent implementation and reducing engineering overhead.
Color consolidation: Simplified and unified the color palette, supporting a cohesive experience and easier maintenance across the platform.
Platform terminology glossary showing standardized naming conventions

Building a unified glossary Created a comprehensive glossary in Notion to standardize terminology, improve cross-team communication, and reduce confusion during integration.

Component overview showing atomic design system hierarchy
Component patterns organized by complexity and reusability
Vuetify component integration guidelines and specifications
Example of Vuetify expansion panel implementation with custom styling
Component system overview: Visualized all component relationships, user flows, and feature dependencies to accelerate onboarding and ensure design consistency during the migration.
Pattern architecture: Organized interface components by atomic design principles, clarifying how elements combine and supporting scalable, maintainable UI development.
Framework integration: Documented Vuetify integration guidelines, reducing ambiguity and speeding up engineering handoff for new features.
Interactive components: Designed and documented interactive elements (e.g., expansion panels) to improve information density and user experience, while maintaining consistent patterns across the platform.
Platform integration strategy and workflow analysis
Unified platform architecture and feature consolidation
Pre-integration platform: Audited Swaven's core features, interface patterns, and technical architecture to inform the foundation for MikMak 3.0 and guide the integration roadmap.
Post-integration platform: Unified MikMak 3.0 platform, consolidating best features from both systems, delivering a cohesive brand experience, and supporting global scale.

Results & Business Outcomes

The successful launch of MikMak 3.0 represented a major milestone in global commerce enablement. We unified two leading platforms while expanding capabilities in retail media, brand.com integrations, and analytics. The new architecture supported high-volume traffic across multiple regions and languages, with direct integrations to major third-party visualization and PIM platforms.

  • Record-Breaking Integration: Completed platform consolidation in 2 months (vs. industry average of 6–12 months)
  • Global Scale: Integrated 3,000+ retail partners across NA, EMEA, LATAM, and APAC
  • Stakeholder Visibility: Unified dashboards and reporting improved decision-making
  • Customer Retention: Maintained 100% customer retention during migration

Learnings & Next Steps

This rapid integration demonstrated how systematic design thinking enables efficient global collaboration. By establishing robust documentation and processes early, we enabled seamless coordination across time zones and languages. Our next phase focuses on expanding retail media capabilities, enhancing brand.com solutions, and developing new analytics features based on our expanded global dataset.

Up Next

How I Applied Responsive Design in Collaboration with Developers

B2B SoftwareResponsive WebAccessibilityFront-End DevelopmentInformation Architecture+1
Preview of How I Applied Responsive Design in Collaboration with Developers