Digital Art Direction System (StarHub)
At StarHub, the existing corporate brand guidelines were built primarily for company-wide communication and print applications. While this provided a strong foundation for brand identity, it lacked the detailed guidance required to create consistent, high-quality digital products and services. As StarHub’s digital ecosystem matured across mobile and web touchpoints, the gap became increasingly clear: teams needed a digital-first system that translated the brand into usable product language—across UI components, interaction patterns, iconography, illustration, and design execution standards.
To address this, I led the initiative to evolve StarHub’s corporate branding into a scalable digital experience framework. Working closely with one of my team’s graphic designers, I created a Digital Art Direction system that made the brand practical for product design, and complemented it with a set of StarHub Product & Design Principles, grounded in Dieter Rams’ philosophy of “Good Design,” to guide teams not only toward consistency—but toward better user outcomes.
Create a migration experience that felt seamless, transparent, and reassuring, while clearly communicating that the new prepaid plans were better overall.
The Challenge: When Print-First Brand Systems Meet Digital Product Reality
In many enterprise organizations, brand systems are built around marketing and print needs: posters, retail collateral, corporate materials, and traditional campaign outputs. However, digital product environments create entirely different requirements. Colors behave differently on screens. Typography must scale across viewports and device sizes. Interface components require states and behavior definitions. Visual systems must support navigation, usability, accessibility, and long-term product evolution.
StarHub’s corporate brand guidelines were strong at a company level, but they didn’t provide the clarity and execution standards needed for consistent digital product design. The risk was predictable: design fragmentation across teams, uneven UI quality, inconsistent interpretation of “brand,” and experiences that looked disconnected across app and web touchpoints. The opportunity was to modernize the brand expression into a digital-ready operating system—one that would support product delivery at speed without sacrificing craft or cohesion.
The Strategic Purpose (Core Portfolio Message)
This was not a “visual refresh” project. The core purpose was to translate StarHub’s brand into an experience design system that could scale across platforms, teams, and customer journeys—so that every digital touchpoint felt intentional, cohesive, and recognisably StarHub.
In practical terms, the intent was to define how StarHub should feel in digital interactions: modern, human-centered, emotionally resonant, and clear. This included elevating brand expression through digital art direction while also creating a principled foundation for design decisions—ensuring teams weren’t simply following visual rules, but designing with a shared standard of usability, clarity, and purpose.
My Role & Leadership
I led this initiative as Head of Product Design & Experience, partnering with one of my team’s graphic designers to formalize StarHub’s digital creative language. The work required cross-functional influence, balancing brand intent with product realities, and ensuring that the final output could be adopted across teams—including designers responsible for app UI, web UI, communications touchpoints, and campaign surfaces.
Solution Part 1: Digital Art Direction System (Brand-to-Digital Translation)
The first part of the solution was a Digital Art Direction framework—an applied system designed for real product execution. This included structured rules across digital-first visuals and UI expression, such as color systems optimized for screens, typography consistency for mobile-first layouts, illustration and icon systems, and reusable UI elements that could be implemented across journeys.
The work included defining a cohesive creative philosophy (“emotive in every pixel”) and translating that into usable guidance for daily execution. This ensured the brand could be applied consistently across app and web surfaces without relying on subjective interpretation—reducing creative drift and raising baseline quality across squads.
Digital System Foundations (What We Standardised)
The art direction system defined consistent foundations across:
Screen-optimized color palette (primary, secondary, accents, tints) for digital consistency
Typography system optimized for mobile readability and product UI hierarchy
Illustration language inspired by the StarHub star identity, with defined rules for form, strokes, fills, and composition
Icon system supporting clarity, navigation, and consistent product cues
Banner system across device sizes (web/tablet and app) to prevent inconsistent execution
UI element standards such as buttons, tags, filters, steppers, calendars, and state behaviors
This ensured StarHub’s digital execution didn’t just “look branded,” but behaved consistently and professionally across journeys.
Solution Part 2: Product & Design Principles (Dieter Rams as Foundation)
A visual system alone isn’t enough to drive great experiences at scale. So the second part of the initiative was to create product-facing principles that would guide decision-making across squads—ensuring teams weren’t simply designing consistent interfaces, but delivering consistent experience quality.
I created StarHub’s Product Principles, anchored around customer outcomes such as:
I created StarHub’s Product Principles, anchored around customer outcomes such as:
understanding and serving user goals (“Goals, Goals, Goals”)
building emotionally connected experiences (emotion isn’t an afterthought)
ensuring products are more than disconnected features (“the sum is greater than its parts”)
intuitive usability as a baseline (“Intuitive at its Core”)
thinking big while delivering in incremental units (“Think Big and Start Small”)
I then grounded StarHub’s Design Principles in Dieter Rams’ Good Design philosophy, adapting timeless product design standards into a digital product context—principles such as:
good design is innovative
useful and aesthetic
understandable and unobtrusive
honest, long-lasting, and thorough down to the last detail
environmentally friendly, inclusive, and “as little design as possible”
This made the framework a true experience design governance model, not just a design style guide.
This initiative created a scalable foundation that enabled StarHub to deliver more cohesive and brand-aligned digital experiences across touchpoints. It reduced subjective interpretation of “brand,” improved consistency between product and communication surfaces, and equipped teams with clear digital-first standards that could accelerate delivery while increasing baseline quality. Most importantly, it demonstrated that brand identity can be transformed into product reality—where digital interactions become authentic extensions of the brand, not fragmented UI decisions made team-by-team.
Final Thoughts
This work reflects what modern experience leaders are increasingly responsible for: not only designing screens, but defining the systems and principles that allow organizations to deliver high-quality digital experiences repeatedly. It demonstrates my ability to translate brand intent into scalable digital execution frameworks, influence cross-functional teams through governance and principles, and operationalize “good design” into practical standards that improve customer outcomes.
In consultancy terms, this project shows how I work as a change agent—building the foundations that enable Fortune 500-scale organizations to ship digital experiences that are coherent, human-centered, and consistent across every touchpoint.