UI/UX Design

Visual Designer Portfolio

Challenge

A digital portfolio must be adaptable—evolving with industry trends, client expectations, and personal growth. As a multidisciplinary visual communicator, my work spans photography, website design, graphic design, social media, digital and print presentations, video, and animation. The challenge was to create a streamlined, dynamic portfolio that effectively showcases this breadth of expertise while catering to the specific needs of different audiences, from CMOs to creative directors and tech executives.

Solution

Designed and developed a modular, audience-focused portfolio website that allows for both holistic exploration and targeted deep dives into specific skill sets. The site architecture leverages UX principles to guide users through a structured experience, with curated project selections that align with market demand and hiring trends.

Key considerations included:

  • Information hierarchy & site mapping to ensure intuitive navigation.

  • Strategic content selection based on insights from industry conversations to highlight the most relevant work for securing new opportunities.

  • Custom URL segmentation, allowing for tailored portfolio views that speak directly to different audiences.

This site serves as a living, adaptable tool—ready to evolve with ongoing projects while maintaining clarity, professionalism, and ease of access for potential collaborators. For specialized work beyond the showcased selections, I invite direct conversations to provide relevant examples and discuss potential opportunities.

Duration

On going. Initial set up to publish 3 days.

https://pattiemcnab.myportfolio.com/

GTM Consulting

An Apple iMac computer displaying a website with a mountain and two hikers in silhouette, with the text 'Achieving Growth' and 'Go-To-Market Strategies & Tactics' over the mountain scene.
Smartphone screen displaying a web page about Google Ads and The New York Times with visible logos and text.

Challenge

Transition a marketing consultancy’s website to a scalable, professional platform that prioritizes a mobile-first experience and empowers the client with a user-friendly CMS for independent updates. Ensure the design supports clear information hierarchy, intuitive navigation, and brand storytelling while maintaining seamless performance across devices.

Solution

Migrated GTM Consulting’s website to Squarespace, leveraging its flexible content management system for client autonomy. Designed a mobile-first, responsive interface to enhance usability and performance, ensuring optimal UX across varying screen sizes.

To establish a strong brand narrative, I sourced and curated lead photography, reinforcing the consultancy’s collaborative approach. I integrated a dynamic one-page scroll layout with structured information architecture, refining UX to guide visitors through key offerings. Addressed UI challenges by troubleshooting interactive elements—such as custom scrolling quote cards—to align with client expectations.

In addition to web development, I conceptualized and designed a 3D logo to strengthen brand recognition, ensuring adaptability for both digital and print applications. Supplementary marketing assets were created to maintain brand consistency across the website, LinkedIn profile, and future outreach materials.

This project involved UX research, site mapping, wireframing, and iterative design refinement to create a cohesive, high-performing web presence that aligns with modern usability standards.

Duration

Website and branding projects took a total of 2 months. Website took about 5 days with troubleshooting graphics and tech.

http://www.gtmtc.com

UnOfficial Tees

Webpage header with navigation links and a collection of nine T-shirts and clothing items featuring various designs, including text and graphics, displayed on models and flat lay photos.

Challenge

Souvenir tees are often generic and uninspired. This project aimed to create a platform showcasing concept-driven designs that blend visual sophistication with insider knowledge, appealing to both travelers and industry professionals.

Solution

Developed Unofficial Tees, a digital showcase for unique travel apparel. Designed a clean, modern UI to highlight the storytelling behind each design, ensuring an intuitive UX for easy navigation.

Led branding, logo design, site architecture, and high-fidelity mockups to present the collection in a polished, production-ready format. Built the site to serve two audiences—apparel professionals seeking production partnerships and travelers wanting high-quality, design-forward souvenirs.

Integrated an e-commerce component via Printify, streamlining on-demand sales with optimized product mockups and a mobile-first layout. The result is a cohesive digital and retail experience, repositioning souvenir tees as stylish, conversation-starting pieces.

Duration

On going project. Design and all assets created in 3 days.

https://graphic-tees.myportfolio.com/

Author site: Sarina Prabasi

