96-Well Plate Simulator

Built for laboratory professionals who need precise cell distribution calculations. Combines Vue 3's reactivity with Vuetify's Material Design to create an intuitive tool for drug discovery workflows.

Screenshot of 96-Well Plate Simulator

Click to view full size

Key Features

Interactive 96-well plate visualization with real-time visual feedback

Suspension calculator with dilution factor and concentration calculations

Multi-channel pipette modes: single, 8-channel, and 12-channel operations

Real-time statistics tracking: wells filled, total volume, cell counts, remaining suspension

Volume validation ensuring wells don't exceed 340 μl maximum capacity

Enhanced tooltips with mode-specific information and hover effects

Fill All and Clear Plate functions for batch operations

Comprehensive testing suite with 36 unit tests covering mathematical accuracy

Technical Architecture

Frontend Framework

Vue 3 (Composition API)
Vuetify 3
Material Design Icons
Vite Build Tool

State Management

Pinia Store
Reactive Data Flow
Computed Properties
Watchers

Testing

Vitest
36 Comprehensive Tests
Mathematical Validation
Edge Case Coverage

Laboratory Features

Cell Concentration Calculations
Volume Distribution Logic
Multi-Channel Pipette Simulation
Real-time Statistics

UI/UX

Material Design Components
Responsive Grid Layout
Visual Feedback System
Accessibility Features

Technical Challenges

Accurate mathematical modeling of laboratory dilution calculations and cell distribution

Creating intuitive multi-channel pipette modes that mirror real laboratory workflows

Implementing robust validation to prevent calculation errors that could affect experiments

Designing visual feedback that clearly communicates well states and pipetting actions

Building comprehensive test coverage for mathematical accuracy crucial to laboratory applications

Results & Impact

Created practical laboratory tool used by cell culture specialists

Achieved 36 passing tests with 100% coverage of mathematical calculations

Implemented three distinct pipetting modes matching real laboratory equipment

Built responsive interface that works on both desktop and mobile laboratory environments

Demonstrated Vue 3 Composition API expertise with complex state management

Established deployment pipeline with Netlify for reliable laboratory access

Technologies Used

Vue 3
Vuetify
Pinia
Vite
Vitest
Material Design
Laboratory Tools

Interested in this project?