Case StudyCase Study
PetFam is a dedicated platform connecting pet lovers with comprehensive information, engaging blogs, and tailored services for their beloved companions.PetFam là nền tảng chuyên biệt kết nối những người yêu thú cưng với những thông tin toàn diện, blog hấp dẫn và các dịch vụ phù hợp cho thú cưng của họ.
The primary goal of this project was to create a warm and intuitive digital experience that seamlessly connects pet owners with valuable content and services, employing effective UX/UI strategies to elevate user engagement.Mục tiêu chính của dự án này là tạo ra một trải nghiệm kỹ thuật số trực quan và ấm áp, kết nối người nuôi thú cưng với các nội dung và dịch vụ giá trị một cách mượt mà, áp dụng các chiến lược UX/UI hiệu quả để nâng cao sự tương tác của người dùng.
* Note: All designs and structures represent the creative process for the PetFam project.* Lưu ý: Toàn bộ thiết kế và cấu trúc dưới đây thể hiện quy trình sáng tạo cho dự án PetFam.
Discovery & ResearchNghiên cứu & Khám phá
Insights gathered from internal stakeholder questionnaires shaped the strategic direction of this redesign. Key focus areas were identified to align business objectives with user needs.Những thông tin thu thập được từ bảng khảo sát các bên liên quan (stakeholders) đã định hình hướng đi chiến lược cho đợt thiết kế lại này. Các trọng tâm chính được xác định để gắn kết mục tiêu kinh doanh với nhu cầu người dùng.
The primary goal is to grow the pet owner community in Singapore, drive more inquiries, and establish a memorable brand image across all touchpoints.Mục tiêu chính là phát triển cộng đồng người nuôi thú cưng tại Singapore, tăng lượng truy vấn (inquiries) và thiết lập một hình ảnh thương hiệu đáng nhớ.
Stakeholders identified that the current site is "not interactive enough" and suffers from responsive design and loading speed issues, causing user friction.Các bên liên quan nhận định website hiện tại "thiếu tính tương tác" và gặp các vấn đề về thiết kế responsive cũng như tốc độ tải trang, gây trở ngại cho người dùng.
The visual direction must embody three key traits: Trustworthy, Playful, and Informatic, ensuring users feel confident and engaged.Định hướng hình ảnh cần thể hiện ba đặc điểm chính: Đáng tin cậy, Vui nhộn và Giàu thông tin, đảm bảo người dùng cảm thấy an tâm và được cung cấp giá trị.
Solution OverviewGiải pháp tổng quan
The design approach focused on creating an inviting, warm, and highly functional digital environment. By organizing diverse content logically and incorporating high-quality, engaging visuals, the platform ensures users can effortlessly find specific information while enjoying a delightful browsing journey.Phương pháp thiết kế tập trung vào việc tạo ra một môi trường số mời gọi, ấm áp và có tính ứng dụng cao. Bằng cách sắp xếp các nội dung đa dạng một cách logic và sử dụng hình ảnh chất lượng cao, lôi cuốn, nền tảng đảm bảo người dùng có thể dễ dàng tìm kiếm thông tin cụ thể trong khi tận hưởng trải nghiệm lướt web thú vị.
Information Architecture
Structuring content to guide users intuitively through different sections of the platform.Cấu trúc nội dung để dẫn dắt người dùng một cách trực quan qua các khu vực khác nhau của nền tảng.
The Homepage serves as a dynamic central hub, showcasing featured articles, services, and clear navigation pathways to capture user interest and provide a snapshot of the community.Trang chủ cung cấp cái nhìn tổng quan, nhóm các bài viết và dịch vụ nổi bật với luồng điều hướng rõ ràng giúp người dùng dễ tiếp cận.
The About Us page focuses on storytelling and building a relatable brand image, allowing the audience to emotionally connect with the mission behind PetFam.Trang Về chúng tôi tập trung vào kể chuyện và xây dựng hình ảnh thương hiệu gần gũi, cho phép khán giả kết nối cảm xúc với sứ mệnh đằng sau PetFam.
The Blog section offers categorized, insightful reads formatted for high readability, while the Contact Us page provides simple, accessible ways to interact with the platform.Phần Blog cung cấp các bài viết chuyên sâu, được phân loại và tối ưu khả năng đọc, trong khi trang Liên hệ mang đến những cách tiếp cận đơn giản để tương tác với nền tảng.
Design Process MappingQuy trình Thiết kế
Mapping the project execution to the core skills and processes of a Senior UX/UI E-commerce Designer.Áp dụng bộ kỹ năng và quy trình chuẩn của một Senior UX/UI E-commerce Designer vào việc thực thi dự án này.
Analyzed internal questionnaires to uncover pain points (low interactivity, slow loading) and define the "trustworthy, playful, and informatic" brand direction.Phân tích bản khảo sát từ stakeholders để xác định điểm nghẽn (thiếu tương tác, tải chậm) và định hình thương hiệu "đáng tin cậy, vui nhộn, giàu thông tin".
Mapped out the user journey and logical content structure to connect pet owners seamlessly with the community and services.Thiết lập hành trình người dùng và cấu trúc nội dung logic để kết nối chủ nuôi thú cưng với cộng đồng và dịch vụ một cách liền mạch.
Translated the brand traits into a warm, engaging aesthetic using consistent design tokens, typography, and clear visual hierarchy.Chuyển hóa các đặc tính thương hiệu thành một giao diện ấm áp, thu hút, thông qua hệ thống typography, màu sắc và phân cấp thị giác rõ ràng.
Designed robust responsive layouts specifically catering to mobile traffic, ensuring accessibility and ease of use on smaller screens.Thiết kế layout responsive ưu tiên trải nghiệm mobile, đảm bảo tính khả dụng (accessibility) và sự tiện lợi trên các màn hình nhỏ.
Enhanced readability for Blog Lists and optimized Contact Us forms to reduce friction, driving better community engagement and lead generation.Tăng khả năng đọc cho Danh sách Blog và tối ưu form Liên hệ để giảm rào cản, từ đó thúc đẩy tỷ lệ chuyển đổi (inquiries) và tương tác cộng đồng.
UX/UI HighlightsĐiểm nhấn UX/UI
Showcasing the adaptable and appealing design implemented across key pages.Giới thiệu thiết kế linh hoạt và thu hút được áp dụng trên các trang chính.
✨ Click on any image below to view full details.✨ Nhấp vào hình ảnh bất kỳ bên dưới để xem kích thước đầy đủ.
A comparison between the original website (captured in June 2026) and the new proposed design. The redesign focuses on better content organization, modern typography, and a cleaner aesthetic.So sánh giữa website ban đầu (ảnh chụp thời điểm tháng 6/2026) và thiết kế mới đề xuất. Bản thiết kế lại tập trung vào việc tổ chức nội dung tốt hơn, kiểu chữ hiện đại và tính thẩm mỹ sạch sẽ hơn.
The homepage is meticulously crafted to be fully responsive. From the expansive desktop view (1920px) emphasizing rich imagery and multi-column layouts, to the compact mobile view (390px) focusing on easy scrolling and prominent touch targets, the transition is smooth.Trang chủ được thiết kế tương thích trên nhiều kích thước thiết bị. Từ giao diện desktop rộng lớn (1920px) nhấn mạnh vào hình ảnh phong phú và bố cục nhiều cột, đến giao diện di động nhỏ gọn (390px) tập trung vào việc dễ dàng cuộn và các điểm chạm nổi bật, quá trình chuyển đổi layout diễn ra ổn định.
Building trust in the pet care niche requires authenticity. The About Us page combines heartfelt imagery with clean typography to narrate the brand's origin and core values, ensuring the layout remains engaging whether viewed on a large monitor or a smartphone.Xây dựng niềm tin trong lĩnh vực chăm sóc thú cưng đòi hỏi sự chân thực. Trang Về chúng tôi kết hợp những hình ảnh chân thành với kiểu chữ tinh tế để kể lại nguồn gốc và các giá trị cốt lõi của thương hiệu, đảm bảo bố cục luôn lôi cuốn dù được xem trên màn hình lớn hay điện thoại thông minh.
To facilitate knowledge sharing, the Blog List employs a card-based design with clear visual hierarchy, making it easy to scan through articles.Để hỗ trợ chia sẻ kiến thức, Danh sách Blog sử dụng thiết kế dạng thẻ (card-based) với hệ thống phân cấp thị giác rõ ràng, giúp dễ dàng lướt qua các bài viết.
The Contact Us page is straightforward, reducing friction for user inquiries by presenting clear communication channels and an intuitive form.Trang Liên hệ được thiết kế trực tiếp, giảm rào cản cho các thắc mắc của người dùng bằng cách trình bày các kênh liên lạc rõ ràng và một form điền trực quan.
Impact & TakeawaysKết quả & Bài học
The key achievements of the project and lessons learned during the design process.Những thành tựu chính của dự án và bài học đúc kết trong suốt quá trình thiết kế.
By structuring the content clearly and using attractive imagery, the platform successfully encouraged visitors to spend more time exploring the blogs and services.Bằng cách cấu trúc nội dung rõ ràng và sử dụng hình ảnh hấp dẫn, nền tảng đã thành công trong việc khuyến khích khách truy cập dành nhiều thời gian hơn để khám phá các blog và dịch vụ.
The cohesive design language and transparent information presentation solidified the brand's position as a reliable community for pet lovers.Ngôn ngữ thiết kế gắn kết và sự trình bày thông tin minh bạch đã củng cố vị thế của thương hiệu như một cộng đồng đáng tin cậy cho những người yêu thú cưng.
In niche markets like pet care, high-quality, relatable images are crucial. They do the heavy lifting in establishing an emotional connection before users even read the text.Trong các thị trường ngách như chăm sóc thú cưng, hình ảnh chất lượng cao và gần gũi là yếu tố quan trọng. Chúng đóng vai trò chính trong việc thiết lập sự kết nối cảm xúc ngay cả trước khi người dùng đọc văn bản.
For sections like the Blog, managing typography and white space is essential to prevent cognitive overload and encourage continuous reading.Đối với các phần như Blog, việc quản lý kiểu chữ và khoảng trắng là rất quan trọng để tránh quá tải thông tin và khuyến khích việc đọc liên tục.
Return to the homepage to view my design process and other projects.Trở lại trang chủ để xem quy trình thiết kế và các dự án khác.