Book cover for 'The Coffee House Resistance' by Sarina Prabasi, featuring a coffee cup with an American flag design on a wooden surface and a chalkboard background.
A woman standing in an indoor space, wearing a navy blue dress and gray heels, with short gray hair, smiling. There are potted plants in the background and soft lighting.
A man in a gray suit jumps in front of a coffee shop called Buunni Coffee, while a woman sitting on a bench outside the shop drinking coffee looks up at him. Inside, other patrons are visible sitting at tables.

Challenge

Develop a professional author website with seamless third-party e-commerce and event management integrations. The site needed to support book sales through external retailers, offer a dynamic events calendar that could be updated via third-party software, and maintain a cohesive, engaging user experience that reflects the author's brand.

Solution

Led end-to-end project management, coordinating timelines for content collection, asset organization, and copy development while simultaneously building out the site structure.

Designed and implemented UX/UI, focusing on:

  • E-commerce integration—researched and configured third-party selling links for a smooth purchasing experience.

  • Event management system—identified and integrated a third-party calendar tool that allows for real-time updates without manual backend edits.

  • Responsive, mobile-first design—ensured optimal accessibility and readability across devices.

  • Clear information hierarchy—structured navigation to highlight the book, events, and author’s story while maintaining a polished, intuitive interface.

This project combined technical research, UX/UI design, and project coordination, resulting in a scalable, easily maintainable website that supports both the author’s brand presence and their long-term promotional needs.

Duration

2 weeks

https://www.sarinaprabasi.net

Menuez Creative Consulting

Website homepage for Menuez Creative Consulting, featuring a large orange logo, navigation links, a headline about guiding photographers, and a photo gallery with nature and landscape images.

Challenge

Develop a professional website that showcases services while providing a dynamic portfolio feature to highlight photographers collaborating with Stephanie.

Solution

Designed and built a clean, service-focused website with an intuitive UX/UI flow. Integrated a dynamic portfolio page, allowing featured photographers to be easily showcased. Provided content strategy consulting, guiding the client on necessary assets and optimizing site structure for engagement.

Duration

Completed in one month, collaborating with the client to gather and refine images from her photographers.

https://stephaniemenuez.com

Marketing Content Executive Portfolio

An Apple iMac computer screen displaying a webpage with various TV and media channel logos at the top, including Discovery, Animal Planet, VH1, and others. Below the logos, there is a section labeled 'Expertise' with a black-and-white portrait of a man and a list of skills or services such as Content Creation, Social Media Strategy & Tactics, Analytics, Planning & Building, and Digital Handyman.

Challenge
Professionals with technical, written, or conceptual work often struggle to present their expertise in a visually compelling, easily digestible format. This project required transforming a complex career history into a structured, interactive digital portfolio that effectively communicates both expertise and personality.

Solution

Designed and developed a storytelling-driven portfolio, translating non-visual work into an engaging digital experience. Implemented a clear information hierarchy, leveraging typography, layout, and interactive elements to guide viewers through key projects and milestones. Optimized UX/UI for seamless navigation, ensuring the portfolio remains polished, shareable, and adaptable for different professional contexts.

The result is a refined, strategically structured portfolio that enables the client to confidently present their skills to employers, collaborators, and potential clients.

Duration

1 week

https://www.julienmcnab.com

A colorful word cloud with words like 'calmness,' 'positive,' 'motived,' 'catalytic,' and phrases such as 'leads by example' and 'always looks out for his teammates,' emphasizing qualities of a strong team leader.
Screenshot of Julien McNab's website homepage with a yellow background, large JM logo, and text describing his experience as a digital strategist and content expert, with keywords highlighted in orange.
Three smartphones displaying a personal or professional portfolio website. The first shows a black-and-white portrait of a man with a beard, and a list of skills or services related to content creation. The second displays a section of text with images of various digital media projects, such as videos and social media content. The third contains text describing social media strategy and analytics, with an image of notebooks filled with handwritten notes at the bottom.

Non-Profit: 187 Film Festival

Laptop displaying the homepage of the 187 Film Festival website, featuring a cartoon orange monster holding a film camera and a clapperboard, with a blue sea background and the text 'Welcome to the 187 Film Festival'.

Challenge

Develop a dual-purpose website that serves as both an archive for student films and a marketing platform to attract funding and support for the annual film festival. The site needed to integrate branding, video hosting, event updates, and donation functionality while maintaining a cohesive and engaging user experience.

