2RE03-Design/memory-bank/activeContext.md

# Active Context - 2RE03 Portfolio Site

> Current focus, recent changes, next steps, and active decisions.
> Last updated: 2026-09-10.

## Current Work Focus
**Build phase.** A working static site on a locally vendored Bootstrap 5.3.3,
with custom CSS/JS and a live Web3Forms contact page. It now includes a
**Collins-inspired Case Studies feature** (typographic index + 10 detail pages).
Next is user review of copy/design and the deployment decision.

## Recent Changes
- **2026-09-10** - Created the standard memory bank (`memory-bank/`): the six
  core files plus `reference-materials.md` (replacing an earlier single-file
  draft).
- **2026-09-10** - Deleted the superseded draft
  `.clinerules/memory-bank-oops.md`; `.clinerules/` now holds only the rule file.
- **2026-09-10** - User locked the stack/styling/brand decisions (see below).
- **2026-09-10** - Built the v0 scaffold: vendored Bootstrap 5.3.3 and the
  Inter/Space Grotesk fonts locally; created `css/`, `js/`, `img/`, `fonts/`;
  copied the 23 reference images into `img/`; wrote all five pages,
  `css/style.css`, `js/main.js`, and the Web3Forms contact form.
- **2026-09-10** - Verified: all pages/assets return HTTP 200 locally, HTML tags
  balance, `js/main.js` passes `node --check`, no links into `refrence/`.
- **2026-09-10** - Rethemed the site to a **green palette centered on `#2ee666`**
  (tokens renamed in `css/style.css`; hero, header, footer, buttons, links, and
  accents updated; HTML class/meta updates).
- **2026-09-10** - Added a **Collins-inspired Case Studies** feature: a
  typographic index (`case-studies.html`) with a cursor-following hover preview
  (`js/case-studies.js`), 8 detail pages in `case-studies/`, a homepage
  case-studies section, and "Case Studies" added to the nav/footer of every page.
- **2026-09-10** - Added 6 real client websites as case studies (Cool Crap From
  China, Teach Each Other AI, Jensen's Red Barn, Mask Aid Project, 1 Woman's Art
  and Magic, Sam's Rules) with screenshots + live-site links; list now 13 entries.
- **2026-09-10** - Corrected two case studies: "Kincaid" → **Urban Moto** (print
  design / art direction for a motorcycle magazine, 4-image gallery), and
  **1 Woman's Art and Magic** → a two-book art series for painter Joanna Signer
  plus the website to help sell it.
- **2026-09-10** - Trimmed case studies 13 → 11: removed Cool Crap From China and
  Data Vis Art; replaced Coop with **Cart** (a 3D design proposal). Work kept in
  the full portfolio (Cool Crap added to the Web gallery, Data Vis Art moved to
  the Logos gallery).
- **2026-09-10** - Corrected **Mehavior** to an app project (logo, app interface
  and button design, and investor-pitch promotional material); category now
  "App Design & Identity".
- **2026-09-10** - `work.html`: added a new **App Design** category (moved
  Mehavior in; added the "(10+2) x 5" productivity timer app).
- **2026-09-10** - `work.html`: moved **Web Design** to the top of the section
  order (now Web Design, Logos, App Design, Print Design, 3D Modeling, Written
  Work).
- **2026-09-10** - Renamed the **"Written Work"** category title to **"Editorial"**
  across the site (work page, homepage/services cards, and the Sam's Rules
  category label).
- **2026-09-10** - Converted the homepage **Selected work** and all six **Work**
  galleries into **Collins-style carousels** (rounded, cropped images; scroll-snap
  track; arrows + keyboard + mouse drag via `js/carousel.js`).
- **2026-09-10** - Expanded the **Mask Aid Project** case study's "What we did":
  video production, crowdfunding campaign, copywriting, and translation from
  Chinese.
- **2026-09-10** - Web Design gallery: added Jensen's Red Barn + Mask Aid Project
  snapshots; re-shot the timer app image as a close-up.
- **2026-09-10** - Homepage copy: replaced the avocado-hipster tagline with a
  professional, team-voiced hero line, and changed "Web design first. Everything
  design second." to **"Web Design Is Only the Beginning"** (+ supporting copy).
  Tone direction updated in `productContext.md`.
- **2026-09-10** - Renamed the **"Editorial"** category to **"Words"** (covers
  sales copy + technical writing too): work-page heading/caption, homepage and
  services cards, and the Sam's Rules label ("Words & Web").
- **2026-09-10** - Homepage: moved **Selected work** above **What we do**
  (background alternation preserved).
- **2026-09-10** - Case studies pruned to **10** and reordered: removed Argent;
  renamed Victoria → **Victoria Fuller**, Cart → **Upscale Food Cart** (with page
  files renamed). Order now: Mask Aid Project → 1 Woman's Art and Magic → Sam's
  Rules → Mehavior → Jensen's Red Barn → Upscale Food Cart → Silver Lining →
  Victoria Fuller → Urban Moto → Teach Each Other AI.
- **2026-09-10** - Enriched 5 case studies with client detail: Sam's Rules
  (illustrations + downloadable companion content), Jensen's Red Barn (Grandma
  Dorothy's scrapbook slideshow), Silver Lining (drove clients to a high-end
  retreat), Victoria Fuller (Playboy Bunny / logo rights), Urban Moto (guest
  articles, managing submissions, custom client ads).
