Peter Pielaet-Strayer

Learning Designer & Mentor

Opening Doors to independence, critical thinking, and real-world exploration

0:00 / 0:00

A 15-second Studio Ghibli–style animated journey through reflection, growth, and human connection—capturing the essence of learning design.

Peter Pielaet-Strayer

I'm a learning designer and mentor with a passion for creating educational experiences that empower growth and curiosity.

My background in education and technology has taught me that the best learning happens when we open doors: to independence, to critical thinking, and to real-world exploration.

Currently, I'm pursuing a Master's in Learning Design and Technology at the University of San Diego, where I'm developing new approaches to educational technology and instructional design.

This portfolio documents my journey and showcases projects that reflect my commitment to meaningful, accessible learning for all.

Design Philosophy in Action

A preview of how my learning design thinking comes to life across different domains

Every project I create asks the same questions that guided my wine work: How can we help people slow down, reflect, and connect with what truly matters?

See All Projects

Community Building

Creating spaces where people can connect, learn, and grow together.

Wellness Technology

Designing tools that support mental health and personal development.

Learning Design

Structuring experiences that open doors to new understanding.

How I Built This

A technical deep-dive into the architecture and decisions behind this portfolio

⚡

Performance First

Vanilla JS for optimal loading, CSS Grid for responsive layouts, and optimized assets for sub-2s load times.

2.1s Load Time
🎨

Custom Video Player

Built from scratch with custom controls, timeline scrubbing, and accessibility features for the hero video.

100% Custom
🤖

AI Integration

Serverless function integration with OpenAI API for the "Learn Something New" feature using Netlify Functions.

0ms Cold Start
📱

Mobile-First Design

Responsive design with CSS Grid, Flexbox, and custom breakpoints for seamless experience across all devices.

100% Responsive

Architecture Overview

Frontend HTML5, CSS3, Vanilla JS
Styling Custom CSS, CSS Grid, Flexbox
Functions Netlify Functions, OpenAI API
Deployment Netlify, CDN, HTTPS

Let's Connect

If something I shared resonated with you, I'd love to hear from you.

Send a Message

Note: This is a demo form. For now, please reach out directly via email.

Or reach out directly

pielaetstrayerp@gmail.com

Connect on LinkedIn