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

# Progress - 2RE03 Portfolio Site

> What works, what's left, current status, known issues, and decision evolution.
> Last updated: 2026-09-10.

## What Works
- Memory bank initialized in the standard multi-file form.
- Source material surveyed and inventoried (see `reference-materials.md`).
- Six linked pages built: `index`, `case-studies`, `work`, `about`, `services`,
  `contact` - plus 10 case study detail pages in `case-studies/`.
- Bootstrap 5.3.3 + Inter/Space Grotesk vendored locally (`css/`, `js/`, `fonts/`).
- 46 images in `img/`, optimised to WebP: 45 `.webp` plus `printtiresad.png`
  (project art, client-site screenshots, 10 case-study hero backgrounds, 8 homepage
  collage tiles). `img/` is **3.2 MB**, down from 20 MB.
- Web3Forms contact form with required-field + email validation, accessible
  labels, and AJAX submit with a live status region.
- Collins-style **Case Studies** feature: a typographic index with
  cursor-following hover previews (with a touch/no-JS thumbnail fallback) and
  per-project detail pages.
- **6 real client websites** added as case studies - Teach Each Other AI,
  Jensen's Red Barn, Mask Aid Project, 1 Woman's Art and Magic, Sam's Rules, and
  Victoria Fuller - each with a screenshot and a link to the live site. (Cool Crap
  From China lives in the portfolio gallery instead.)
- `work.html` now has **six galleries**, including a new **App Design** category
  (Mehavior + the "(10+2) x 5" productivity timer app).
- Verified locally: all pages/assets HTTP 200, HTML tags balance, `js/main.js`
  passes `node --check`, no links into `refrence/`.

## Current Status
**Stage:** Built, verified, committed, and **published**. What remains is
copy/design review and the optional polish tracked in `TODO.md`.

## What's Left To Build
> The full, current backlog lives in **`TODO.md`** at the repo root; this section
> keeps only the headline items.
- User review/refinement of copy + visual design.
- Optional real assets: favicon, Open Graph/social image, logo.
- More/real portfolio items and per-image captions.

## Known Issues / Risks
- Copy is drafted in company voice but **not yet approved** by the user.
- Case study hero backgrounds are generated JPEGs; **Urban Moto's is low
  resolution** (450px native at its widest).
- Web3Forms posts to an external endpoint with a public access key in
  `contact.html`; live submissions depend on that key/account remaining active.
- Galleries reuse the reference image set; captions are category-level only.
- Some case studies use names drawn from the source image filenames with generic
  copy; others (the client sites, plus Urban Moto, Cart, and 1 Woman's Art and
  Magic) are based on the user's factual notes.

## Evolution of Decisions
- **2026-09-10** - Initialized a single-file memory bank draft.
- **2026-09-10** - Replaced by the standard multi-file memory bank (this folder);
  content ported over.
- Tone anchored on `refrence/index.html`; no individual attributions; `refrence/`
  marked temporary.
- **2026-09-10** - Locked the stack (static HTML + vendored Bootstrap), styling
  (Bootstrap + custom CSS), and brand (2RE03 only, no 2RE Factory), then built the
  v0 scaffold.

## Progress Log
- **2026-09-10** - Initialized memory bank. Surveyed `refrence/` (2 HTML files +
  23 images), captured project brief, tone, content model, and open questions. No
  production files created.
- **2026-09-10** - Built and verified the v0 static scaffold: five pages, vendored
  Bootstrap 5.3.3 + Inter/Space Grotesk fonts, `css/style.css`, `js/main.js`, and
  the Web3Forms contact form. All pages/assets return HTTP 200 locally.
- **2026-09-10** - Rethemed the site to a green palette centered on `#2ee666`
  (crimson/red tokens removed from production CSS/HTML).
- **2026-09-10** - Deleted the superseded draft `.clinerules/memory-bank-oops.md`.
- **2026-09-10** - Added the Case Studies feature (typographic index + 8 detail
  pages + hover previews), wired into the nav/footer and the homepage.