- **2026-09-10** - Jensen's Red Barn: added "Social media setup" (removed "Contact
  section"). Sam's Rules category → **"Book Design & Web"**.
- **2026-09-10** - `work.html`: moved `web50shadesof2048.png` into **App Design**
  (out of Web Design).
- **2026-09-10** - App Design: swapped `site-timer-app.jpg` for **`2plus5times3.jpg`**
  (cropped to 4:3).
- **2026-09-10** - Added web backend services (hosting, site management, domain/URL
  sourcing) to `services.html` and the homepage Web Design card.
- **2026-09-10** - Removed all em dashes from the site (and the memory bank); the
  tone guide now bans them.
- **2026-09-10** - Contact form: Subject field is now optional.
- **2026-09-10** - Replaced the hero portrait with a green gradient + dot grid
  site-wide, and a work collage on the homepage.
- **2026-09-10** - Case study heroes now use each project's own image as the
  background (`.hero--image` + `--hero-image`).
- **2026-09-10** - Hero tweaks: Mehavior shows the top (logo), Victoria Fuller sits
  at `center 10%` (cursive name), Jensen's Red Barn uses `red-barn-photo.jpg`,
  Urban Moto uses the middle of `printtiresad.png`. Added `--hero-position`.
- **2026-09-10** - Case study images no longer letterbox (natural aspect via
  `.card-work`); added `.card-work--frame` for Urban Moto's grid.
- **2026-09-10** - Removed `refrence/` (temporary source, 19.4 MB) and four
  superseded images; stashed to `/home/torrey/2RE03-unused-assets-backup/`.
- **2026-09-10** - Version control set up: `git init` on `main`, first commit of
  79 files, remote `origin` = Forgejo `2RE03-Design`.
- **2026-09-10** - Added `TODO.md` as the backlog; the site was **published** by
  the user, and `memory-bank/`/`.clinerules/` were confirmed to stay tracked.
- **2026-09-10** - Optimised all images to **WebP** (`img/` 20 MB -> 3.2 MB, 85%
  smaller); `printtiresad.png` stays PNG. See `techContext.md`, Image Pipeline.

## Next Steps
> **The full backlog lives in `TODO.md` at the repo root.** This section keeps only
> the current priorities; new items go into `TODO.md` first.
1. Review copy + design with the user; refine tone-matched text as needed.
2. Add any real assets (favicon, OG/social image, logo).
3. Populate galleries with additional/real work items and captions.
4. Record the published URL here once it is confirmed.

