Branded B2B Dashboards Elevating Data Visualization for Commerce Solutions

Client

Upbase

Team

1x Product Manager
1x Product Desginer
1x Full Stack Developer

My role

Branding & UX Design

Year

December 2020 — March 2021

vibi

UX Mission

The goal of this project was to create a data-driven platform that delivers curated products to users through an intelligent algorithm, designed with both seller and consumer experiences in mind. For sellers, the service optimized product visibility and sales opportunities by offering tailored product recommendations. For consumers, the platform ensured a seamless and personalized shopping journey, allowing them to explore relevant products effortlessly. Balancing professionalism with an intuitive user experience was key, ensuring the interface maintained a sleek, professional aesthetic without compromising usability or oversimplifying complex workflows.

Branding

Our branding strategy is intricately woven into the user experience, striking a balance between professionalism and accessibility. We chose Avenir as our primary typeface, reflecting the brand's sleek, modern aesthetic while ensuring clarity and readability, even in data-rich sections. The color palette features shades of purple, symbolizing innovation and a fresh approach, further enhancing the brand's forward-thinking identity.

Target Users
We focus on men in their 30s and 40s, as well as all e-commerce users who seek curated, AI-driven shopping experiences, particularly in the B2B sector.

Service Type<
Our service is an e-commerce platform that harnesses cutting-edge artificial intelligence technology.

Brand Concept
Beneficial: We enhance business operations by offering curated products that maximize sales potential for sellers, while simplifying the shopping experience for consumers. Recognizable: Our clear and professional brand identity fosters an easy connection for users with our core values. Reliable: We build trust by consistently delivering accurate, tailored solutions for both sellers and consumers.

branding branding

Key Phrase

Vibi, "Our Valuable artificial intelligence makes your brand a positive influence"

Each letter in VIBI embodies values tailored for our B2B users:

  • V for Valuable insights and opportunities.
  • I for Intelligence that powers the platform.
  • B for Brand, which strengthens users' business presence.
  • I for Influence, empowering users to make a positive impact in their market.
This comprehensive brand strategy ensures that every touchpoint—from user interface to messaging—is cohesive and professional, amplifying the effectiveness of businesses within the B2B landscape.

UI Design

The Vibi platform is a comprehensive e-commerce solution designed to enhance the shopping experience for consumers while providing valuable insights for sellers. At its core, the product comprises a mobile application that allows users to purchase curated products from various sellers and a web platform that equips sellers with data-driven analytics.

Mobile

The mobile interface focuses on delivering an intuitive shopping experience, with an emphasis on usability across all touchpoints in the purchasing process. The design facilitates easy modifications and management, allowing users to quickly correct mistakes when selecting options, ensuring a smooth and stress-free checkout experience. Users can efficiently browse personalized product listings, manage their shopping carts, and easily log in or create accounts within a clean and engaging layout.

vibi-mobile

Web

Complementing the mobile experience, the web application serves as a robust dashboard for sellers. It aggregates purchasing data, converting it into insightful analytics that enable sellers to track performance, identify trends, and optimize their inventory. This platform ensures a seamless transition from managing products to analyzing sales metrics, maintaining consistent branding throughout.

vibi-web

Data Insights for Sellers

The platform incorporates a dashboard that compiles purchasing data and user interactions, transforming raw data into actionable insights for sellers. This dashboard uses data visualization techniques.

ui

Design Guideline

We choose main typo is Avenir as basic that is the most well suited to our rounded logo style, and the main concept is to be shown as a more clearly content manager. It considered readability too.

branding vibi-web

Result

This project was an essential step in designing a two-sided marketplace where both sellers and consumers had tailored experiences. By focusing on creating intuitive UI/UX solutions, we were able to meet the needs of both parties, enhancing the shopping experience for consumers while providing insightful data for sellers to optimize their business.

The design process also emphasized consistent branding across all platforms, helping to establish a unified visual identity. Additionally, the successful creation of reusable visual assets and a scalable design system helped to optimize the platform's efficiency and long-term sustainability. This project served as a key learning experience in building reusable design systems that save time and resources, ensuring that each design iteration aligns with business goals without compromising user experience.

This project also laid the groundwork for future developments in data visualization, influencing subsequent designs for in-house dashboards at other organizations, iSens' In-house information system and Chonbuk National University's integrated information system, Oasis, to implement a highly usable dashboard in the future.