Solution

Led the site redesign and rebrand, establishing branding guidelines for fonts, colors, and custom graphics based on existing festival materials. Developed a structured archive system, linking 30–65 student films per year from an external hosting platform while ensuring a seamless viewing experience.

Managed UX/UI design to balance film accessibility with marketing needs, integrating event updates, donation portals, and ticket sales in collaboration with the PTO. Oversaw content updates and coordinated communications across festival-related events and coursework to maintain a dynamic, up-to-date site.

The result is a visually cohesive, user-friendly platform that preserves student work while driving engagement and financial support for the festival’s continued success.

Duration

1 month for initial build. Managed and maintained for 7 years.

https://www.187ff.com

Teal Studio

Screenshot of Teal Studio website homepage showing logo, navigation menu, introductory text, promotional graphic for logo design services, and a row of client logos.

Challenge

Develop a clean, conversion-focused website that effectively showcases client work and services while maintaining a dynamic, evolving design to stay relevant in the competitive brand identity services market. The site needed to balance visual storytelling with concise messaging, ensuring potential clients quickly grasp the value proposition without being overwhelmed by text. A clear call to action was essential to drive engagement and inquiries.

Solution

Designed and built a scalable, user-centric website, structuring the UI/UX to highlight client work with an intuitive, visually driven layout. Developed a flexible content framework, allowing for seamless updates to accommodate new projects, industry trends, and evolving brand strategies.

Key considerations included:

  • Modular design system—ensuring future adaptability while maintaining a cohesive visual identity.

  • Information hierarchy & navigation—prioritizing clarity and engagement through well-structured content blocks.

  • Strategic CTA placement—optimizing conversion points without disrupting the browsing experience.

  • Performance optimization—ensuring fast load times and responsiveness across devices.

The result is a highly adaptable, conversion-driven site that evolves with the client’s brand, keeping the presentation fresh, relevant, and impactful in a competitive industry.

Duration

Initial 1 week set up with years of ongoing updates and rebrands.

https://www.tealbranding.com

Non-Profit: School-A-Palooza

Webpage promoting Schoolapalooza, a school fundraiser event, with a drawing of a stage and seating area. The headline says 'The Greatest School Fundraiser in the Known Universe!' and indicates over $100,000 has been raised.
A poster with animated school-themed illustrations titled 'SCHOOLAPALOOZA' and a timeline of event illustrations from 2012 to 2022.
Collage of childhood school photos of children, including Michael Bridenstine, Jay Douglas, April Mae Serpa, Joe A. Serpa, Chris Jennings, David Park, Scott Schneiderman, and William Stignore.

Challenge

Develop a dual-purpose website that serves as both an archive for past fundraising shows and a marketing tool to drive ongoing financial support for the school. The site needed to maintain brand consistency across annual events, integrate video archives, and effectively communicate the fundraiser’s mission to maximize engagement.

Solution

Designed and built a scalable, content-driven website, implementing brand guidelines to ensure visual and messaging consistency year over year. Developed an archival structure for hosting and showcasing past event videos while optimizing UI/UX for clear storytelling and donor engagement.

Collaborated with local artists to create custom event artwork, enhancing the site’s visual appeal. Oversaw content updates and asset coordination, ensuring seamless integration of new fundraising goals, event details, and promotional materials. The result is a cohesive, evolving platform that strengthens community support and increases donor visibility.

Duration

1 month with ongoing updates over 5 years.

https://www.palooza187.com/shows

Artist Portfolio

Challenge

Create a versatile digital showcase for traditional and digital artwork, catering to high school and university audiences with varying preferences for engaging with art. The site needed to present individual pieces and creative process insights in a structured, visually compelling format while remaining flexible as the artist refined their focus.

Solution

Photographed and digitized traditional artwork, designing high-fidelity display cards in Photoshop to present both final pieces and artistic progression. Developed and iterated on UX/UI enhancements, ensuring a clean, adaptable layout that evolves with the artist’s vision. Optimized content presentation to balance storytelling with intuitive navigation, creating a seamless viewing experience for diverse audiences.

Duration

Initial set up 2 weeks. Updates ongoing.

https://www.vivienmcnab.com

Additional sites not online anymore