DNA-Helix

A dynamic, interactive visualization of a DNA double helix structure 🧬

It's optimized for both desktop and mobile devices.

Demo

Try it live: HERE

Features

Interactive DNA Helix: Side-view animation of a DNA double helix with accurate base pairing (A-T, C-G).
Base Pair Connections: Subtle lines connecting complementary base pairs for clarity.
Animated Background: Dynamic particle system with varied movement and hues, enhancing the visual depth.
Responsive Design: Adapts seamlessly to different screen sizes and orientations.
Mobile Optimization: Touch controls for panning on mobile devices, reduced particle count, and lower framerate for performance.
Legend: Color-coded guide for nucleobases (Adenine, Cytosine, Guanine, Thymine, Uracil).
Title: Clear "DNA Helix Visualization" header for context.

Installation

Clone the Repository:

git clone <https://github.com/[your-username]/dna-helix-visualization.git>
cd dna-helix-visualization

Serve the Files:
Since this is a static web project, you can serve it using a simple HTTP server.

For example, with Python:

Copy
python -m http.server 8000

Or with Node.js (using http-server):

npm install -g http-server
http-server

Open in Browser: Navigate to http://localhost:8000 (or the port specified by your server) in your web browser.

Usage

Desktop: View the animation and observe the DNA helix structure with background particles.
Mobile: Swipe left or right to pan the helix horizontally and explore different sections.
Responsive: Resize the browser window or rotate your mobile device to see the layout adapt.

Files

index.html: Main HTML structure
styles.css: Responsive styling for layout and elements
script.js: Core JavaScript logic using CreateJS for animation and interaction

Dependencies

CreateJS (loaded via CDN in index.html)

Project Structure

Copy
dna-helix-visualization/
├── index.html         # Main HTML file
├── styles.css         # Stylesheet with responsive design
├── script.js          # JavaScript logic and animation
└── README.md          # This file

Contributing

Contributions are welcome!

License

Distributed under the GNU Affero General Public License v3.0 License. See LICENSE for more information.