luma lighting design - website

Luma

Luma is the lighting design practice of sustainable design leaders PAE. Their role: integrating light into spaces and materials to expand possibilities and shape human experiences. Design-driven, technically-minded, and people-powered, Luma’s approach is highly collaborative and inherently sustainable. And their new digital destination demonstrates both their humanistic ethos and an innovative practice with global impact.

Desktop, tablet and mobile mock ups of Luma Home page

Viscerally Expressing an Essential Element

To visually deliver on Luma’s artistry, design boldy dramatizes the impact their work has on spaces. On the homepage, the brand is introduced cinematically, free of navigational distractions, and leverages typography and arresting imagery to create the feeling of a highly designed museum exhibition. The work itself minimizes content to elevate brand perception and visual expression of form. The design doesn’t just make room for Luma’s elemental creativity — it mirrors it.

Woman looking at tablet displaying images of Luma portfolio projects

Illuminating Brand Work

Within work pages, projects are immersive and interactive, using large type to make bold introductions before letting work imagery do the heavy lifting. Stretching typical digital design to adopt museum-like strategies, each project uses a different, dynamically-controlled background color palette to mimic how light can affect color in live space. An image counter details page position, while navigating through a cascading flow of images. Wayfinding between projects echo museum signage, and transitions between projects are seamless, fading in rather than reloading the page.

Blue, pink, yellow and teal Luma portfolio pages demonstrating the design system's use of color
Two vertical tablet examples of project detail pages for the Oregon Zoo Education Center and Unitarian Universalist Center
Grid of images of five different housing interiors and exteriors at dusk

"The new site is awesome. It was an amazing team effort and the result is beyond expectations. I am excited for the world to experience this site. Thank you everyone for the hard work and passion that went into making this happen."

Experiments in Function

Throughout the site, both subtle and striking behavioral physics are as much a part of Luma’s story as design. From the brand introduction on home, fading out upon scroll and revealing the navigation, to the activity between projects, mouse movement is tracked and then reacts, versus a triggered animation. Project shifts are really an injection of a new page, putting it below the old, and animating them together. Filter and link animations have both an enter and exit animation, and pages both fade in and up. Transitionally, the technical details create a feeling of never leaving the site; it’s more as if the site is revealing itself.

Animation of Luma portfolio scroll

Leading Industry Momentum

Working in a space that’s primarily about attention to detail, “industry caliber” is the driving lever behind the site’s strategy. From the design language to functional behavior, it scales responsively, without sacrificing the brand’s core intent. What the new website conveys is the brand’s existing innovative edge, where forward-thinking and talented humans harness the power of light to brighten the planet in inspiring ways.

Hand holding phone showing the Luma portfolio page focusing on the Microsoft Building 16&17 project
Three mobile screens showing the designs of the Luma home page, menu and news page
Interior of a modern corporate building showing stairs and wooden decor