Responses by Jason Dietrick, creative director, Upperquad.
Background: Our primary form of external communication is still our website. It is the always-up, always-on location to learn about who we are and what we do. It sets the baseline of what people should expect when working with us.
The companies that hire us are our primary audience. They are looking for confirmation that we’re a legitimate creative partner. We want to convince them we’re a legitimate creative powerhouse.
A secondary audience includes folks who want to work here. The work we’re doing should look thrilling enough that we don’t have to kill ourselves selling our culture, but we’re still a great place to work. Online or off, we’re a tightly knit, passionate group of creativity, expertise and smiling faces ready to make something wonderful.
Design core: We are so enthused by the discovery and strategy capabilities we offer clients. These research-driven tools form the foundation of our creative work and inform every decision of the brand development process. Could our new brand celebrate the thinking that lives underneath our visual delights? Can brain work look interesting? Should it take center stage? How do you visualize this process?
The answer, it turns out, is words. As a thinking studio, our words should be our art. We wanted to take core typographic principles—like scale, letter spacing, line spacing and orientation—and turn them alive. So, we put our layouts and messaging to work, applying motion to oversized text, mix-and-match fonts, calls to action and modules, and creating a visual language that pushed typography across time and space. Design “style,” in this case, is most characterized by the hyper-sophisticated, continuous visual manipulation of typography.
We like how this motion-based, word-centric approach openly demonstrates process. Throughout the site, you see transformative thinking made visual, with highly potent headlines and copy blocks constantly reflecting back, evolving, iterating and refining themselves in real time.
Imagery-wise, we used layering, loops and lens effects to captivate users but also expose the underlying level of investigation and experimentation required to achieve such powerful images. This fusion of visuals and typography ultimately reinforces our commitment to delivering unparalleled, immersive experiences. It’s a dynamic package—one we hope projects Upperquad as explorers of new perspectives and practitioners of possibility.
Favorite details: There’s a moment on the website where project cards physically push over the messaging that precedes it. The implications are immediate: process is important, but the results matter most.
Challenges: As a representation of the studio, there’s certainly a bar of excellence that we place on internal projects. This threshold bleeds into every decision we have to make: Is this section the best it can be? Is this effect really working? Can we say this clearer? Are all the elements harmonizing well? Have we met all the challenges we set out to tackle? When is enough enough? Projects like these can be psychologically taxing.
Studio work also lives in between. Since clients take priority, we have to pick this up in stolen moments after meetings and tight windows in our scheduling. So, it’s always rummaging in the back of your mind, and you often have a desire to revisit past decisions. Building momentum to the finish line is a real challenge.
Time constraints: There are lots of trials, prototypes, tests and experiments on the cutting room floor—ideas not pursued because of the time it would take to build them. We had this awesome full-site-scaling effect that added a physicality to the site that we’d never seen before. But after several dev iterations, we couldn’t quite crack running in browsers smoothly enough, so we needed to quickly pivot to some other effects and movements that had a higher probability of success that we could hit in our dev window. The site’s amazing intro experience was a result of this required exploration.
New lessons: We learned a lot of things. We have a new language to describe ourselves and our work. We learned lots of new After Effects expression techniques to simulate unique scroll effects in prototypes. We now have avenues to achieve some very cool visual and multimedia effects through WebGL. We learned lots of typographic techniques to bring our words to life on the interactive stage. We pushed our 3-D and motion capabilities further. This site widened our collective studio capabilities by a wide margin.
Navigation structure: Our biggest structural addition was the introduction of a services page. It’s a light introduction to our creative process and studio capabilities, meant to answer questions like: “What’s your process?” and “What do you do?”
The page itself is both structured and malleable. We’re outlining a creative process that is purposeful, honed overtime and designed for success, yet is effortless enough to adjust to particular needs of our clients and their ways of working. It feels like a living document of discovery, partnership and inspiration, where collaboration and innovation converge to shape extraordinary outcomes.
Navigation wise, we use common patterns for much of the remaining site: Work, News, About and Careers. We weren’t feeling the need to be too subversive when it came to getting people quick access to recent work or learning about the team.
Special navigational features: We love the transition effects between pages. We found a unique way to wipe away the current content and enter new pages so every link feels smooth and considered.
The homepage serves as a menu disguised in bold visuals and smart language, inviting you to key pages you might find interesting.
Our oversized footer doubles down on accessibility, reminding you of all the interesting places you can travel if you’ve reached the bottom.