Focus Global is a marketing company who handles luxury brands to market in the Philippines. New to UX.
Hunter Douglas is a popular U.S. Brand for shades and window coverings. An existing PH website can be found here. Potential UX improvements and content-richness can be explored.
When I joined the team, I wasn' t just the new designer—I was the first and only designer in Software Engineering.
UX workflows didn' t exist. Handoff processes were informal. Design lived in marketing decks and devs translated visuals however they could.
The company was operating in a low UX-maturity environment—design wasn' t embedded in the process, and there was no existing structure to support scalability across brands.
This challenge wasn' t intimidating—it was an opportunity. I saw it as a blank canvas to introduce design systems thinking, prove the value of UX, and create a workflow that served both design and development.
Challenges
Sole designer in the entire department
No existing UX workflow
Tight deadlines and multiple projects
Low-priority project
From a systems perspective, this wasn' t sustainable. From a UX lens, this was a breakdown in clarity, consistency, and structure.
Role
UI/UX Engineer (+ the many other hats we wear at work)
Process
FIRST
"Why do you need a website?"
I didn' t start with Figma—I started with blunt, straightforward questions.
Hunter Douglas' Marketing Team needed the website to spread the word—to introduce the brand to the Philippine market.
Brand Credibility
Potential Marketing Material
Customer and Professional Product Information Reference
THEN
I asked developers how they currently translated designs, what slowed them down, and what they wish they had. The common pain points:
"We're just guessing font sizes and line heights."
"Every component has different Tailwind combos, depending on the marketing team's review and requests"
"A system for design would be good, but I think that may just slow down the process more."
This gave me a systems-level insight: we didn' t just need better design—we needed better communication between design and code.
AFTER THIS
*intensely pushing my foot against the breaks on designing in Figma
As the only designer, I wasn' t just responsible for the visuals—I was responsible for making sense of what we were even building.
I initiated the DISCOVERY PHASE for the web design project, with the following goals in mind:
A clear view of the content structure
nsight into business priorities
A way to anticipate what data I'd have access to
A shared artifact that both software engineering and marketing could align on
SITEMAP
A week after project initiation, stakeholders reached out that the projects needs to be finished within a month. This is tricky because I'm also working on internal tools on the side and two other brands for their website projects.To comply with this, I aligned with the team to identify the priority pages (those marked with stars) and the lesser priority pages that we can roll out one-by-one later on post-launch.
PRODUCT MAP
Over 300 products. A lot of mapping work.Thank god I listened to that one class about spreadsheets.
These maps became my north star for everything that followed—tokens, layout decisions, even data-model discussions with developers.
THEN
The WIREFRAMING PHASE begins.
Keeping in mind the "bibles" for both teams, I need to make sure I find the middle ground for them. At some point I start to feel like a mom.
Rules and Guidelines from the teams:
Marketing
Brand guidelines
Messaging hierarchy
Content direction
Developers
Tech stack
Dev feasibility
Tailwind defaults
Since the marketing inputs were often visual or narrative-driven, not structured for execution, I translated their intent into design tokens, content rules, and component logic—bridging business goals with frontend architecture.
This kind of collaboration wasn't just about "designing what they asked"—it was about educating stakeholders on system thinking and helping them see how design can scale across touchpoints.
