This fascinating website reacts to moving your mouse across the screen

In an era where an AI can redesign a living room with the click of a button, the lines between what’s real and what’s not are blurring every day. And with the rise of augmented and virtual reality, the physical and digital worlds are merging into one at lightning speed. This blurring of lines can sometimes be unsettling and downright frivolous to others, but for one designer it has become the essence of a compelling new brand identity.

[Image: TLA]

In a masterful move that blends interactive design with hyper-realism, New York designer Talia Cotton, who is one of the leading graphic designers of the moment embracing the possibilities of code, has come up with an intriguing website that reacts to the movement of a cursor by the user around the page. Designed for a new PR agency called The Last Agency, the website (and accompanying brand identity) consists of a single landing page and a full-screen wallpaper of a scratched steel surface that looks eerily real. As you move your cursor, the light seems to bounce off the steel, like tilting a piece of metal in the sun. The underlying design principles are reminiscent of 1980s skeuomorphic design, but with one important differentiating factor: it doesn’t sacrifice behavior for style. Think of it as skeuomorphic design 2.0 with a clear goal: borrow from the real world to spawn a new, trustworthy business in the digital space.

[Image: TLA]

It all starts with a brief that called for a brand identity that was both nostalgic and avant-garde. “IBM meets TWA,” says Cotton. (The original logo was designed by graphic designer Hannah Nathans and is closer to IBM, but Cotton gave it a “TWA” twist by adjusting it so that the thickness of each strip decreases with each letter, suggesting a evolution.)

Once the logo was in place, Cotton went through a dozen wildly contrasting iterations of the website, always experimenting with those blurred boundaries between the physical and digital realms. In one version, she played with Moiré, where two ruled patterns overlap to create a sense of movement. In another, she was inspired by the type of shadows blinds might cast on a wall, except in this case the shadows spelled “The Last Agency” and the angle of the shadow varied depending on the time and day you visited the website. . “I really liked the idea of ​​bringing this to the digital realm,” she says.

[Image: TLA]

Eventually, the team landed on the substance of steel, which is meant to evoke resilience and the idea that it’s “the last agency you’ll ever need,” Cotton says. Here again, it was essential to anchor the website in real materiality. “It was less about a nod to the past and more about the physical qualities of something eternal,” she says.

Cotton started with a scratched steel surface that looks like it’s been through a lot. But the real magic happens when you move the cursor across the page, which causes the light to move very smoothly across the font on the screen. “The whole site is an illusion,” says Cotton. “It looks like 3D and it isn’t.”

[Image: TLA]

For an added layer of interaction, Cotton hid a fun “easter egg” on the landing page. If you press the letter “c”, a camera icon appears in the lower right corner. Click to allow the site to use your front-facing camera, and you’ll find a very blurry version of your face reflected against the steel background. As the light on the screen changes with the movement of your head, the physical quality of the digital image becomes even more compelling.

[Image: TLA]

The experience is reminiscent of skeuomorphic design for a reason. The original goal of skeuomorphism was to paint scary technology as something more familiar and accessible, and Cotton arguably does this by covering the website’s landing page with a hyper-realistic steel texture. But Cotton isn’t just reviving skeuomorphic design in a more modern way, she’s using it for an entirely different purpose: building trust. You could call it skeuomorphic design 2.0.

[Image: TLA]

To be fair, Cotton is a little reticent about the skeuomorphic design label. “It’s hard to take it at face value without imposing a historical connotation regarding its interface design trends,” she says of a movement that introduced digital pages that mimic the way a page would flip in real life, or a camera phone making the shutter sound of an analog camera. But she agrees with an updated definition of the term, where the skeuomorphic design exemplifies something that looks realistic (scratched steel glinting in the sun) but more importantly, lets you interact with it. realistically too.

It’s a fun user experience, but it’s also functional. “I find that in design, the more real something looks, the more trustworthy it seems,” she says, comparing a color photograph to an illustration. “And I think it was necessary to set the tone for The Last Agency as trustworthy because they’re so new.”

[Image: TLA]

Ironically, Cotton doesn’t think the same principle applies to physical brand assets like its business card or letterhead, both of which use a different black-and-white version of the logo. “I think it only works as an app on the web,” Cotton says. “As soon as you replicate that web experience in the physical world, it loses half of its meaning.”

About Nereida Nystrom

Check Also

Business Spotlight | Brainstorm Boutique offers great ideas for businesses

THE O’DELLS The South Good business marketing requires a mix of things: good ideas, clear …