{
requestAnimationFrame(() => {
const submenuEls = $el.getElementsByClassName('toggle-menu');
const visible = Array.from(submenuEls).filter(el => !el.classList.contains('toggle-menu-hidden'));
if (visible.length == 0) {
$store.xHeaderMenu.openHamburgerMenu = false;
}
});
}, 400);
$store.xHeaderMenu.overlay = false;
}"
>
Portfolio
Cai Shi Zi Ma Fenyang Wonton|Shopify Official Website Development
on Aug 18 2026
From a 70-year-old shop in Zuoying Market to a highly-reproduced e-commerce website
This project involved building a Shopify official website for "Cai Shi Zi Ma Fenyang Wontons." The designer from the collaborating party had already completed the full visual design draft in Figma. Our task was to highly reproduce this design draft into a functional and maintainable Shopify website ready for launch.
Brand Background
Cai Shi Zi Ma is a well-established wonton shop that has been deeply rooted in Zuoying Second Public Market for over 70 years. It specializes in signature fresh pork wontons, spicy dry wontons, tofu skin wontons, tangyuan, and other fresh frozen delivery products. It has also been featured multiple times on TV programs and unboxed by influencers. The brand has a rich story and solid reputation. The website's mission is to transform this "market human touch" into an online experience that can drive e-commerce conversions.
Project Challenge: High-Fidelity Implementation
When a designer has already produced a complete Figma design draft, the focus of frontend implementation shifts from "creative ideation" to "precise execution":
Layout spacing, font hierarchy, and color system all need to align with the visual specifications of the design draft.
Multiple modules on the homepage (carousel banner, best-selling products, free shipping bundles, influencer recommendations, TV reports, YouTube video wall) need to be reproduced one by one and connected to the editable data structure in the Shopify backend.
Both mobile and desktop versions of the layout have design drafts, requiring separate adjustments to ensure that the reproduction fidelity is not compromised by the device.
How We Did It
Modular SlicingAccording to the Figma design draft, we deconstructed each content block on the homepage (featured products, value-for-money free shipping bundles, influencer recommendations, TV reports, Mama's Kitchen video wall, etc.) and implemented them as Shopify theme sections. We used existing theme functionalities with almost no modification to the original code, making it easy for the brand to update, reorder, and adjust content later.
Integration of Membership and Promotion MechanismsBased on brand needs, we planned tiered promotional alert bars for free shipping thresholds and gift with purchase offers (spicy wontons, chili sauce), as well as a member rewards program page, allowing marketing activities to be directly reflected on the frontend.
Integration of Social Media and Reputation ContentWe organized the brand's long-accumulated TV reports, influencer unboxing reviews, and YouTube videos into the website pages, and connected communication channels such as LINE, Instagram, and Facebook. This ensures the official website is not just a storefront but also a display case for brand trust.
Pixel-Perfect Detail CalibrationWe repeatedly compared details such as button rounded corners, spacing, letter spacing, and image cropping ratios between the design draft and the actual pages to ensure that the launched website matched the visual design provided by the designer.
Results
The launched website fully preserved the visual design of the brand's designer while incorporating the product management, promotion mechanisms, and membership system flexibility inherent in Shopify e-commerce. This allowed "Cai Shi Zi Ma" to extend its 70 years of market reputation to online channels. Our service included subsequent training on how to use the website backend. After many years of operation, the website has evolved significantly from its original design and content, demonstrating how Shopify makes it easier for clients to manage and modify their content independently.
Visit Cai Shi Zi Ma Fenyang Wontons website
YOSIM|Shopify Store Setup for Cross-Border Brands
on Nov 22 2025
Assist brands in establishing cross-border e-commerce websites, organizing product and page structures, and creating clearer branding and conversion processes.
My Real You | Brand Official Website Optimization
on Oct 25 2025
Adjustments to brand visuals and shopping experience were made to enhance overall consistency and commercial presentation.
on Jul 10 2025
etheryal | Wix Website Building Case Study for Korean Apparel Selection
Ethereal is an online platform specializing in Korean fashion , featuring a minimalist, sophisticated, and high-end aesthetic. Its target audience is women who love Korean fashion and value quality and personal style. I assisted with the overall planning and development of this project, utilizing the Wix platform for website creation.
# Korean style incorporated into official website design
- Style Positioning: White background with minimalist design × black and gray main color scheme, echoing the Korean fashion aesthetic.
- Homepage layout: Featuring a large Hero Banner image, paired with seasonal product selections and recommended items.
- Shopping experience: Products are clearly categorized (tops/trousers/dresses/shoes, bags and accessories)
- Multiple Images: Product pages support multi-angle image displays to enhance persuasiveness in purchasing decisions.
# Technical Implementation and Architecture
Theme and layout design
- Theme Customization Redesign - Create clear navigation guides for product categories. - Product pages support multiple images, specifications, and style story descriptions.
Shopping function integration
- Set up cash flow - Includes discount codes, member registration system, and quick browsing. - Join the Instagram Gallery section to boost brand social media engagement and conversion rates.
SEO and Marketing Setup
- Set SEO title/description/image alt description (optimize search exposure) - Create FAQ pages, return and exchange policies, and other shopping instructions to enhance brand trust. - Optimized mobile RWD to ensure smooth operation on mobile devices.
Official website link
[Go to the official Ethereal website]
Customer Feedback
"The website looks like an extension of the brand, clean yet detailed, which perfectly meets our needs. The tutorials are detailed and the after-sales service is excellent. It's very easy for us to maintain ourselves."

