top of page
My UX Portfolio
Explore my UX projects and see how I approach design challenges from start to finish.
Empower Connection Tutoring App UX Case Study
I designed a parent-facing app to simplify tutor booking through research-backed iteration.
Nature IS Nature App UX Design Case Study
A mobile-first solution designed to motivate and reconnect teenagers with the outdoors.
Vital Witch Website
Freelance end-to-end UX design
Empower Connection Tutoring App
Exploring Early Ideas
I started by sketching multiple home screen concepts on paper, experimenting with layouts and feature placement. These quick, low-fidelity wireframes let me visualize different approaches, spot potential navigation issues, and gather insights before committing to digital designs. This step was all about exploring possibilities and setting the foundation for user-centered iteration.
From Sketch to Digital Wireframe
This side-by-side comparison shows the evolution of the home screen from initial paper sketches to a digital wireframe in Figma. Moving to digital allowed me to refine the layout, test visual hierarchy, and establish consistent spacing. This transition bridged the gap between brainstorming and prototyping, ensuring a solid foundation for user testing.
Formalizing the Structure
Following the sketching phase, I translated my findings into a comprehensive Information Architecture. This map defines the parent’s journey from tutor discovery to final booking, ensuring a logical flow across the entire application.
Mapping the Path to Booking
This prototype flow visualizes the end-to-end journey of a parent finding and booking a tutor. Mapping this complete path helped me identify potential friction points and ensure a logical progression toward the final goal. This interactive stage was crucial for validating the navigation before moving into usability testing.
Synthesizing Insights through Affinity Mapping
Using an affinity diagram in FigJam, I organized user testing feedback to identify critical pain points. The most significant finding was that 100% of users found the initial home screen confusing, noting a lack of a clear primary action. This insight led me to prioritize a redesign of the 'Find a Tutor' entry point to ensure a frictionless start to the booking process.
Early High-Fidelity Prototype
This screen represents the first transition into a high-fidelity interface. Although visually polished, usability testing at this stage revealed that parents still struggled with a clear 'starting point.' Acknowledging this friction allowed me to move past my initial assumptions and iterate further on the visual hierarchy to better guide the user toward booking.
Final Home Screen: Prioritizing Clarity
To resolve the navigation confusion found in testing, I redesigned the home screen to focus on a single, clear primary action. By simplifying the layout and moving secondary information to a new dedicated screen, I reduced the user's cognitive load and created a direct path to tutor discovery
Strategic Screen Split for Enhanced Clarity
User research revealed the initial design was ambiguous with no clear call to action, so I separated the content into two distinct screens. This split reduced cognitive load and provided a more intuitive navigation path, allowing parents to focus on discovering classes after they’ve engaged with the primary home screen.
Final Confirmation & Reimbursement Support
The final screen in the flow provides a clear booking confirmation and a one-click PDF invoice download. I specifically designed this feature to help parents who need to submit educational expenses for reimbursement—demonstrating that my design process goes beyond aesthetics to solve real-world logistical needs.
Planning for Multi-Device Responsiveness
To ensure a seamless experience across all devices, I developed wireframes for both tablet and desktop. This stage allowed me to explore how the parent’s dashboard and search filters would adapt from a vertical mobile view to a wider, multi-column layout on larger screens.
Final High-Fidelity Responsive Design
The final mockups demonstrate a cohesive brand identity and consistent functionality across mobile and desktop. By leveraging the additional screen space on desktop, I was able to provide parents with a more comprehensive view of tutor profiles and scheduling calendars, making the final booking decision even easier.
Nature IS App for Teens
From Behavioral Observation to Actionable Design Strategy
This end-to-end journey audit served as the diagnostic tool for the project. By layering task flows with emotional mapping, I pinpointed specific stages where teen autonomy was at risk, directly informing the "Improvement Opportunities" that define the app's core value proposition.
Bridging Strategy and Structure through Low-Fidelity Prototyping
I translated the "Improvement Opportunities" from my research into a functional low-fidelity flow, focusing on information architecture and core user interactions. This phase allowed for rapid testing of the teen engagement loop, ensuring the navigation logic was sound before committing to high-fidelity visual design.
Low-Fidelity Testing: Validating Flow and Visual Accessibility
I utilized this low-fidelity "Drawing Challenge" prototype to simultaneously test task completion and initial brand direction. While the user flow was successful, early testing revealed that the initial typography hindered readability for the target teen demographic. This insight allowed for a critical pivot in the visual system before moving into high-fidelity production.
From Raw Data to Strategic Product Pillars
By clustering qualitative insights in FigJam, I identified four primary friction points in the current outdoor discovery process for teens. This synthesis directly informed the product’s information architecture and allowed me to advocate for a "low-pressure" social model that addressed the specific anxieties identified during the mapping process.
Iterative Refinement of the Search and Discovery Ecosystem
Initial research indicated that the search functionality felt unclear and lacked direction for the target demographic. I responded by redesigning the wireframes to include proactive search cues and intuitive map categories. This iteration focused on increasing user confidence and ensuring the path from "search" to "trailhead" was seamless and self-explanatory.
High-Fidelity Execution: Establishing a Scalable Visual Language
I translated the validated wireframes into a high-fidelity design system tailored for outdoor use. This phase focused on establishing a "teen-centric" aesthetic while maintaining strict WCAG accessibility standards for color contrast and touch targets, ensuring the interface remains functional in high-glare, real-world nature environments.
Orchestrating a Frictionless End-to-End User Flow
The final interactive prototype validates the entire user journey, from initial search to successfully starting a nature challenge. I focused on smooth transitions and intuitive navigation patterns to ensure the experience feels "native" to a teen audience, reducing the time from app-open to outdoor-action.
Designing for Delight: Validating the Success Loop
The final success state focuses on rewarding the user’s physical effort. I utilized celebratory microcopy and a vibrant visual hierarchy in the "Congratulations" screen to reinforce positive behaviors, ensuring the digital experience complements the real-world achievement of completing a nature challenge. I also made the achievement shareable in response to user research.
bottom of page