Aldismed backdrop

ALDISMED

Back to All Projects

Aldismed

B2B CatalogUI/UX DesignMedical ManufacturingWeb Development

Modernized the B2B catalog and clinical corporate gateway for Algeria’s leading sterile medical products manufacturer.

Role

Lead Design and Web Development

Timeline

8 Weeks

Tech Stack

Angular, TypeScript, Figma, TailwindCSS

Languages

Arabic, English, French

Scroll for details

1. Overview & The Brief

The Brief

To modernize Aldismed's corporate B2B digital presence to reflect their core values of trust, professionalism, and innovation. The goal was to build a comprehensive product catalog and corporate hub that appeals to healthcare professionals while maintaining a clinical and highly professional aesthetic.

Company NameAldismed (Algérienne des dispositifs médicaux)
Project TitleB2B Catalog & Clinical Corporate Gateway
RoleLead Design and Web Development
Aldismed Presentation Collage

2. The Context

The Problem

Organizing three distinct production units and a wide catalog of 70+ products (bandages, sterile compresses, and surgical consumables) into a clean, searchable interface. The platform needed to project technical authority and GMP/ISO regulatory compliance while making it simple for administrators to manage and update products, blogs, and images dynamically, ensuring an active and accurate catalog for B2B buyers.

The Solution

A clinical, catalog-first B2B architecture that segments surgical consumables, compresses, and plasters. We built a custom administrative dashboard allowing administrators to easily add products, publish blog updates, and manage images across the site, coupled with structured B2B layout systems detailing technical specifications.

Aldismed Presentation Mockup

3. Ideation & Architecture

Clinical Precision & Dynamic Catalog Management

Developing a modular catalog structure backed by a custom dashboard that makes adding products, managing blogs, and updating site-wide media simple and efficient.

01 / Strategy

Clinical Identity

Defined a clean, medical-grade design system conveying absolute hygiene and trust.

02 / Cataloging

Product Classification

Classified 70+ products into three clear categories (sterile compresses, surgical, bandages) for B2B buyers.

03 / Funnel

Admin Custom Dashboard

Created an easy-to-use custom backend dashboard to add products, post blogs, and update media instantly.

Live Demonstration
Aldismed Laboratories

Ajouter un produit

Fiche Technique
Choose FileN...n
Product Photos
Choose FileN...en
Open Sans|Lato
12ptParagraph
ppowered by tiny
Open Sans|Lato
12ptParagraph
ppowered by tiny
Open Sans|Lato
12ptParagraph
ppowered by tiny

4. Establishing the Visual Language

To ensure scalability, we developed a modular design system. The color palette utilizes semantic signals and distinct status indicators to provide instant feedback for user management. The typography prioritizes readability for high information density.

Aldismed Laboratories
Color Palette

Semantic Coding System

Click any color block to copy its hex value.

Copy
#1C3664B2B Navy Primary
Copy
#008080Clinical Teal Primary
Copy
#D76D00Safety Orange Accent
Copy
#36454FCharcoal Grey Secondary
Copy
#F0EFEFMedical Light Grey
Typography

Scale & Alignment

Prioritized text hierarchy for dynamic viewport densities.

HEADINGS - Open Sans (Bold / Semi-Bold)
STERILE COMPRESSES & CONSUMABLES
BODY & PARAGRAPHS - Lato (Regular / Light)
Providing high-quality sterile products since 2013.
ARABIC TRANSLATION - Tajawal (Medium / Bold)
الجزائرية للأجهزة الطبية المعقمة
TECHNICAL DATA & SPECS - Lato / Tabler Icons
ISO 13485 CERTIFIED • Tabler Icons Integration
Interactive Elements

Component Library

Atomic components with precise semantic signals.

Buttons
Status Pill Indicators
Open Sans & Lato FontsTabler IconsISO 13485
Language Switcher

5. Final UI & Key Features

Feature 1

Dynamic B2B Product Catalog

A clean, fast-loading grid dividing sterile and non-sterile product dimensions for medical buyers, managed directly via the dashboard.

Feature 2

Administrative Dashboard

An intuitive backend control panel to add products, write blog posts, and update site images without manual coding.

Feature 3

Regulatory Compliance Hub

Dedicated pages highlighting international ISO audits and MSPRH approvals to reinforce trust.

Visual Gallery

High-Fidelity Interface Showcase

Explore 7 desktop screens from the Aldismed B2B clinical platform. Designed with a clean, medical-grade aesthetic, structural grids, and regulatory validation to streamline bulk hospital orders.

aldismed.com
B2B Corporate Hub
Command Landing Gateway
B2B Corporate Hub
Zoom & Scroll ↗
aldismed.com/products/sterile-compress
Technical Specifications View
Device Precision Telemetry
Technical Specifications View
Zoom & Scroll ↗
aldismed.com/blog
Medical Insights & Innovations
Clinical News Publication
Medical Insights & Innovations
Zoom & Scroll ↗
aldismed.com/contact
Wholesale Procurement Intake
Frictionless Sales Funnel
Wholesale Procurement Intake
Zoom & Scroll ↗
aldismed.com/products
Sterile Consumables Catalog
Device Directory
Sterile Consumables Catalog
Zoom & Scroll ↗
aldismed.com/about
Corporate Heritage & Quality Control
GMP Quality Standards
Corporate Heritage & Quality Control
Zoom & Scroll ↗
aldismed.com/blog/iso-compliance-standards
Clinical Publications Reader
Focused Knowledge Portal
Clinical Publications Reader
Zoom & Scroll ↗

6. Project Impact & Reflection

A sophisticated, high-performance B2B platform that successfully establishes Aldismed as a reliable medical manufacturing partner. The custom component-driven layout enables their internal team to quickly scale the product catalog as new medical device lines are introduced.

-45%
Catalog Search Time
+65%
B2B Inquiries
100%
Regulatory Audits Pass
Up Next

Alpha Nero

Engineered a high-impact, dark-mode B2B email campaign showcasing luxury retail activations and carbon-neutral turnkey builds for global luxury houses.

Read Case Study
Alpha Nero