UX/UI, HTML, CSS, BOOTSTRAP

Web Design

Logo with the words "Live London" and a heart-shaped design featuring the Union Jack flag.

A travel-inspired website capturing my experiences abroad in London (Fall 2025).

Skills & Tools Used:

  • Front-End Development: Hand-coded 5 pages of code using HTML, CSS, and Bootstrap for a fully responsive layout.

  • Interactive Features: Added JavaScript to power the image gallery and enhance user engagement.

  • Visual Design: Created a custom logo in Canva to complement the site’s modern, travel aesthetic.

  • Version Control: Utilized GitHub for repository management and project deployment.

  • Photography: Featured original photos from my time in London to create a personal and authentic look.

  • Content Creation: Utilized AI-generated copy (per assignment guidelines) to meet short project timelines.

LiveLondon
Screenshot of a website promoting London tourism, showing a silhouette of the city skyline with Big Ben and Westminster Palace, street lamps, and double-decker buses at dusk. The text reads "Discover London" with a button labeled "Start Exploring."
Text reading 'Embarking on ECO' on a dark green background

A mobile app concept designed to showcase JMU Dining’s eco-friendly initiatives — from sourcing local ingredients to reducing environmental impact — while keeping students and faculty connected, informed, and well-fed (Fall 2024).

Project Overview:
This project was part of my Visual Web Design course, where I developed a full UX research and design process for an original app concept. I explored how digital experiences can communicate sustainability, community impact, and food transparency in a relatable, engaging way.

Key Contributions & Skills:

  • User Research: Conducted surveys, 1-on-1 interviews, and card-sorting exercises to understand user expectations and information priorities.

  • Information Architecture: Created a structured navigation system informed by user testing results and content mapping.

  • Wireframing & Prototyping: Used Figma to design high-fidelity app mockups, emphasizing accessibility, intuitive navigation, and eco-conscious visual design. (View my Figma board here)

  • Visual Design: Developed an earthy, modern aesthetic using greens, neutrals, and natural textures to reflect sustainability and wellness.

  • Documentation: Compiled a 9-page project PDF outlining research findings, user personas, design goals, and final mockups.

Tools & Methods:
Figma (UI/UX Design & Prototyping) • Google Forms (Surveys) • Miro (Card Sorts) • Adobe Illustrator • User Testing • Information Architecture

Figma Board
A detailed infographic titled "Embarking on ECO" featuring a site map, navigation rationale, wireframes, and notes on wireframe changes. The site map includes sections for Eco at JMU, Eco Around Harrisonburg, and General Climate Knowledge, with subsections and icons representing different topics. The navigation rationale explains app design choices to help students find environmental resources. The wireframes show a visual layout of app screens, with annotations about changes from wireframes to mock-ups.
A black triangle with white and black outlines, with horizontal rainbow-colored bars extending from its right side, including red, orange, yellow, green, blue, and purple.

The Top 5 Best Pink Floyd Songs (Fall 2024)

Skills & Tools Used:

  • Web Development: Built using HTML and CSS, experimenting with layout, color, and structure.

  • Graphic Design: Designed a custom logo in Adobe Illustrator inspired by Pink Floyd’s signature style.

  • Content Creation: Wrote original music-based content and curated visuals for an engaging user experience.

  • Creative Exploration: Combined artistic expression with coding fundamentals, marking the start of my web design journey.

Pink Floyd
Webpage highlighting Pink Floyd's top 5 best songs, featuring a section about the song "Wish You Were Here" from their 1975 album, with Pink Floyd logo at the top left.