Another Trip Out West

Project Overview

Application: Another Trip Out West

Concept: Front-end static web application providing a virtual bicycle tour from the East Coast to Denver.

Stack: HTML5, CSS3, JavaScript (ES6), jQuery.

Live Demo: https://trip-out-west-frontend.vercel.app/

1. Technologies & Architecture The project utilizes semantic markup and efficient DOM manipulation to create an interactive experience without a heavy backend.

Key Actions:

• HTML5: Implementation of semantic tags to render the primary UI structure.
• CSS3: Custom style sheets providing the visual design and responsive layout.
• JavaScript (ES6): Core logic managing application state and user flow.
• jQuery: Leveraged for DOM manipulation and modal event handling.

2. Minimum Viable Product (MVP) The application features a map-based interaction system with dynamic content delivery and API integration.

Key Actions:

• Interactive Map: USA background image with six clickable regions layered over specific states.
• Modal Integration: Click events trigger modals displaying state-specific photos and journal snippets.
• Weather API: Real-time weather data fetched and displayed for each selected location.
• UI Controls: Dedicated exit buttons to minimize and manage modal views.

3. Future Roadmap (Stretch Goals) Planned updates focus on enhancing user immersion and sophisticated mapping.

Key Actions:

• Image Carousel: Transitioning static photos into an interactive flippable gallery.
• Journal Viewer: Implementation of multi-page journal navigation. - SVG Mapping: Upgrading from div-based regions to complex SVG path mapping.
• Journey Mechanic: A story-based progression requiring users to unlock states sequentially.

Final Status: 100% Operational

• UI: Fully responsive across desktop, mobile, and tablet.
• Functionality: Modal triggers and weather API confirmed stable.