PortfolioUI/UX Design

Kayla Lake Portfolio

A modern portfolio website for a Senior UI/UX Designer at GoDaddy, built with Next.js 14 and TypeScript, featuring immersive image galleries with custom drag-scroll interactions and smooth animations that showcase design work beautifully.

Overview

Developed a modern portfolio website for Kayla Lake, a Senior UI/UX Designer at GoDaddy, using Next.js 14 and TypeScript. The site showcases her design work through immersive image galleries with custom drag-scroll interactions and smooth animations, creating an experience that matches the quality of her UX portfolio. Built from scratch with modern React patterns and a focus on performance.

Interactive Gallery System

The centerpiece of the site is a custom-built gallery system designed to showcase UX design work:

Drag-Scroll GalleriesCustom horizontal galleries for intuitive browsing

Smooth TransitionsCSS transitions and hover effects on gallery items

Lazy LoadingBlur-up placeholders for optimal performance

Touch-FriendlyInteractions optimized for mobile and tablet users

Full-Screen ViewImage viewing with keyboard navigation support

Custom Design System

Created a bespoke visual identity through Material-UI's theming system:

Custom Color PaletteBrand-derived colors matching client aesthetic

Typography SystemCarefully selected font pairings for elegance

Component OverridesCustom buttons, cards, and navigation elements

Visual RhythmConsistent spacing and alignment throughout

Dark Mode SupportAdjusted color values for dark theme

Technical Stack

Built with modern web technologies for performance and maintainability:

FrameworkNext.js 14 with App Router

LanguageTypeScript for type safety

UI LibraryMaterial-UI with custom theme

AnimationsCSS transitions & transforms

RenderingSSR + SSG for performance

HostingVercel with edge caching

Results

Professional Showcase

Design that reflects the quality of her UX work

Fast Load Times

Optimized images with Next.js performance features

Engaging Experience

Intuitive gallery keeps visitors browsing longer

Mobile-First Design

Great experience across all device sizes

Key Learnings

Material-UI Theming MasteryDeepened my expertise in MUI's theming system, learning to create cohesive design systems through custom palette definitions, component overrides, and responsive breakpoint configurations.

Custom Interaction PatternsDeveloped custom drag-scroll gallery interactions that feel natural on both desktop and touch devices, balancing smooth animations with performance considerations.

Portfolio-Specific UXLearned how to design interfaces that let visual work speak for itself, minimizing UI chrome while maintaining clear navigation and strong calls-to-action.

Image Optimization StrategiesRefined approaches to handling high-resolution portfolio images, implementing lazy loading, blur placeholders, and responsive image sizing for optimal performance.

View All Projects