⁕ Prélude

Medium

Figma, Adobe CC

Role

  • Product
  • Brand
  • Web
  • Project timeframe

    1+ year – FTE

    Prélude

    Medium

    Figma, Adobe CC

    Role

  • Product
  • Brand
  • Web
  • Project timeframe

    1+ year – FTE

    Relevant links

    Hulu’s web design system takes its root from what we’ve all come to know and love in the Hulu app. We’ve worked hard on building a complementary web-focused design system that lives harmoiously with the product team’s existing groundwork. These components are used across the board in Hulu’s campaign sites, ad managers, as well as microsites.

    Colors

    We were tasked with solidifying existing product colors into web. Our goal was to create a set of colors that would complement the existing color palette, while also adding new visual interest and flexibility to our designs.

    To begin the process, we conducted a thorough analysis of our existing color system, taking into account the overall visual aesthetic and the specific use cases of each color.

    Once we were satisfied with our color palette, we updated our figma to be globally available to our team, along with proper documentation.

    Overall, the process of introducing new colors to our design system was a collaborative effort that required extensive research, experimentation, and testing. The end result was a set of new colors that added new visual interest and flexibility to our designs, while maintaining the overall cohesiveness of our existing system.

    Illustrations

    We were also asked to create new illustrations as web components to enhance the user experience and enjoyability of our website. Our goal was to create a set of illustrations that would be visually appealing, consistent with our brand identity, and easily adaptable for different use cases.

    We then worked closely with our development team to create web components for each illustration. We used SVGs to ensure that the illustrations would be scalable and accessible for users with different screen sizes and devices. We also provided guidelines on how to implement and customize the illustrations, to ensure consistency across all web pages.