# alagappan567/lays-crunch-experience architecture

> Architecture diagram of the GitHub repository alagappan567/lays-crunch-experience, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-11). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/alagappan567/lays-crunch-experience
- Repository: https://github.com/alagappan567/lays-crunch-experience

## Overview

This repository is a public showcase and documentation for the Lay’s Crunch Experience; its README says the actual source code is in a separate private repository. The graph therefore maps documented runtime capabilities, but cannot point to their implementation files. The principal flow is a browser visitor entering through the preloader, then exploring the 3D flavor carousel, scroll story, and shop. Relationships below are limited to those described in README.md; implementation-level calls are unavailable.

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_runtime["Experience Runtime"]
  node_preloader["Cinematic preloader"]
  node_scene["Shared 3D scene"]
  node_asset_loading["Asset loading"]
  node_bag_models["3D flavor bags"]
  node_hero["Hero carousel"]
  node_ingredients["Ingredient models"]
  node_chipfield["Chip storm and rings"]
  node_smooth_scroll["Smooth scrolling"]
end

subgraph group_story["Flavor Story"]
  node_story_timeline["Scroll story timeline"]
  node_story_chapters["Story chapters"]
end

subgraph group_shop["Shop Experience"]
  node_flavor_wall["Flavor wall"]
  node_build_box["Build-a-Box"]
  node_rack["The Rack"]
end

node_visitor(("Browser visitor"))

node_visitor -->|"opens experience"| node_preloader
node_preloader -->|"tracks progress"| node_asset_loading
node_asset_loading -->|"loads assets"| node_bag_models
node_asset_loading -->|"loads assets"| node_ingredients
node_preloader -->|"reveals after loading"| node_hero
node_hero -->|"uses 3D scene"| node_scene
node_bag_models -->|"provides flavor bags"| node_hero
node_ingredients -->|"animates around hero"| node_chipfield
node_smooth_scroll -->|"drives scroll choreography"| node_story_timeline
node_story_timeline -->|"scrubs chapters"| node_story_chapters
node_scene -->|"provides bag imagery"| node_flavor_wall
node_flavor_wall -->|"precedes picker"| node_build_box
node_build_box -->|"followed by"| node_rack

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_preloader,node_scene,node_asset_loading,node_bag_models,node_hero,node_ingredients,node_chipfield,node_smooth_scroll,node_visitor toneBlue
class node_story_timeline,node_story_chapters toneAmber
class node_flavor_wall,node_build_box,node_rack toneMint
```

## Components

### Experience Runtime

- **Cinematic preloader**
- **Shared 3D scene**
- **Asset loading**
- **3D flavor bags**
- **Hero carousel**
- **Ingredient models**
- **Chip storm and rings**
- **Smooth scrolling**

### Flavor Story

- **Scroll story timeline**
- **Story chapters**

### Shop Experience

- **Flavor wall**
- **Build-a-Box**
- **The Rack**

### Other components

- **Browser visitor**

## Connections

- Browser visitor → Cinematic preloader: opens experience (evidence: `README.md`)
- Cinematic preloader → Asset loading: tracks progress (evidence: `README.md`)
- Asset loading → 3D flavor bags: loads assets (evidence: `README.md`)
- Asset loading → Ingredient models: loads assets (evidence: `README.md`)
- Cinematic preloader → Hero carousel: reveals after loading (evidence: `README.md`)
- Hero carousel → Shared 3D scene: uses 3D scene (evidence: `README.md`)
- 3D flavor bags → Hero carousel: provides flavor bags (evidence: `README.md`)
- Ingredient models → Chip storm and rings: animates around hero (evidence: `README.md`)
- Smooth scrolling → Scroll story timeline: drives scroll choreography (evidence: `README.md`)
- Scroll story timeline → Story chapters: scrubs chapters (evidence: `README.md`)
- Shared 3D scene → Flavor wall: provides bag imagery (evidence: `README.md`)
- Flavor wall → Build-a-Box: precedes picker (evidence: `README.md`)
- Build-a-Box → The Rack: followed by (evidence: `README.md`)