THE NARRATIVE | Lori Olson — UI/UX Design Engineer

Lead Feature

Designing Accessible, Human-Centered Digital Experiences.

Welcome to my portfolio. I specialize in bridging the gap between high-impact visual design and clean, accessible front-end architecture. With a deep commitment to WCAG guidelines, performance, and modern editorial typography, I build web solutions that everyone can navigate seamlessly.

Whether refactoring complex interface components for WCAG 2.2 AA compliance or engineering responsive design systems, my focus remains grounded in usability, craft, and code clarity.

Profile & Biography

The Backstory

Hi! I'm Lori and I build accessible, story-driven interactive experiences for the web. Eleven years in, I still care most about the same thing: making sure the people a story is meant to reach can actually get to it.

My work spans corporate product design and higher ed, but the pieces I'm proudest of live in interactive documentaries, scroll-driven data visualization, and accessibility work that treats inclusion as a human question, not a compliance one.

Looking for teams where narrative and craft matter equally: public media, journalism, nonprofits, mission-driven organizations.

Minneapolis-based. Always building something.

Accessibility

This publication is engineered to adhere strictly to WCAG 2.2 Level AA guidelines. It features keyboard-operable controls, explicit contrast ratios exceeding 15:1, screen-reader semantics, and respected motion preferences.

I welcome your feedback on the accessibility of this site. Please let me know if you encounter accessibility barriers: lolsonportfolio@icloud.com

WCAG 2.2 AA Compliant Edition

Selected Works & Case Studies

5 Issues Enclosed

¶ Educational Training App

Digital Health Onboarding

An interactive digital health onboarding app that transforms dense compliance training into a progressive, accessible learning experience.

Published: 2025-08-15

UX/UI Accessibility Healthcare JavaScript

¶ Long-Form Web Documentary

Something is in the Food

An original longform web documentary investigating the 2026 cyclosporiasis outbreak in the United States using scrollytelling data visualizations, a D3.js choropleth map, and parallax photography.

Published: 2026-07-14

D3.js chart.js Data Visualization HTML CSS javaScript

§ UI/UX Case Study

The Appeal

An unsolicited design overhaul for an investigative journalism nonprofit. The redesign prioritizes narrative flow and reader engagement, treating visual hierarchy as a tool to pull readers deeper into complex investigations.

Published: 2025-08-15

UI/UX Sitemap Wireframe

& Community Platform

The Workshop

A digital platform for a Minneapolis skill-sharing cooperative featuring GSAP-driven scroll interactions, fluid typography, and accessible component architecture.

Published: 2025-08-15

GSAP Chart.js swiper.js HTML CSS

§ Design System & Dev

The Narrative Design System

An end-to-end editorial component system built to WCAG 2.2 AA standards with fluid typography and tokenized theme rules.

Published: 2026-03-24

Astro Tailwind CSS