Role
Lead Design and Web Development
Timeline
8 Weeks
Tech Stack
React, TailwindCSS, TypeScript, Component Architecture
Impact Metric
1. Overview & 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.
2. The Context
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 (ISO 9001:2015, ISO 13485:2016) while reducing healthcare import costs for Algerian and regional healthcare providers.
A clinical, catalog-first B2B architecture that segments surgical consumables, compresses, and plasters. Features a robust procurement funnel with direct department routing and satisfaction surveys, coupled with high-contrast technical tables detailing dimensions and ISO certifications.
3. Ideation & Architecture
Developing a modular catalog structure that simplifies wholesale procurement and reinforces regulatory trust.
Clinical Identity
Defined a clean, medical-grade design system conveying absolute hygiene and trust.
Logical Segmentation
Classified 70+ medical devices into three clear categories (sterile compresses, surgical, bandages).
B2B Direct Route
Designed forms and customer surveys linking procurement officers directly to technical and sales teams.
Aldismed B2B Catalog Configurator
Production Units 1, 2, 3 • ISO 13485:2016 • Algerian Health Authority Approved
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.
Semantic Coding System
Click any color block to copy its hex value.
Scale & Alignment
Prioritized text hierarchy for dynamic viewport densities.
Component Library
Atomic components with precise semantic signals.
5. Final UI & Key Features
Structured B2B Product Catalog
A clean, fast-loading grid dividing sterile and non-sterile device dimensions for medical buyers.
Regulatory Compliance Hub
Dedicated pages highlighting international ISO 9001 & 13485 audits and MSPRH approvals.
Direct Procurement Channels
Streamlined forms for bulk purchase orders and satisfaction surveys that decrease communication lag.
High-Fidelity Interface Showcase
Interactive screen previews across multiple responsive layout viewports.
Aldismed
01
PSD 2
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.
More Projects
View All Projects →Alpha Nero
Engineered a high-impact, dark-mode B2B email campaign showcasing luxury retail activations and carbon-neutral turnkey builds for global luxury houses.
