Yobel Client Portal — B2B

Yobel Client Portal — B2B Operations & Logistics Dashboard

A client portal isn't corporate eye candy; it’s where Yobel's clients go to manage stock, check invoices, track KPIs, and fix issues. If the interface gets in the way, operations stall. Running parallel to the regional site project, we redesigned this portal from the ground up to align the experience with the new rebranding and bring order to data visualization.

- The Challenge (1-month sprint)

1-month timeline: 4 weeks to conduct a UX audit, restructure the information architecture, define UI components, and align everything with the new visual identity.

Zero operational friction: Move away from cluttered tables and heavy interfaces toward clean data visualization (bar, line, and pie charts) that lets users grasp inventory status in under 3 seconds.

B2B consistency: Adapt Yobel's new branding without sacrificing legibility, visual hierarchy, or critical information density.

- My Role (What was built)

UX/UI Designer

Atomic Design System: Created the component library (Design System / UI Kit) from scratch: buttons, dropdowns, menus, search filters, company selectors, and chart components.

UX/UI Architecture: Redesigned the main dashboard, collapsible sidebar, top navigation, and filter structures for complex searches by warehouse, date, and document type.

Data Visualization: Designed visual components for stock reports, active orders, and invoicing.

- The Solution (No-BS Design)

Atomic organization: Built a scalable component system (atoms, molecules, and patterns) so developers didn't have to guess margins or colors.

Fluid navigation: Clean sidebar menu with clear states, contextual location switching (LogiCorp Lima, Arequipa, Trujillo, etc.), and quick date-range pickers.

High-density dashboard without the clutter: Unified top filters, key metrics on the right, and clean charts at the center. Fewer clicks, zero distractions.

- The Result (Shipped on time, no excuses)

A modern, intuitive B2B portal aligned with the global rebranding, delivered in exactly 1 month. An interface built for users who need immediate data, not pretty screens that waste their time.