How Punchcut prototypes the future

How do you design a human experience for tech you’ve never used? You rely on an understanding of human behavior, a perspective on the future, extensive field research, and a whole lot of prototyping.

Punchcut is a future-focused product design and innovation firm based in San Francisco. Clients like Fitbit, Nissan, Google, and Visa seek Punchcut’s expertise and collaboration because while other agencies thrive in the known digital world, Punchcut specializes in UX/UI design for new tech—or tech that does not yet exist.

While the focus of the work is user experience design, the outcome is diverse. It ranges from automotive experiences to wearables, smart home/IoT, voice UI design, AR/VR, and other emerging platforms.

We spoke with the Punchcut team to learn more about how they approach UI for future tech.

InVision: Where do you start when you’re designing interactions for tech you’ve never dealt with before?

Punchcut: We were around before the iPhone, when device capabilities were very constrained, and we had to think in terms of an ecosystem. We look at new problems through a series of interrelated lenses: the people, the technology, the services they’re using, and the spaces they’re used in. Then we ask, What’s the right experience when we consider these four lenses?

It’s already in our DNA not to think of UX as a digital problem or product problem; it’s always been a human experience.

InVision: How does user research work in a new-tech situation?

No matter how tech changes, user experience design is still rooted in basic ideas of how humans engage. We start with a deep understanding of core human needs and how people interact with one another. The technology may evolve and introduce new possibilities, but humans’ needs are slower to change. We go into real peoples’ homes, cars, workplaces, etc to observe and understand what they’re trying to accomplish and where a new product or technology might fit into that ecosystem. In some cases, the insights we gain dramatically reshape the product.

Voice UX is a good example of where we as a team have endeavored to move as far ahead as possible and understand the space. It started with leaning into the capabilities of different platforms (eg. Google vs Alexa vs Siri) and then combining that with real-world interaction and validation with real people.

“When it comes to creating products, there’s no substitute for getting the real thing, or the closest simulation of it, into real peoples’ hands.”

From there we’ve done our own research about what people expect from voice tech. There’s a report on voice UX on our site.

When we’re looking at a new voice interaction, we’re looking for a recipe, a design system. Any dialogue can be constructed out of fragments, like components: Here’s a hello. Here’s an apology, here’s an exit, here’s ‘get help.’ Whether the user is speaking to a refrigerator or a car, there’s a recipe.

InVision: How has InVision Studio made a difference in your prototyping?

Punchcut: We always begin from the perspective of the space and work through to the interactions. What’s interesting about the transition to InVision Studio is that you can show motion, clickability, and interaction in one tool. It’s a big deal for our dialogue to be able to show those interactions, to show everything from visual hierarchy to motion to audio, to match the visual space. You can tell a complete story using motion and interaction.

InVision Studio is a great environment to bring novel interactions to life. It’s a big part of our client collaboration to put the product vision in a form they can experience first-hand, and then demonstrate it in the field in user research sessions.

We aren’t afraid to do some hacking if it will make the experience more realistic. Most prototyping tools work great for touching a screen or clicking a mouse, but what happens when you need to test concepts with entirely different input models? That’s when you hack. Often the tools that can get you close to reality are already available. They just need a few tweaks.

Here’s an example of a hack that we’ve been using to test TV interfaces. We mapped key presses in InVision Studio to a video game controller.

Much of our work is harnessing the collective intelligence of a group, so we’ve also been exploring InVision Studio to build prototype tools for collaborative design decision making. Rather than using Studio to work on the end product, we’ve been looking at ways to use it to perform foundational exercises to establish a shared design vision and framework.

InVision: You mentioned Punchcut prototypes intensely. Where does prototyping fit into your research?

Punchcut: When it comes to prototyping, we do it to learn internally as much as to demonstrate externally. The legwork starts as a logic system that lays out the interactions. Of course, a future concept on paper is very different than a live interaction with that experience. Until we’re able to apply that logic, we don’t know enough about it.

So we prototype throughout our process to validate assumptions, see what’s working, and glean insight from what doesn’t work.

When it comes to creating products, there’s no substitute for getting the real thing, or the closest simulation of it, into real peoples’ hands. Once we can observe them using the product in an appropriate real-world environment, we can validate the design and know where to refine the experience.

We have a huge belief in the power of making things, testing rapidly, and synthesizing those findings.

Sometimes our prototypes are about conveying the potential structure of a system, not the final design flow. Commonly this is in the form of a spatial model. They can come in many sizes and shapes, but primarily they’re 3-dimensional maps that help to visualize the primary layers of an interface and define the relationships between key states or screens.

Check out Punchcut’s live prototypes.

We use a model with simple content blocks to focus on the interaction and not the design. It makes it easy for someone to see the difference between something like a card-based carousel versus a vertical set of modules. Once we’ve concluded the best way to approach the system we can turn our attention to creating higher fidelity prototypes.

InVision: How do you convince clients it’s worthwhile to keep prototyping and testing frequently?

Punchcut: Thankfully, we work with savvy teams who understand the value that iterative prototyping and testing can bring to a product experience.

A typical process involves exploring broadly, then establishing a few recommended design directions. We show our client InVision prototypes of A, B, and C paths to explore product directions before they invest too deeply. They’re able to experience the product while a designer explains the pros and cons, and they make an informed decision on a direction that day, one they feel good about. It takes half a day vs. half a year. Very fun to watch.

The clients catch on to how our process mitigates risk when they use the prototype. They see better validation.

InVision: What’s the value in starting with the end in mind?

Punchcut: Individual subjectivity can creep into the design process at all stages, so we’re big believers in establishing metrics and measures up front, which enables teams to evaluate design objectively down the road.

Check out Punchcut’s live prototypes.

Every new project begins by understanding the brand and establishing the desired experience attributes, so we know what the product needs to embody. From there, it’s about looking at the problem through those four lenses: people, technology, spaces, and services—a methodology we call Experience Systematics.

Once InVision Studio has helped us solidify the product vision, we see it as our core responsibility to champion the vision through the build process, which can be fraught with compromise and require new design decisions. An iterative prototype can save a design team from hundreds of pages of tedious documentation.

When designing for the future, it’s more important than ever to prototype and collaborate on the path to launching amazing products for people.