Oxy Biochemistry Database

Overview

I worked with Professor Vikram in Occidental College’s Biochemistry Department to design and build a centralized system for tracking laboratory strains. The department previously relied on inconsistent, handwritten labeling and scattered spreadsheets, making it difficult for faculty to locate, share, or catalog samples. I contributed to the UI/UX design, frontend structure, and project documentation, collaborating with teammates who developed the backend and database schema.

Problem

• No centralized inventory system for strains
• Tubes stored across multiple labs with inconsistent labeling
• No way to quickly locate a sample’s room, freezer, shelf, rack, or box
• No barcode or ID system for fast retrieval
• Professors used different organizational methods, causing confusion

My Role

• Designed core wireframes in Figma for search, detail, and add/edit flows
• Chose typography, color palette, and layout based on Oxy’s design system
• Implemented key parts of the React frontend
• Collaborated with backend teammates on API structure and data flow
• Wrote documentation summarizing system architecture and user flows

Design & User Flow

Search

• General search across all fields
• Location-based search mirroring Room → Freezer → Shelf → Rack → Box → Tube
• Filter search by professor, marker, date, etc.
• “View All” option for full inventory visibility

Sample Detail Page

• Shows tube label, sample name, professor, markers, organism type, and notes
• Buttons to edit, delete, and generate a barcode

Add & Edit Samples

• Structured inputs to reduce errors and enforce the storage hierarchy
• Checks for conflicts when a tube location is already occupied

Admin Dashboard

• Allows professors to add rooms, freezers, shelves, racks, and boxes

Technical Overview

Frontend

• React.js UI with multi-field search and detail views
• Responsive layout for lab use on different devices

Backend

• Node.js + Express.js REST API
• Validation, error handling, and CORS for frontend integration
• Environment variables for secure database configuration

Database

• MySQL hosted on AWS RDS
• Hierarchical schema: Room → Freezer → Shelf → Rack → Box → Tube
• Centralized unique ID system used for barcode generation

Reflection

This project taught me how to design for a highly technical scientific audience and collaborate across a frontend/backend split. It pushed me to think about real-world constraints like mobile usability, data integrity, and user error prevention. If I continued the project, I’d focus on improving mobile layouts, expanding user personalization, and integrating batch barcode scanning for faster inventory management.