phase 1
Prototyping
Using Claude AI coding, I developed a fully functioning website prototype that reflected the planned user flows and core interactions. At this stage, the focus was on functionality and structure — ensuring that navigation, product pages, subscription flows, and checkout processes were operational. This allowed for early usability testing and rapid iteration before investing in visual design.
Cascade Peak Coffee
Cascade Peak Coffee is a growing Bend-based roastery with a loyal in-person customer base but low online sales. They hired us to redesign their Shopify storefront to improve mobile conversion, highlight their subscription program, and create a cohesive, modern design system for future growth.
Skills used:
AI Prototyping with Claude, UX/UI Design, Web & E-Commerce Design, Adobe XD, Responsive Layouts, Information Architecture, Component Library Creation, Motion Design (Lottie), Developer Handoff.
phase 2
Styling
With the functional prototype in place, I used Claude AI coding to layer on the complete visual design system. This included:
-
Typography scale (H1–H6, body, captions)
-
Color tokens (brand, neutral, and accent palettes)
-
UI components such as primary/secondary buttons, product cards, navigation menus, subscription toggle, and checkout form fields
-
Spacing and layout grids for responsive and adaptive breakpoints
Lottie Animation - Coffee Bean Loading
Brand Guidelines
