Amanda Sakuma
May 16, 2024

How Our Team Approaches Designing With Code

Cover

Esteban and Fernando collaborating

If there was ever a time to overhaul the way that we think about product design, that moment may be now.

As many have noted throughout the industry, the writing is on the wall: Tech companies are still rebounding from record layoffs, the rise of artificial intelligence is challenging old assumptions and ways of doing business, and all the while, critics continue to bemoan how digital spaces now feel far less joyful and fun.

So what can designers and engineers do to break through the noise? One option, as we noted last month, is to give the field of product design space to evolve. And for us, that means reimaging ways that our team approaches their roles. The following is a conversation with members of the DSI team — Fernando Florenzano, Francisca Ibarra, Lauren Dukes, Lucas Dino Nolte, Martin Bravo, and Rune Madsen— to share our process toward merging design and engineering together as one, as well as practical tips for others who are looking to do the same.

Don't get hung up on job titles

Product design needs to break out of the self-limiting belief system that design and engineering are two distinct processes that must remain separate.

If you think about it, it’s odd how the field isolates different teams in these ways, Rune says. Designers are expected to dream up ideas while remaining disconnected from the product’s underlying technology, which takes time to finesse. Then comes the handover process, where engineers must step in and execute a vision that they were not involved in creating. Each step in the process, meanwhile, eats up time and often redoubles work because the two teams rarely collaborate together at once.

But how do teams break out of this cycle?

“No handovers,” Rune says, “ is kind of the core ideology.”

It takes an openness to learning and a willingness to question the status quo in order to embrace a new workflow, he adds. Instead of putting designers and engineers into separate boxes that have hard boundaries defining their roles, teams should instead view their skills on a continuous scale. This simple mindset shift can help teams capture an individual’s full potential, especially when they nurture and develop skills that overlap between the two fields.

In practice at DSI, that means not letting job titles limit the scope of any individual employee’s role. “No one is fully the engineer or fully a designer,” Francisca says. “It helps the process move much smoother.”

That’s not to say that everyone should code. While the question of whether designers need to learn programming skills has been a trending topic over the years, they shouldn’t be the only ones leveling up skills outside of their chosen field.

“It should be the other way around too,” Francisca says. “Engineering should also have active involvement in the design process in order to fill the gap between where the two areas should meet.”

Check your ego while practicing humility

It takes a level of humility in order to truly embrace change. Many of the product design workflows and organizational structures in place today are built on the idea that design and engineering are fundamentally incompatible in certain capacities. It doesn’t help that workplace stereotypes around each field further entrench that divide.

“We can’t live in a world where designers are like, ‘let’s hope the engineers don’t fuck it up,’” Rune says of the concerns that arise at the handover stage when designers no longer have hands-on involvement toward executing their vision.

On the flip side, engineers too often don't feel the agency to challenge the designs they're supposed to build, says Fernando. “At least in the engineering world, I think it’s easy to just focus on the task that is presented, so they are able to go to the next task, and leave any design opinions or thoughts to whoever has that role.”

While it’s common and expected of teams to be hyper-focused on their work, and not sweat the big picture, we believe that this siloed approach separating design and engineering limits potential. Bridging that gulf requires compassion and mutual respect for each craft.

For those designers and engineers looking to expand their skill set and branch out into other fields, our advice is to simply try it out — take on projects that push you out of your comfort zone.

“It’s better to try and start failing, and eventually you will get used to it,” Francisca says. “I think that’s the way to start learning about the other side.”

Make cross-collaboration part of your creative process

One practical tip for designers and engineers who are interested in merging the two disciplines is to regularly partner with someone outside of your field very early on in the design process.

“You become a better professional when you are able to collaborate deeply with people who are very different from you,” Martin says.

For Lauren, that approach has involved teaming up regularly with her colleague Esteban, who is able to provide technical expertise as they design and build products together. “We’ll be working together constantly — either brainstorming or researching or prototyping,” she says, “and Esteban is just really good at vocalizing the technical considerations as we're working in such a natural back and forth way.”

As the only person on her team who doesn’t code, Lauren can offer a unique perspective in challenging assumptions around what designs are even possible to execute. The important part is fostering a work culture that values generosity and the active exchange of ideas.

“It's just a part of our creative process,” she says.

You become a better professional when you are able to collaborate deeply with people who are very different from you.

Martin Bravo

Think of code as a design material

One of the values of taking an interdisciplinary approach toward design and engineering is that it fosters innovation when teams are equipped with the knowledge to envision the best-possible solutions for each task at hand. For digital designers in particular, understanding how code works as a medium can help them identify blindspots in their work.

“You insist on the wrong things when you don't know the medium,” Rune says.

Martin uses other disciplines within the field of design to help illustrate the team’s approach. In fashion, for example, a designer must have a deep understanding of how different types of fabrics stretch, fold and wrinkle, affecting the overall look and feel of a garment that they create. Their knowledge of the underlying materials — like understanding how a lightweight silk will flow in the breeze compared to the structured rigidity of a fabric like denim — ultimately enhances their designs because they are equipped to choose the ideal type of materials that would best suit their vision.

For digital designers, their source material is code. And so when designers remove themselves from the technical side of bringing their ideas to life, they lose out in not being able to customize the best-possible solution. But if designers deeply understand code as a material and how it works, then they’re better-positioned to envision possible solutions and collaborate more deeply with engineers, Martin says.

“It's an informed conversation on the constraints of that thing that you're creating,” he adds. “The technical questions are design questions deep down. We don't separate execution from design because we think design goes hand-in-hand with execution.”

A video call with the team

Let technical constraints spark creativity

Some designers may find it daunting to suddenly embrace technology, either by integrating technical considerations into their creative process, or learning how to code themselves. But that doesn’t have to mean that technical or skill limitations should be considered a bad thing.

Designers can bring a great deal to the table by embracing technical constraints, Lucas says. Instead of being turned away by those limitations, designers can leverage their experience and expertise to seek out new creative solutions. Not to mention there’s huge value in tinkering with code in order to spark curiosity and discover joy in creating entirely original work on your own.

“It is just very liberating,” Lucas says. “Even if your coding skills are very limited then, so be it, your coding skills are now the constraint — make something within that constraint.”

Similarly, developers may not find the confidence to push design decisions due to a lack of experience, or they feel it’s hard to embrace the creative process. But this is where trying, potentially failing, and being open to learning from coworkers helps in getting used to design processes and ideas. People usually surprise themselves when they realize they do have perspectives that add to the process when they try.

Related projects

  1. Cloudsmith
    Cloudsmith
    Cloudsmith
    Cloudsmith

    Cloudsmith

    Redefining how a fast-growing SaaS communicates value

    2023
  2. Chief
    Chief
    Chief
    Chief

    Chief

    Elevating marketing operations to keep up with rapid growth

    2022
  3. AIxDesign
    AIxDesign
    AIxDesign
    AIxDesign

    AIxDesign

    Designing a visual system for AI powered by AI

    2022