Focus 01
Hero section
Story-led hero with creator proof and partner logos. The first impression that frames evaluation.
ASUS ProArt · Consumer Web
ProArt Global Website
I owned the information architecture, navigation, responsive experience, and accessibility for ASUS ProArt's global platform, rebuilding it around how creators evaluate tools. Foundation work came first, then a creator-validation hub and a reusable design system.
ProArt Website- Product
- ASUS ProArt
- My role
- Senior UI Designer
- Timeline
- Nov 2022–May 2023
- Team
- DMURMK+3
TL;DR
Premium products. No clear path to choose.
The site didn't need better visuals. It needed a decision layer built in, so creators could move from curiosity to a confident choice.
Primary CTA click-through
+25%
Click-through rose against the previous homepage and product marketing page, once the decision structure guided people into product and discovery paths.
New page type
What Pros Say
I designed and tested a creator-validation hub that only became possible after the foundation was in place.
How it scales
Reusable DS
Campaign pages ship from shared components instead of one-off rebuilds.
Problem
The site showed products but didn't help people choose.
ProArt is the flagship creator line at ASUS, built for filmmakers, designers, and animators who expect precision. The hardware earned their trust; the site was organized around products, while creators arrived with a decision to make.
Research and stakeholder interviews surfaced the pattern: creators arrived with evaluation questions, not browsing ones.
- Can I trust ProArt for professional creative work?
- Which product fits my creative workflow?
- Where can I go next to buy or explore?
Reframe
From website redesign to decision system.
The issue wasn't visual. The site had no layer for guiding evaluation, and every local fix would break again without a shared foundation.
Before: Original ProArt site: product-led navigation with no evaluation path.. After: Redesigned ProArt site: story-led creator hub with decision-oriented structure..
Design bet
The only durable fix was to build the decision layer in, not paint over it with better visuals.
My approach
What to solve first was itself a design decision.
Before designing screens, I worked with PM and engineering to map every gap against an impact × effort matrix, co-owning the call to sequence the foundation before expansion. Phase 1 had to hold Phase 2, not become a surface we'd rebuild in six months.
I traded marketing flexibility for user clarity, and designed the brand and engineering constraints in from the start rather than negotiating them after handoff.
Design highlight
A page the old site couldn't support.
As partnerships grew, peer validation mattered more: creators trust other creators who already made the decision they face. The old architecture had no room for that story.
"What Pros Say" is a storytelling hub where creators speak to people evaluating the same tools. It only became possible because Phase 1 delivered a system that could hold a new page type.
Focus 02
Gallery section
Modular carousel explorations for partner and creator stories. Twelve layout patterns before narrowing.
I reviewed three directions with cross-functional partners. Layout C held varied creator stories without clutter and ran on lower-end devices. 7 of 12 stakeholders preferred it, directional support for the call.
Insights from review
Stakeholders
Marketing, brand, and engineering needed a layout that could hold varied creator stories without bespoke rebuilds for each partnership.
Stakeholder read
The carousel is interactive and includes detailed information, which works well to engage users.
Performance
Layout C performed smoothly across lower-end devices and was built for modular CMS extension as new partnerships came in.
What we fixed
Three changes that made evaluation possible.
01
Capability → proof → action
I adopted a Z-pattern across product pages. Capability leads, creator validation builds in the middle, product action comes last.
02
WCAG without losing brand
I aligned typography, palettes, and contrast rules with ProArt's identity, fixing failures that blocked use in varied professional environments.
03
Same evaluation flow, every device
I defined a responsive grid and component rules so the evaluation path holds on desktop, tablet, and mobile.
Design system
The foundation every page builds from.
The three fixes shipped as reusable rules, not one-off pages, so future pages scale without recreating the same decisions.
The rules every page starts from
Typography, color palettes, and a responsive grid.
Final design
What shipped on asus.com.
Key pages rebuilt on consistent hierarchy, accessible color, and the shared library. One system across every device.
Impact
What changed after launch.
Two outcomes, measured against the previous homepage and product marketing page: one from product analytics, one from a WCAG accessibility audit.
/ 01
+0%
Primary CTA click-through
/ 02
0%
Accessibility issues resolved
Reflection
When users can't choose, the problem is structure.
The problem was never missing information. It was missing structure. Since this project I sequence foundation work before expansion, and I start from the decision people are making, not the interface.