【FigJam】FigJamは、ここまで来た。面白いウィジェットまとめ

## はじめに
[Figma Advent Calendar 2021](https://qiita.com/advent-calendar/2021/qiita)の5日目は、
Qiita 株式会社 プロダクト開発G デザインTMの出口（@degudegu2510）が担当します！
業務では、[Qiita](https://qiita.com/)、[Qiita Team](https://teams.qiita.com/) 、[Qiita Jobs](https://jobs.qiita.com/)のUI/UX、フロントエンド、各イベント等のクリエイティブを担当しています。

ぜひ[Qiita Advent Calendar 2021](https://qiita.com/advent-calendar/2021/qiita)の1日目、2日目にも参加しているので、ぜひご覧ください。

https://qiita.com/degudegu2510/private/9682968a045b168f89c2


この記事では、FigJamで僕がおすすめするWidgetsを紹介する記事です。

+ FigJamについて、あまり詳しく知らない。
+ FigJamのおすすめするPlugins・Widgetsについて知りたい。

という人におすすめです！


## FigJamとは？
今、もっとも注目を集めているデザインツール『Figma』を使ったオンラインホワイトボードです。

ブレインストーミングやマインドマップ、フローチャートなどが簡単に作成でき、
チームで共同制作する上で情報の共有が円滑に行えたり、
より円滑にチーム内でのディスカッションが行えるようになる機能です。

今回はこのFigJamで使えるちょっと面白いウィジェットをまとめました。


## FigJamウィジェット
### Rock Paper Scissors
![スクリーンショット 2021-12-04 17.36.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/f183bf8d-b4ff-fc0b-6e87-a00f61f89405.png)

Figmaでジャンケンができるます！
Zoomだと、じゃんけんのタイミングを合わせるのは、難しく後出しされたと感じることが多いですが、
このウィジェットを使えば、恨みっこなしの公平なジャンケンができます。

**使い方**

1. ジャンケンに参加する人が`Join`をクリックします。
1. ジャンケンで出す手をクリックします。
1. 2人の手が決まったら勝敗がわかります。


|参加前|手を選ぶ|勝敗|
|----|----|----|
|![スクリーンショット 2021-12-04 17.48.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/37ab27ec-e112-030c-15b8-f2ebce0526d7.png)|![スクリーンショット 2021-12-04 17.48.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/02818430-c1f8-88e7-1fc9-d314ed8e62eb.png)|![スクリーンショット 2021-12-04 17.48.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/1ce872b9-e6f6-88bc-62ed-65f847d19876.png)|


### Connect4
![スクリーンショット 2021-12-04 20.28.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/e1c17762-8d0f-32ac-0cf9-80bf419650e2.png)


コネクト4は、2人のプレイヤーが交互にコマを下から積み重ねて、
先に縦・横・斜めいずれかに4つ並べた方が勝ちになるボードゲームです。

このウィジェットを使えば、会議前の数分とか、休憩中にも遊ぶことができます。

**使い方**

1. 参加者が`コマ`をクリックして、自分のコマを選びます。
    - 赤いコマが先攻.、黄色いコマが後攻です。
1. 'Start Game'をクリックしてゲームをスタートさせます。
1. 交互におきたい列をクリックしてコマをおきます。
1. 先に縦・横・斜めいずれかに4つ並べたら勝ちになります。

|参加前|ゲーム中|勝敗|
|----|----|----|
|![スクリーンショット 2021-12-04 20.39.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/1fbfe65d-4533-8473-16cf-7017e21b17bd.png)|![スクリーンショット 2021-12-04 20.43.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/70f2366a-e706-8f86-a6c2-41ea69d498c2.png)|![スクリーンショット 2021-12-04 20.44.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/a5eefde2-7de3-3009-5eb4-a54e359d64c2.png)|


### Tic Tac Toe
![スクリーンショット 2021-12-04 20.46.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/d74a386e-f7e2-f7b2-02c5-1bfd15e8c846.png)

Tic Tac Toeは、3目並べです。⭕️❌ゲームともいうかもしれません。
交互にコマを置いて、先に縦・横・斜めいずれかに3つ並べた方が勝ちになるボードゲームです。
特に人数制限はないようなので、大勢で遊ぶこともできます。

**使い方**

1. 参加者は`Join`をクリックします。
1. 参加者が揃ったら、 `Start`を押して、ゲームをスタートします。
1. 交互におきたい列をクリックしてコマをおきます。
1. 先に縦・横・斜めいずれかに3つ並べたら勝ちになります。

|参加前|ゲーム中|勝敗|
|----|----|----|
|![スクリーンショット 2021-12-04 20.57.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/1d5c8894-42ce-6497-866f-fbf85efefb56.png)|![スクリーンショット 2021-12-04 20.58.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/46c42f46-26ef-025a-a377-76cc1be9ec93.png)|![スクリーンショット 2021-12-04 20.59.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/996ab594-83f6-4aa2-f895-978cf479ccd8.png)|


### その他
今回は詳しく記入しませんが、ほかにも色々なwidgetがあります。

|Dice|Coin|Etch a jam|
|----|----|----|
|![スクリーンショット 2021-12-04 21.06.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/95ec1b2d-73e1-073d-c70f-88556e876a75.png)|![スクリーンショット 2021-12-04 21.08.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/61e7d209-3934-1383-9bf2-78ce1bb87498.png)|![スクリーンショット 2021-12-04 21.10.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/56af4b73-720e-a759-622f-947c4b206ab9.png)|
|**Pie chart**|**Poll**|**カレンダー**|
|![スクリーンショット 2021-12-04 21.13.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/fa94fa9a-b24c-2fe9-b612-8d9d3aa6e7e0.png)|![スクリーンショット 2021-12-04 21.15.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/a6fa8913-e64c-dad3-f547-daae6db2fcb3.png)|![スクリーンショット 2021-12-04 21.18.16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/390720/f3cbc8c1-bd12-2aba-2672-f1c4bc529884.png)|



## まとめ
この記事では、FigJamで僕がおすすめするWidgetを紹介しました。

実務で使えそうなものから、遊びでしか使えそうにないものまで、幅広くありました。

今後Figjamは仕事だけではなく、オンラインで遊ぶ時にでも使えそうです。
なので、デザイナーだけでなく、エンジニア・ビジネスの方々も一人１アカウント持つ時代が近々来そうです。

お正月は、FigJamのDiceウィジェットを使って、オリジナル人生ゲームでもして過ごそうかなと思います。

---

最後まで読んでくださってありがとうございます！

普段はデザインやフロントエンドを中心にQiitaに記事を投稿しているので、ぜひQiitaのフォローとX(Twitter)のフォローをお願いします。

https://twitter.com/degudegu2510