## Active Decisions & Considerations

### Decisions Log
| # | Decision | Status |
|---|---|---|
| 1 | Standard multi-file memory bank | ✅ Done |
| 2 | `refrence/` was temporary source; removed before the first commit (backed up outside the repo) | ✅ Done |
| 3 | Never attribute work to a named individual on the site | ✅ Done |
| 4 | Tone = sharp, professional, team-voiced, with an edge (see `productContext.md`) | ✅ Updated |
| 5 | Stack = static hand-coded HTML + Bootstrap 5.3.3 (vendored locally) | ✅ Done |
| 6 | Styling = Bootstrap components + custom `css/style.css` | ✅ Done |
| 7 | Brand = purely 2RE03; **no** 2RE Factory parent brand | ✅ Done |
| 8 | Fonts = Inter + Space Grotesk, self-hosted in `fonts/` | ✅ Done |
| 9 | Folder layout = `css/`, `js/`, `img/`, `fonts/` | ✅ Done |
| 10 | Contact = dedicated `contact.html` → Web3Forms (public access key) | ✅ Done |
| 11 | Pages = index, work, about, services, contact | ✅ Done |
| 12 | Reference images copied `refrence/img/` → `img/` as production assets | ✅ Done |
| 13 | Color scheme centered on `#2ee666` (green on ink) | ✅ Done |
| 14 | Add Collins-style Case Studies (index + 8 detail pages + hover previews) | ✅ Done |
| 15 | Add 6 real client websites as case studies (screenshots + live links) | ✅ Done |
| 16 | Homepage copy: retire the avocado-hipster tagline; new team-voiced, professional hero + "Web Design Is Only the Beginning" | ✅ Done |
| 17 | Version control: git repo on `main`, pushed to the Forgejo remote `origin` (`2RE03-Design`) | ✅ Done |
| 18 | Site is published | ✅ Done |
| 19 | Keep `memory-bank/` and `.clinerules/` tracked in the repo | ✅ Done |
| 20 | `TODO.md` at the repo root is the backlog; the memory bank points at it | ✅ Done |

### Open Questions (remaining)
1. **Real assets:** any real favicon, Open Graph/social image, or logo to add?
2. **Copy approval:** review/refine the drafted company-voice copy?
3. **Gallery content:** add more work items/captions beyond the reference set?
4. **Live URL:** where is the published site? Nothing in the repo states it.

## Important Patterns & Preferences
- **Backlog convention:** `TODO.md` at the repo root is the human-facing list of
  open work. The memory bank keeps only the current priorities and points there,
  so the two never drift. Issues (Forgejo) are for items that need discussion.
- Plan-first; small, verifiable changes; plain/static, dependency-light output
  (see `projectbrief.md` → Ways of Working).
- Private asset provenance (never credit the CEO on the site).
- Keep all site copy in the tone defined in `productContext.md`.

## Learnings & Insights
- The reference build used hand-coded HTML + Bootstrap 5 with a small custom
  carousel (`series-carousel.js`); the local `css/`/`js/` assets it references
  are NOT present in this repo.
- The reference bio is first-person and individual-focused; the 2RE03 site must
  re-voice it as the company.

## Housekeeping
- The superseded single-file draft `.clinerules/memory-bank-oops.md` was **deleted**
  (2026-09-10). `.clinerules/` now contains only `memory-bank.md`.
- Note: `.clinerules/memory-bank.md` is the Memory Bank **rule** file (it describes
  the structure); the actual data files live in the top-level `memory-bank/` folder.
- `refrence/` plus four superseded images (`blue_eyes_Torrey.png`,
  `red-barn-photo.jpg`, `site-sams-rules.jpg`, `site-timer-app.jpg`) were **moved**
  on 2026-09-10 to `/home/torrey/2RE03-unused-assets-backup/` (22 MB, outside the
  repo). Run `rm -rf /home/torrey/2RE03-unused-assets-backup` once nothing is
  needed from it.