---
title: "FigJam + CoderPad: A More Visual Way To Interview | CoderPad"
description: "Let’s explore how you can integrate your CoderPad interviews within Figma for each candidate."
canonical: "https://coderpad.io/blog/product-updates/figjam-coderpad-a-more-visual-way-to-interview/"
last_modified: "2022-01-10 13:46:14"
---
[Back to blog](https://coderpad.io/blog/)

# FigJam + CoderPad: A More Visual Way To Interview

October 19, 2021 2 Minute Read [Product Updates](https://coderpad.io/blog/product-updates/)

We’ve talked about [how beneficial UI mockups can be for Front-End interviews](https://coderpad.io/blog/interviewing/improve-front-end-coding-interviews-with-mockups/) and [how visuals can accelerate Back-End interviews](https://coderpad.io/blog/interviewing/leverage-visuals-in-back-end-engineering-hiring/) in the past.

Luckily, you don’t have to give up your favorite tools to utilize these concepts to their fullest potential. Let’s explore how you can integrate your CoderPad interviews within Figma for each candidate.

Start by setting up your FigJam file to use in your interview. You’ll want to include any relevant diagrams and visuals required for your candidates’ technical assessment.

![A systems diagram drawn in FigJam](https://coderpad.io/wp-content/uploads/2021/10/img_616ee8038a837.png)

>

If you want to include a mockup from a Figma file, remember that you can copy and paste assets and frames from a Figma file into a FigJam file

Once this is done, add the CoderPad Widget. To do this, select “Browse Widgets”, and search for “CoderPad”

![The "Browse widgets" button in FigJam is under a "show more" button](https://coderpad.io/wp-content/uploads/2021/10/img_616ee806bc7fe.png)![Search for "CoderPad" in the FigJam widget search](https://coderpad.io/wp-content/uploads/2021/10/img_616ee80756491.png)

Once you add a CoderPad widget to your FigJam instance, you’ll see a widget with the ability to “Create a pad”: press the button to open your CoderPad instance.
The first time you open a CoderPad widget, it will ask you to add your API key

![Creating a CoderPad instance in FigJam starts with an API key prompt](https://coderpad.io/wp-content/uploads/2021/10/img_616ee807ab1f7.png)

Once you’ve put in your CoderPad API key, you’ll be greeted with an interview pad created with your default language.

>

To get your CoderPad API key, [see our documentation page on retrieving it](https://coderpad.io/resources/docs/interview/more-interview-resources/api-key/)

![You can load in your React questions in CoderPad without having to leave FigJam](https://coderpad.io/wp-content/uploads/2021/10/img_616ee808e8965.png)

When you join the pad, it will pre-fill your name from your Figma account. When others join the CoderPad interview from FigJam, it will show who’s currently in the pad in the FigJam widget

Even if you close a CoderPad widget window, it will not create a new pad. Only once you create a new CoderPad FigJam widget will a new pad be created.
Because of this, if you accidentally close the CoderPad window, you can rejoin the same pad simply by selecting “Join”.

## CoderPad for FigJam

[Try the widget](https://www.figma.com/coderpad-for-figjam/)

## Subscribe for more CoderPad insights

## Trending Articles

Previous slide Next slide [Product Updates

## Your Question Bank Is Leaking. Here’s the Fix.

Every hiring team eventually hits the same wall: TA own raising the bar, don’t have the technical knowledge required to write questions that test for it. So teams are improvising, a shared question bank, a busy engineer’s spare 20 minutes, and last year’s assessment recycled one more time. It feels fine butt isn’t. Recycled and […]

Read the post](https://coderpad.io/blog/product-updates/your-question-bank-is-leaking-heres-the-fix/) [Product Updates

## 2026 Product Recap: Technical Hiring Has Changed. We Built for What Comes Next.

AI has fundamentally changed how engineers work. It’s not a tool candidates might use anymore. It’s embedded in how code gets written, reviewed, and shipped every day. In many teams, the majority of code is already AI-assisted—and growing. Which leads to a clear conclusion for hiring teams: Trying to remove AI from the interview process […]

Read the post](https://coderpad.io/blog/product-updates/2026-product-recap/) [Product Updates

## Top 14 CoderPad Features of 2024 – Features That Were Too Good to Miss

2024 has been an exciting year for technical hiring, and we’ve been honored to be part of your journey. Whether you’re a recruiter working hard to attract the right talent, an interviewer crafting thoughtful assessments, or a candidate showing your best work in sometimes stressful situations, every step of the process matters. This year, our […]

Read the post](https://coderpad.io/blog/product-updates/top-14-coderpad-features-2024/) [Product Updates

## CoderPad June releases

You can now add a custom time frame for candidates to complete tests, give candidates the option to take a test in Chinese, export your pad and test usage stats...

Read the post](https://coderpad.io/blog/product-updates/coderpad-june-releases/) [Product Updates

## CoderPad April Releases

Learn what's new with CoderPad for April.

Read the post](https://coderpad.io/blog/product-updates/coderpad-april-releases/) [Product Updates

## CoderPad March Releases

Webcam proctoring, custom question insights, and more for March.

Read the post](https://coderpad.io/blog/product-updates/coderpad-march-releases/) [Product Updates

## CoderPad February Releases

New product features for February!

Read the post](https://coderpad.io/blog/product-updates/coderpad-february-releases/) [Announcements

## The 2023 CoderPad year in review

Please this countdown of the top features we think will help you make hiring and interviewing more real, fast and fair in 2024.

Read the post](https://coderpad.io/blog/announcements/the-2023-coderpad-year-in-review/) [Product Updates

## CoderPad November Releases

Find out what's new this month in CoderPad Screen & CoderPad Interview

Read the post](https://coderpad.io/blog/product-updates/coderpad-november-releases/) [Announcements

## CoderPad October Releases

It's been a busy October at CoderPad!

Read the post](https://coderpad.io/blog/product-updates/coderpad-october-releases/) [Product Updates

## CoderPad September Releases

Learn what's new in CoderPad this month.

Read the post](https://coderpad.io/blog/product-updates/coderpad-september-releases/) [Product Updates

## CoderPad August Releases

Learn more about the great things coming your way.

Read the post](https://coderpad.io/blog/product-updates/coderpad-august-releases/)

## Hire with confidence.

See why engineering teams trust CoderPad to evaluate developers with realistic, AI-ready hiring workflows.

[Request a demo](https://coderpad.io/sales/)