- **2026-09-10** - Added 6 real client websites as case studies (5 new detail
  pages + linked the existing Sam's Rules study to its live site); captured
  screenshots into `img/`. Case-study list is now 13 entries.
- **2026-09-10** - Corrections: renamed the "Kincaid" case study to **Urban Moto**
  (print design / art direction for a motorcycle magazine; 4 images:
  printtiresad, printkincaidad, printmacchiariniad, writtenearplugs) and removed
  the old page; recast **1 Woman's Art and Magic** as a two-book art series for
  painter Joanna Signer plus the website to sell it.
- **2026-09-10** - Trimmed the case-study list from 13 to 11: removed **Cool Crap
  From China** and **Data Vis Art**, replaced **Coop** with **Cart** (a 3D design
  proposal), and kept the work in the portfolio (Cool Crap added to the Web
  gallery; Data Vis Art moved to the Logos gallery).
- **2026-09-10** - Corrected **Mehavior**: it was an **app**, not a website - logo,
  app interface/button design, and promotional material for an investor pitch.
  Category updated to "App Design & Identity".
- **2026-09-10** - `work.html`: added an **App Design** category, moved Mehavior
  into it, and added the **"(10+2) x 5"** productivity timer app (screenshot from
  timer.2re.me). Section backgrounds re-alternated.
- **2026-09-10** - `work.html`: moved **Web Design** to the top. Order is now
  Web Design, Logos, App Design, Print Design, 3D Modeling, Written Work (with
  the section-background alternation preserved).
- **2026-09-10** - Renamed the **"Written Work"** category title to **"Editorial"**
  everywhere it appears (work page heading, the homepage/services cards, and the
  Sam's Rules category label "Editorial & Web").
- **2026-09-10** - Rebuilt the **Selected work** (homepage) and all six **Work**
  galleries as Collins-style carousels: a native CSS `scroll-snap` track with
  rounded, `object-fit: cover` (cropped) cards, plus `js/carousel.js` for
  prev/next buttons, keyboard arrows, and mouse drag-to-scroll (touch swipes
  work natively).
- **2026-09-10** - Expanded the **Mask Aid Project** case study: what we did is
  now video production, a crowdfunding campaign, copywriting (all the text), and
  translation from Chinese.
- **2026-09-10** - `work.html` Web Design gallery: added snapshots of Jensen's
  Red Barn and Mask Aid Project. Also re-shot the **"(10+2) x 5"** timer image as
  a close-up (composed to fill a 4:3 frame).
- **2026-09-10** - Homepage copy rewrite: dropped the avocado-hipster tagline for
  a professional, team-voiced hero; renamed the "What we do" headline to
  **"Web Design Is Only the Beginning"**. Tone guidance updated in
  `productContext.md`.
- **2026-09-10** - Renamed the **"Editorial"** category to **"Words"** (it also
  covers sales copy and technical writing). Updated `work.html` heading/caption,
  the homepage + services cards (now mention sales copy), and the Sam's Rules
  label ("Words & Web"). Supersedes the earlier "Written Work → Editorial" rename.
- **2026-09-10** - Homepage: moved **Selected work** above **What we do** (and
  swapped their section backgrounds so the white/soft alternation still holds).
- **2026-09-10** - Pruned + reordered case studies (now **10**): removed **Argent**;
  renamed **Victoria → Victoria Fuller** and **Cart → Upscale Food Cart** (pages
  renamed to `victoria-fuller.html` / `upscale-food-cart.html`). New order: 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 five case studies from the user's notes:
  **Sam's Rules** (+ illustrations, downloadable companion content);
  **Jensen's Red Barn** (Grandma Dorothy's scrapbook brought online as a slideshow);
  **Silver Lining** (the mark helped bring clients to a high-end retreat);
  **Victoria Fuller** (a Playboy Bunny - the only one with rights to the Playboy logo);
  **Urban Moto** (guest articles; managed photography/editorial/ad submissions;
  designed custom ads for clients).
- **2026-09-10** - **Jensen's Red Barn**: added "Social media setup", removed the
  "Contact section" bullet. **Sam's Rules** category changed from "Words & Web" to
  **"Book Design & Web"** (both lists + detail page).
- **2026-09-10** - `work.html`: moved `web50shadesof2048.png` from **Web Design**
  into **App Design** (Web Design now 5 items, App Design 3).
- **2026-09-10** - `work.html` App Design: replaced `site-timer-app.jpg` with
  **`2plus5times3.jpg`**, cropped from 398×820 to a centred 4:3 (398×298) so it
  fills the card. (`site-timer-app.jpg` is now unused.)
- **2026-09-10** - Added the web **backend services** to the offering: web hosting
  setup/management, site management & maintenance, and domain/URL sourcing. Covered
  in `services.html` (new paragraph + 3 "What's included" bullets) and the homepage
  Web Design card.
- **2026-09-10** - Removed **all em dashes** from the site copy (they read as
  AI-generated): rewrote ~95 instances across the HTML plus CSS/JS comments and the
  contact-form success message, using commas, colons, and parentheses. Page titles
  now use " | ". Cleaned the memory bank too. (Vendored `bootstrap.min.css` left
  untouched.)
- **2026-09-10** - Contact form: made **Subject optional** (dropped `required` and
  its asterisk; the label now reads "Subject (optional)"). Required fields are now
  Name, Email, and Message.
- **2026-09-10** - Hero rework (dropped the portrait): the global `.hero` now uses
  the green gradient plus a faint dot grid (no photo), and the homepage adds a
  low-contrast **work collage** (`.hero--collage`) of eight thumbnails
  (`img/collage-1..8.jpg`, generated at 480x360, ~178KB total). `blue_eyes_Torrey.png`
  is now unreferenced in production (still used by `refrence/index.html`).
- **2026-09-10** - Each **case study hero** now uses that project's own image as its
  background: `.hero--image` (green overlay, heavier on the left for legibility)
  with the image set per page via an inline `--hero-image` custom property. Hero
  backgrounds generated as optimised JPEGs (`img/hero-<slug>.jpg`, max 1600px);
  the transparent logos (Sam's Rules, Silver Lining, Victoria Fuller) were
  composited onto brand green.
- **2026-09-10** - Case study hero tweaks: `.hero--image` gained a `--hero-position`
  variable. **Mehavior** shows the top of its image (the logo) via `center top`;
  **Victoria Fuller** sits at `center 10%` to show the cursive name near the top;
  **Jensen's Red Barn** switched to the wide `red-barn-photo.jpg` panorama;
  **Urban Moto** now uses the **middle** band of `printtiresad.png`.
- **2026-09-10** - Case study images no longer letterbox: `.card-work` now lets the
  image define its own frame (`width: 100%; height: auto`, no fixed 4:3 box and no
  light-green panel), so there is no space above or below. Added
  `.card-work--frame` (4:3 + `object-fit: cover`) for Urban Moto's mixed-shape
  grid. Feature-image `width`/`height` attributes corrected to real dimensions to
  avoid layout shift.
- **2026-09-10** - Repo cleanup before the first commit: removed the temporary
  `refrence/` source folder (19.4 MB) and four superseded images no longer
  referenced by any page (`blue_eyes_Torrey.png`; `red-barn-photo.jpg`, which was
  the source for `hero-jensens-red-barn.jpg`; plus `site-sams-rules.jpg` and
  `site-timer-app.jpg`). All five were **moved** to
  `/home/torrey/2RE03-unused-assets-backup/` rather than hard-deleted. Added a
  minimal `.gitignore` (OS/editor cruft only); `css/`, `js/` and `fonts/` had no
  orphans.
- **2026-09-10** - Version control: `git init` on branch `main`, then the first
  commit (**79 files**, no `refrence/`). Remote `origin` is
  `ssh://git@git.2re.top:22222/2re/2RE03-Design.git` (Forgejo, SSH key
  `id_ed25519`).
- **2026-09-10** - Added **`TODO.md`** at the repo root as the single human-facing
  backlog; the memory bank keeps only current priorities and points at it. The
  **site was published** by the user, and `memory-bank/` + `.clinerules/` were
  confirmed to stay tracked.
- **2026-09-10** - **Optimised every image to WebP**: 45 files converted (long side
  capped at 1600px, `-q 82`, or `-q 90 -alpha_q 100` when transparent) and 97
  references repointed across 13 HTML files. `img/` went **20 MB -> 3.2 MB**. The
  one exception is `printtiresad.png`, kept as PNG because WebP made it bigger.
  Verified: 0 missing references, 0 unreferenced files, all 45 WebP files decode,
  all pages 200, and the before/after ratio-hint sets are byte-identical.