Portfolio

My Work

Selected UX/UI, front-end, e-commerce, accessibility, and print design work.

VELOFRED.com

E‑Commerce UX + Front-End

Compatibility Builder • Homepage • Brands • Filtering

700x23

E‑Commerce UX + Front-End

Catalog UX • Homepage • Compatibility Builder

Daily Uplift

UX/UI Case Study

Research • IA • Prototyping

Indo‑American Center

Website Redesign

Accessibility • UX • UI

Web / Product

E‑commerce platforms, UX/UI improvements, and website redesigns.

Featured case study

VELOFRED.com — E-Commerce UX & Front-End Development

BigCommerce UX/UI Front-End Catalog Discovery

Redesigned VELOFRED homepage — Redesigned homepage and product-discovery hierarchy

VELOFRED is a specialty bicycle-accessories retailer with a large, compatibility-sensitive catalog. I redesigned and coded major storefront experiences to help customers understand the product range, discover relevant brands, narrow category results, and compare similar products with greater confidence.

Role UX/UI Designer & Front-End Developer

Platform BigCommerce

Focus Discovery, compatibility, responsive UI

The Challenge

Customers may shop by product type, brand, mounting system, bicycle compatibility, or replacement-part need. The storefront needed to support each path without overwhelming users or forcing them through an undifferentiated catalog.

Recent Storefront Updates

Homepage Redesign

Reorganized the front page around compatibility-led messaging, category entry points, featured products, new arrivals, and brand discovery.

Custom Brands Directory

Coded a brand guide with featured-brand descriptions, product-type groupings, and an interactive A–Z directory.

Brand Filtering

Implemented category-level brand filtering so shoppers can narrow large collections while keeping the current category and sorting context.

Product Comparison Rebuild

Recoded the comparison presentation for clearer alignment, stronger visual hierarchy, easier product removal, and responsive behavior.

KLICKfix Compatibility Builder

Designed and implemented a guided product finder that lets shoppers combine product category, mounting point, and fastening-system filters, with product-name or SKU search, to narrow KLICKfix products to the most relevant options.

Design & Development Approach

Progressive product discovery: Customers can begin with a category, brand, product type, or specific compatibility need.
Reusable components: Homepage modules, brand cards, filter controls, and comparison patterns can scale with the catalog.
Responsive implementation: Layouts and controls are designed for desktop, tablet, and mobile use.
Content-aware UX: Product identity, technical detail, and compatibility guidance remain central to the shopping experience.
Search visibility: Page structure, headings, internal links, and customer-facing copy support on-page SEO.

Outcome: A clearer and more scalable storefront that gives customers stronger entry points into the catalog, makes unfamiliar brands easier to understand, and adds a guided compatibility workflow for one of VELOFRED’s most technical product systems.

View Compatibility Builder View Homepage View Brands Directory View Brand Filtering View Comparison Page

Ongoing storefront work

700x23 — E-Commerce UX, Front-End & Catalog Systems

BigCommerce UX/UI Front-End Catalog UX

700x23 is an e-commerce storefront for bicycle accessories, replacement parts, tools, and riding essentials. I continue to refine its catalog navigation, homepage merchandising, responsive presentation, and product-discovery tools.

Role UX/UI Designer & Front-End Developer

Platform BigCommerce

Focus Catalog discovery, merchandising, responsive UI

Latest Updates

Homepage Product Discovery

Structured the homepage around category exploration, featured products, and new arrivals so shoppers can move into the catalog from multiple entry points.

Catalog Navigation

Continued refining category structure and storefront patterns for a broad inventory of accessories, components, replacement parts, and maintenance products.

KLICKfix Compatibility Builder

Added the guided compatibility experience to 700x23 as well, giving shoppers the same combined filters for product category, mounting point, fastening system, and product-name or SKU search.

Design & Development Focus

Product discovery: Multiple paths into a large catalog through categories, featured products, new products, brands, and compatibility-led browsing.
Front-end implementation: Responsive storefront customization using HTML, CSS, JavaScript, and platform theme components.
Reusable UX patterns: Shared interaction concepts are adapted across VELOFRED and 700x23 while preserving each storefront’s content needs.
SEO foundations: Semantic structure, internal linking, metadata, and accessible content hierarchy.

Outcome: A more structured storefront with stronger catalog entry points and a guided compatibility tool for customers shopping the KLICKfix system.

View Compatibility Builder View 700x23.com

Daily Uplift — A Positive Habit Tracker (UX/UI Case Study)

Research IA Prototyping Testing

Daily Uplift is a minimalist habit-tracking app designed to help users build one positive habit at a time through simple daily prompts. Completed as part of the UX/UI Design course at the University of Minnesota.

Project file: Daily Uplift — Positive Habit Tracker (PDF)

Challenge

Many productivity apps feel overwhelming due to complex features and cluttered interfaces. The goal was to design a simple, intuitive experience that supports consistent habit-building without adding mental load.

What I did

Conducted competitor analysis, interviews, and surveys to identify user needs and motivations.
Created personas and flows to prioritize low-effort, high-clarity interactions.
Built prototypes and iterated through feedback and usability testing.

Outcome: A supportive, user-friendly habit experience focused on one daily prompt, progress tracking, and reflection.

Indo‑American Center — Website Redesign

Accessibility Navigation UI Testing

Indo-American Center redesign screenshot

Challenge

The existing site was difficult to navigate, visually outdated, and lacked mobile optimization and accessibility compliance. Pain points included poor content hierarchy, inconsistent design, missing alt text, and limited interactive features.

Solution

Restructured navigation and page hierarchy to simplify access to key resources.
Developed wireframes and reusable patterns to standardize the UI.
Created prototypes for mobile and desktop and refined decisions through feedback and iterative review.

Outcome: A modern, responsive, and more accessible experience that improves discoverability and engagement.

Graphic + Print

Large-format boards and print-ready design work.

Custom Car Show Boards

Print Design Layout Typography Production

Designed large-format show boards to showcase a vehicle’s story, specifications, and key details in a clear, visually striking way. Focused on hierarchy, readability at a distance, and print-ready layout.

Hierarchy: Clear scanning order for specs and story
Typography: Readable at distance, consistent styling
Production: High-resolution print export and layout preparation
Consistency: Visual system aligned to vehicle/brand aesthetic