Web Platform for a Travel Content Creator
Designed and developed a content-driven Shopify website that transforms a travel creator's personal brand into a scalable digital platform for storytelling, audience engagement, and long-term business growth.
Project Snapshot
Solo Brand & UX/UI Designer | Front-End Developer
6 Weeks
Information architecture, sitemap, Shopify metaobject CMS, wireframes, visual design system, front-end development, accessibility audit
Figma, Shopify
Annie came to me with a single wireframe and a clear vision for her next chapter, building a home for her travel community. The challenge was to architect a site that was built to scale: one that could accommodate growing content across blog, video, and resources while empowering Annie to manage it entirely on her own, without developer support.
Key Challenges:
X Fragmented digital presence with no unified home base
X No scalable content management system for ongoing blog and trip publishing
X Existing brand assets needed accessibility refinement for a global audience
X Site needed to function as a business engine, driving conversion, community growth, and YouTube engagement simultaneously
Project Goals:
✔️ Expand a single homepage wireframe into a comprehensive 6-page content ecosystem
✔️ Integrate YouTube content, long-form blog, and curated resources into intuitive navigation pathways
✔️ Build a custom CMS using Shopify metaobjects, enabling zero-code content updates
✔️ Refine brand assets to meet WCAG 2.1 accessibility standards across all six pages
Site Architecture & Strategic Planning
Before touching Shopify, I analyzed Annie's existing content and audience engagement patterns to understand what the site needed to do as a business tool, not just a portfolio. I identified key conversion touchpoints, affiliate links, Amazon shop, and digital products, and mapped them across a 6-page sitemap that guides visitors from high-level discovery to specific action. Content hubs were defined for blog, trips, and resources, each structured around a distinct visitor intent.
Sitemap expanding Annie's single wireframe into a 6-page ecosystem structured around discovery, engagement, and conversion.
Structuring the Content Ecosystem
Following the sitemap, I translated each content type into a distinct wireframe template, from simple archive grids (Blog Posts, Resources) to the more complex nested structure required for Trip Details, balancing itinerary, accommodations, and food content within a single scannable page.
Wireframes for six core page types (Blog Posts, Blog Post, Trips, Trip Details, Resources) translating the sitemap into structural layouts for each content category.
Brand & Visual Strategy
Annie provided her core brand assets, a warm, consistent pink carried throughout her existing site and content, but no formal color palette, contrast standards, or typographic system. My role was to translate that instinctive brand feel into a defined, high-functioning digital design system: building a true palette anchored in her signature pink, adjusting values for accessible contrast, and establishing a consistent typography and spacing scale across all six pages. Drawing on my photography background, I curated and integrated Annie's brand imagery and video content so every visual, whether a photo, a card, or an embedded YouTube video, either deepens the narrative of a trip or provides social proof for a resource. The result is a unified visual system that feels as personal as it does professional.
Before and after: Annie's original homepage had a consistent pink accent and warm photography but no formal palette, typographic system, or contrast standards. The evolved version applies a defined palette anchored in her signature pink, consistent typography and spacing, and fully functioning content, including the live YouTube embed and populated blog cards.
CMS Implementation & Client Independence
The most technically complex challenge was building a backend that Annie could operate entirely without developer support. I engineered a custom CMS using Shopify metaobjects, a plug-and-play toolkit. New blog posts and trip itineraries are updated in minutes. Global content, such as images, text, and affiliate links, can be updated in one place and automatically reflect site-wide. Templates maintain brand consistency regardless of what content is uploaded, giving Annie full creative control without the risk of breaking the design.
Visualizing the pipeline: From Shopify Metaobjects (left) to the live rendered Resources page (right)
The Live Site in Action
With the architecture and CMS in place, the final step was ensuring the experience felt as polished as it functioned. The live site translates the six-page structure into smooth, intuitive navigation, guiding visitors from the travel-themed hero straight into blog content without friction.
A screen recording of the live site demonstrating navigation menu interaction and the transition from hero section to blog content.
A Platform Built to Scale
The redesigned Shopify website provides Annie with a scalable platform that supports content publishing, audience engagement, and business growth, while allowing her to manage everything independently.
Scalable Information Architecture
Expanded a single-page concept into a structured six-page experience with intuitive navigation across travel guides, blog content, resources, and trips.
Client-Managed Content System
Built a custom Shopify Metaobject CMS that enables Annie to create and update content independently without developer support.
Cohesive Brand Experience
Established a repeatable visual system through consistent typography, color, spacing, and reusable components, creating a polished experience across every page.
Business-Ready Website
Integrated affiliate products, brand partnerships, and promotional content into the user journey, allowing the website to support both audience engagement and revenue generation.
Working with Annie as one of my earliest clients reinforced that a solution is only successful if the client feels confident using it. While building a sophisticated Shopify backend solved the technical challenge, the real success was enabling Annie to manage her content independently. That experience reshaped how I approach client projects today by prioritizing onboarding, clear documentation, and conversations about how involved clients want to be in maintaining their websites. Sometimes the best design decision isn't the most complex solution—it's the one that empowers the person using it.
Project Takeaways
Information Architecture
Expanded a single wireframe into a 6-page sitemap structured around real conversion touchpoints, from discovery to affiliate action.
No-Code CMS Development
Engineered a custom Shopify metaobject backend enabling Annie to publish and update content entirely without developer support.
Visual Systems from Instinct
Translated an undefined but consistent brand feel into a true palette, typography scale, and contrast-conscious color system, built from what Annie already had, not replacing it.
Content-to-Conversion Design
Structured the Resources and affiliate pages so browsing content leads naturally into monetizable action, delivering on the site's business-engine goal.
Client Enablement
Learned to weight onboarding and handoff clarity as heavily as technical sophistication, informed directly by this project's reflection.
Let's discuss how we can scale your brand through design.
