2RE03-Design/memory-bank/productContext.md
2RE 53ca1fb834 Initial commit: 2RE03 portfolio site
Static HTML/CSS/JS portfolio for the design studio 2RE03: locally vendored Bootstrap 5.3.3, self-hosted Inter + Space Grotesk fonts, six pages, Collins-style scroll-snap carousels, a case-studies index with 10 detail pages, and a Web3Forms contact form.
2026-09-10 19:06:52 +08:00

2.7 KiB

Product Context - 2RE03 Portfolio Site

Why this project exists, how it should work, and the experience it should create. Last updated: 2026-09-10.

Why It Exists

2RE03 needs a public, client-facing portfolio. Today the material lives in loose reference files. A dedicated site gives the company a single place to present work, explain capabilities, and be contacted.

Problems It Solves

  • Prospective clients can't currently browse the body of work in one place.
  • The breadth of capability (not just web design) isn't communicated.
  • There's no clear path from "interested" to "contact us".

Audience

Prospective clients who need design work - especially web design - across a wide range of industries.

How It Should Work (UX Goals)

  • Quickly communicate: who 2RE03 is, what it does, and what its work looks like.
  • Gallery-forward browsing by category, with short captions.
  • Web design leads, but all five categories are visible and credible.
  • Fast, lightweight, readable on mobile and desktop.

Tone & Voice (IMPORTANT - anchors all copy)

Current direction (updated 2026-09-10): more professional, and it should read as a team ("we") rather than a lone freelancer - while keeping an edge. The original avocado-hipster tagline (from refrence/index.html) is retired (no longer used on the homepage).

Carry through:

  • Confident and professional, but never stiff or corporate.
  • Team voice - "we", a studio/team.
  • A little edgy and wry. Dry humor; willing to poke fun at design-industry clichés - but the joke never gets in the way of the point.
  • Concise. Short, punchy lines.
  • Substance underneath. refrence/2re03text.html frames each project as a functional problem with a purpose ("Each model was built for practical use."). Blend a wry headline with plainspoken, craft-focused body copy.
  • Avoid corporate buzzword soup and overblown sales language.
  • No em dashes. They make copy read as AI-generated. Use commas, colons, or parentheses, or restructure the sentence instead.

Voice summary: Sharp, professional, team-voiced, with a wink.

Content Model (proposed)

  • Categories / "series": Logos, Web Design, App Design, Print Design, 3D Modeling, Words.
  • Per work item: image + optional short caption/title.
  • Per category: title, one-line caption, image gallery, and a short tone-matched blurb.

Proposed Site Sections

  1. Hero / landing (name + tagline, tone-reference inspired).
  2. Case Studies (Collins-style typographic index + detail pages).
  3. Work / portfolio (category galleries).
  4. About (company story; no individual attributions).
  5. Services (web design first, then broader design capabilities).
  6. Contact.