Updating about me

Author: ProCO-RPHopkins

frontend/index.html

@@ -54,7 +54,9 @@
       <div class="w-full md:w-1/2">
         <div class="backdrop-blur-lg bg-white/80 dark:bg-white/10 ring-1 ring-gray-300 dark:ring-white/15 shadow-2xl rounded-3xl p-8 md:p-12 transition-all duration-500 hover:shadow-teal-500/20 dark:hover:shadow-teal-500/30">
           <h1 class="text-4xl sm:text-5xl md:text-6xl font-extrabold mb-4 text-teal-600 dark:text-teal-300 drop-shadow-lg">Ryan Hopkins</h1>
-          <p class="text-lg sm:text-xl font-light mb-8 text-gray-700 dark:text-white/90">AI Architect & Solutions Engineer · Agentic Systems Builder · Strategist & Designer</p>
+          <p class="text-lg sm:text-xl font-light mb-8 text-gray-700 dark:text-white/90">
+            AI Systems & Context Architect — I design reliable, human‑centered LLM workflows and ship full‑stack tools that turn messy data into decisions.
+          </p>
           <div class="flex flex-wrap gap-3 mb-8">
             <span class="px-3 py-1 bg-amber-100 dark:bg-amber-500/20 text-amber-800 dark:text-amber-200 rounded-full text-sm">AI Systems Engineer</span>
             <span class="px-3 py-1 bg-cyan-100 dark:bg-cyan-500/20 text-cyan-800 dark:text-cyan-200 rounded-full text-sm">Tech Design (UX/UI)</span>
@@ -178,16 +180,45 @@ <h2 class="text-3xl font-bold mb-12 text-center text-teal-600 dark:text-teal-300
   <section id="about" class="max-w-6xl mx-auto px-6 py-24">
     <div class="flex flex-col md:flex-row gap-8 items-start">
       <div class="md:w-1/3">
-        <img src="assets/about.jpg" alt="Ryan Hopkins" class="w-full aspect-square object-cover rounded-xl shadow-lg">
+        <img src="assets/about.jpg" alt="Ryan Hopkins portrait" class="w-full aspect-square object-cover rounded-xl shadow-lg" />
       </div>
       <div class="md:w-3/5">
         <h2 class="text-3xl font-bold mb-6 text-teal-600 dark:text-teal-300">About Me</h2>
-        <p class="text-gray-700 dark:text-white/85 leading-relaxed mb-6">
-          I'm Ryan Hopkins, a Master's‑trained Industrial‑Organizational psychologist turned AI strategist. Passionate about agentic architectures, I design and prototype systems that blend human‑centered research with cutting‑edge language models to drive social impact—especially in justice tech and reentry support.
+
+
+        <p class="text-gray-700 dark:text-white/85 leading-relaxed mb-4">
+          I’m Ryan Hopkins — an <strong>AI systems engineer & context architect</strong> with an M.S. in Industrial‑Organizational Psychology. I focus on building <strong>reliable LLM features</strong> by pairing clear context patterns with small, testable delivery steps.
         </p>
-        <p class="text-gray-700 dark:text-white/85 leading-relaxed">
-          With a unique background in behavioral psychology and AI engineering, I create solutions that understand human complexity while leveraging the scalability of modern AI systems.
+
+
+        <p class="text-gray-700 dark:text-white/85 leading-relaxed mb-4">
+          I work across the stack with <strong>Node/Express</strong>, <strong>MongoDB</strong>, and EJS + Bootstrap, and I keep model behavior consistent with lightweight evaluation loops. I develop on <strong>WSL2 (Ubuntu)</strong>, containerize with <strong>Docker</strong>, and wire basic <strong>CI checks</strong> around model calls.
         </p>
+
+
+        <p class="text-gray-700 dark:text-white/85 leading-relaxed mb-6">
+          Recent work includes <strong>Snapshot X‑Ray</strong> (a new app exploring faster spec‑to‑code loops) and <strong>Achieve Reentry</strong> (AI‑assisted job tools). I’m currently exploring <strong>multi‑agent workflows</strong> and <strong>LLM observability</strong>.
+        </p>
+
+
+        <h3 class="font-semibold mb-2">How I build with LLMs</h3>
+        <ol class="list-decimal pl-5 space-y-1 text-sm text-gray-700 dark:text-white/80 mb-6">
+          <li><strong>Discuss & design:</strong> iterate on ideas; write a clear problem statement and solution outline.</li>
+          <li><strong>Roadmap:</strong> segment features into phases and “next steps.”</li>
+          <li><strong>Protocols:</strong> define instruction schemas, stop‑points for questions, and testable deliverables for each step.</li>
+          <li><strong>Ship in slices:</strong> build one step at a time with small evals/fixtures.</li>
+          <li><strong>Verify:</strong> keep regression sets, logs, and guardrails; refine prompts/context when tests fail.</li>
+        </ol>
+
+
+        <!-- Compact skill badges (optional) -->
+        <div class="flex flex-wrap gap-2">
+          <span class="px-2 py-1 bg-gray-200 dark:bg-slate-700 text-xs rounded">Prompt/Context Patterns</span>
+          <span class="px-2 py-1 bg-gray-200 dark:bg-slate-700 text-xs rounded">Instruction Protocols</span>
+          <span class="px-2 py-1 bg-gray-200 dark:bg-slate-700 text-xs rounded">Evaluation & QA</span>
+          <span class="px-2 py-1 bg-gray-200 dark:bg-slate-700 text-xs rounded">Phased Delivery</span>
+          <span class="px-2 py-1 bg-gray-200 dark:bg-slate-700 text-xs rounded">Docs & Runbooks</span>
+        </div>
       </div>
     </div>
   </section>