Designing and vib[code]ing into the future.
Less guessing.
More trusting.
Reimagining Trend Micro
TrendLife (dot com)
Redesigning B2C website's architecture and product purchase flow.
DESCRIPTION
Trend Micro's rebranding opened an opportunity window to rebuild the consumer website that was heavily weighed down by outdated legacy information and EOL products.
ROLE
User Research
UX Design
Info Architecture
TOOLS
Figma
Claude Code
YEAR
2026
TEAMMATES
Visual Designer
Raymond Chang
UX Writer
Linda Lee
PROBLEM DISCOVERY
Incoherent & unintuitive structures
I built this website around four patterns I kept noticing in how Trend Micro for Home shows up today. Each one felt like a real design opportunity. Trend Micro offers so much but years of rich content piled up on the website is taking a toll on the users.
Security product developments are evolving. As a frontline of the revenue drive, the website needs to keep up.
1. Brand inconsistency
Trend Micro for Home feels different in every page.
Different timelines = gap between the designs
2. Discoverability & awareness
Users are left to self-diagnose their problems before going through a list of jargonised cures.
3. Multi-dimensional friction
Cross-country purchase was complex. Some products aren't available in certain regions and creates confusions.
4. Demographic mismatch
Entry points were buried, buying and renewing the security products was complex.
BRAINSTORMS
Rethinking the architecture
When I design to bridge the gap between technical systems and non-technical users, the architecture itself has to tell a compelling, reassuring story before a single word is read. Drawing in users who might feel alienated or anxious requires an infrastructure that anticipates their stress and guides them gently.
Discovery questions
New tone of voice
PRIORITIZATAION MAP
What problems to focus on
- comparing build & effort levels -
Laying the to-dos out on the table allowed me to see which section we should tackle first. I prioritised working on the new flows of product renewal and purchasing, while simultaneously tackling the UIs and visuals with the visual designer. Next, structuring other higher effort tasks into sectioned milestones. I communicated a reasonable timeline with multi-department stakeholders and developers to move things along.
BUILDING PROCESS
Information Architecture
Preciously, the flow is extremely fragmented. A simple task like "purchase" would spiral users through 3 different domains. The 🚫 labels indicates inactive page blocks that needs to go to prevent further frustration. The dark tags represents a new domain that opens a new tab, creating cognitive load and confusion.
The new architecture introduces a split between TrendAI (B2B) and TrendLife (B2C). Focusing on simple flows guiding users directly from problem to solution. Eliminating products that are no longer active and emphasising on straightforward, comprehensible copywritings.
FEATURES
Experience Enhancement
Making Choices
Homepage
Discover causes
Learn further
Routing the flow to problem-first instead of product-first will guide users to identify what they need. Familiar wordings and relatable images improve approachability and build trust. Reducing search time = reduce frustration = reduce bounce rate.
Before
After (phase 1)
Trying it out
Free Trials
Browse products
Try it out before decision making
By clearly separating time gated trials from permanent free utilities and eliminating cross-device friction with QR codes, the architecture lowers the barrier to entry and guides non-technical users toward the goal.
Finalizing choices
Shop
Choose product
Easy checkout
Leads with clear product layouts and primary actions. Followed by compatible devices at a glance to minimize click frustrations. I've shorted the user journey to be very direct and combined what previously lived in 3 different domains, into one.
Before
After
Centralizing the ground rules
To further ensure the website will stay cohesive, we (designers) created a CMS hub containing templates of each component and its possible states. The same corporate website should look coherent and follow the brand guidelines regardless of the geolocation. We intentionally used bento boxes and stackable blocks to create consistent layouts, so marketing managers updating the site from all over the world can easily stay on track without spending time adjusting.
Design Decions
First screen speaks with empathy
The original welcome screen felt transactional. It started with products, numbers ($), features. Prominent "Digital Challenges" section makes it immediately clear to find what you need and set the right mental model for busy families. When the first thing you see is how much you are understood, every interaction after feels purposeful.
Easy-to-use first
Simplifying the journey to get to a result of successful purchasing ensures calming experiences in stressful situations.
Prioritizing what's in the spotlight
Structuring the obvious sections with common cyber-threats for senior adults - the biggest driver of MAU growth.
TAKEAWAY
Stories first, impacts follow
Great technology alone doesn't sell. Trend Micro(Life)'s security platforms are protecting a lot of devices ; rapid threat detection detection that could save time, costs, and the need for legal intervention. But that didn't necessarily mean it would be adopted at scale. In high-stakes, high-complexity technical domains, my job is making users immediately trust what they're using and delivering the type of value that makes skepticism an afterthought.
