オンラインでのコミュニケーションを円滑にする秘訣！正確に伝えるための心がけとツール活用

neccoのメンバーは、秋田オフィス、東京オフィス、リモートメンバーとそれぞれの拠点に分かれて仕事をしています。

特にエンジニアメンバーは、東京・秋田・札幌に拠点が分かれており、直接会って話すのは年に数えるぐらいしかありません。デザイナーメンバーとも、拠点が離れており、テキストコミュニケーションが重要になります。

私は入社当初、テキストのみでは伝えたいことを伝えることがなかなかできず、苦戦しました。入社から約2年経過し、テキストコミュニケーションの難しさ自体は変わらないものの、コツのようなものは掴んできていると感じています。

そこで、今回は各拠点のエンジニアはもちろん、デザイナーメンバーとのコミュニケーションを円滑にするため、アシスタントフロントエンドエンジニアの私が日々使用しているツールと正確に伝えるための心がけについてまとめました。

neccoの働く環境が気になる、どのように普段コミュニケーションをとっているのか気になる方などの参考になれば嬉しいです。

画像編集ツール「Shottr」で視覚的に伝える！

リモート環境では、テキストコミュニケーションでいかに伝わりやすく文章を作ることができるかが重要です。

ただ、どうしても文章だけでは足らず、伝えにくいこともあると思います。そんなときは何について伝えようとしているのか明確になるように画像や動画を添付しています。これは、私以外にもほとんどの方が実践している方法かと思います。

画像を添付して、伝えたいときに私がよく使用しているのが「Shottr」という画像編集ツールです。こちらは、エンジニアの佐藤さんに以前ご紹介いただき、それから愛用しています。

以前は、Macのデフォルトの機能を使用していましたが、「Shottr」は、数字の吹き出しやコメントなどを見やすく追加できるため気に入っています。

CMSの更新マニュアルをお客さま用に作成するときにも役立ちます。

こちらはWordPressの管理画面の操作方法をご説明するときの一例です。neccoでは主にNotionを使用して更新マニュアルを作成しています。お客さまのご要望によってGoogleドキュメントで納品するなど、都度形式は変更しています。

数字と合わせてコメントを追加することで、操作の順序が分かりやすくなるように工夫しています。

「Figma」は、neccoのマストツール！
事前に実装イメージを確認し、意図通りに実装する。

neccoでは、デザインツールとして Figma を使用しています。

neccoのメンバーは、Figmaを操作できることがマストです。

Figmaをデザインツールとして利用するだけではなく、既存サイト更新の際に、お客さまからの依頼内容を整理するためにも使用しています。お客さまによって、依頼内容の伝え方はそれぞれなので、私たち受け取る側でも、それぞれの捉え方で間違えた解釈を持ったまま更新してしまう可能性があります。

間違えた解釈で更新するのを防ぐためにも、Figmaを使用して依頼内容を整理し、ディレクターや他のメンバーに事前にSlackで更新内容を共有するようにしています。

事前に共有しておくことで、もし解釈を間違えていた場合に軌道修正できます。

ときには、Figma上で情報を整理しながら更新内容を確認したり、工数を管理することもあります。Figmaで整理しておくことで、実装する際にも、実装後に確認を依頼する際にも視覚的に確認しやすくなります。

その後、同じような更新が発生した場合でも、以前どのように作業したかなども確認することができるので、Figmaでの整理は欠かせない作業です。

アイキャッチもFigmaを使用しながら相談

ちなみに、今回使用しているアイキャッチは、秋田オフィスの夏井さんにもお手伝いいただきながら、一緒にFigmaに案を展開しました。その上で、デザイナーの田口さんに最終調整を依頼しています。

neccoではFigmaに力を入れています！

neccoでは、Figmaの使い方を解説した本を出版しています！

Figmaをこれから使おうと考えている方はもちろん、すでにFigmaを使っている方のお役に立てる1冊になっています。ぜひお手にとってご覧ください！

書籍『これからはじめるFigma Web・UIデザイン入門』を出版します

出版記念イベントを開催

出版記念イベントのアーカイブは、こちらからご覧いただけます。

【前半】『これからはじめるFigma Web・UIデザイン入門』出版記念イベント
【後半】『これからはじめるFigma Web・UIデザイン入門』出版記念イベント

イベントで使用しているスライドもFigmaを使用しています。

「Figmaの導入・使い方講座」承ります

また、Figmaの導入ご検討の各企業さまやチームのご都合にあわせて「Figmaの導入・使い方講座」を開催しております。詳しくはこちらの記事をご覧ください。

Figma 入門書を執筆したneccoメンバーが行う「Figmaの導入・使い方講座」勉強会のご依頼を承ります！

「Slack」と「Notion」は、プロジェクト概要の宝庫！
誰かに確認する前にまず目を通す。

社内のコミュニケーションツールは「Slack」を使用

necco内でのコミュニケーションツールとして、主に Slack を使用しています。

Slackの管理方法

neccoへ入社した方が一番最初に驚くのはSlackチャンネルの量です。チャンネル数を改めて数えてみたところ、3/25日現在で社内のチャンネル数は110件を超えていました…！

私も含め、全員が入社時に圧倒されていると思います。笑

neccoでは、接頭辞つけてグルーピングし、管理しています。プロジェクトに関することで検索したい場合は、pj-◯◯ から検索すると見つけやすいです。

社内のデータベースは「Notion」を使用

neccoでは、社内のデータベースとして Notion を使用しています。
そのため社内外を問わず、ミーティングの議事録はNotionを利用しています。

プロジェクトに参加する際は、事前に議事録や概要に目を通す

プロジェクトによっては、途中から参加することがあるため、事前に議事録にざっと目を通すことを心がけています。あらかじめ依頼の経緯や、議事録を確認することで、他のメンバーからの引き継ぎを待つことなく、情報を集められます。

プロジェクトの経緯をあらかじめ知ることで、メンバー間の認識を揃えられます。

社内Slackを検索して「こんな話は出てたかな？」と、当時の会話を検索する場合もあります。議事録から汲み取れないことや、分からないことは作業前に聞いて確認します。

自分から作業を依頼する際に気をつけているポイント

過去の議事録やSlackでの会話の中から読み解いて理解するのは、正直かなり労力を使います。プロジェクトが長期に及んでいると尚更大変です。また、社内ではさまざまなプロジェクトが進行する中で、突然の「お願い」はそれまでの経緯などが把握できていないと、「何のためにその対応をするのか」を理解するまでに時間がかかります。

この労力をできるだけ減らすために、自分から依頼する場合は、できるだけ経緯・作業内容など簡潔に送るように心がけています。

シチュエーションによってさまざまですが、下記のような内容をまとめて共有することが多いです。

• お願いしたいこと
• 作業・相談の経緯
• 試していること、考えていること
• 今後の作業想定
• スクリーンショット画像や動画

依頼するメンバーの負担を軽くできるよう、小さなことではありますが気をつけるようにしています。

作業内容はNotionにメモ！
相談しやすい状態を常に心がける

私は、何か作業する時や、メモを残しておきたい場合など、社内Notionで「Daily Log」として作業内容を残すようにしています。社内のメンバーは、全員見ることができるフォルダに記録しています。

こちらは入社当時から続けています。

主に下記のような内容を残していることが多いです。

• 対象のプロジェクト名
• 何をしようとしたのか
• どんな環境で行っているのか（使用しているバージョンなど）
• 検討した方法やライブラリ、プラグインなどのメモ
• 試したことと試していないこと
• 試した結果できなかったこと

後から似たような事象が発生した場合に見返したりすることもできます。

こまめに自分の試したことや試した時考えたことなどを簡単にでも残しておくことで、他のエンジニアに相談するときにも情報をまとめて共有しやすくなり、時間の短縮にもなります。

Notionでまとめた検証内容をもとに、Slackで共有する際には下記のように記載して相談するように心がけています。

• 相談内容
• 試したこと
• 考えていること
• 作業時のメモとしてNotion「Daily Log」のリンク
  （あくまでも補助程度の役割として添付）

Notionに記載したメモは全て読むのに時間がかかるため、補助程度のものとなるように添えるだけにし、あくまでもSlack上で伝えたいことが完結するようにしています。

実装の仕様検討など周りに意見を伺いながら検討したいようなものは、プロジェクトごとのNotionにファイルを用意して整理しており、作業内容によって使い分けています。

「NeWork」で直接会話！
テキストや画像・動画で伝えるのが難しい場合の手段。

neccoでは、ミーティングする場合、主にNeWorkというサービスを利用しています。

Neworkとは、ワンクリックですぐに話せるリモートワーク、オフィス、複数の拠点が同じ空間でつながるオンラインワークスペースです。

それぞれ拠点が離れているneccoには欠かせないツールです。社内ミーティングや、プロジェクトごとの社内ミーティングなどはNeWorkで行っています。

デザインやアニメーションの意図、仕様の相談など「テキストでは伝えきれない！」そんなときはNeWorkに集まって会話します。アニメーションなどは特に、オンラインで繋いで会話した方がイメージしやすいです。

疑問に思った点は、できるだけ質問して解決しておくように心がけています。毎日会話する時間が作れるというわけでもないので大切にしたい時間です。できるだけ会話する相手の理解度も考慮しながら、話すスピードにも気をつけています。

neccoで行っているエンジニアミーティングについて

エンジニアメンバーで定例ミーティングを開催しています。エンジニアミーティングもNeWorkを使用します。

以前は毎週水曜日にタスクの進捗や相談、気になったフロントエンドトピックなどを共有していましたが、現在は、下記のような日程で開催しています。

• 月曜日（約15分）：週次ミーティング（1週間の予定を共有）
• 水曜日（約30分）：ワイワイミーティング（相談やトピックの共有）
• 木曜日（約30分）：自社サイト開発ミーティング

オンライン上ではありますが、以前よりも顔を合わせる機会が増えました。ミーティングを分散することで、以前より各エンジニアメンバーの孤独感のようなものは薄れたように感じています。

特に水曜日は「ワイワイミーティング」と題し、今実装で悩んでいることを相談したり、その週に気になったフロントエンドトピックの共有や、エンジニアには関係ないお題をアイスブレイクとしてワイワイ話しています。

ミーティングというと少しお固いイメージをしてしまいますが、水曜日はコミュニケーションをはかり、メンバーへの理解を深めることが目的です。

アイスブレイクは「アイスブレイク用クエスチョン出題ツール」に大変お世話になっています。ランダムでトークテーマが表示されるツールで、普段は会話に上がらないようなお題もあり、かなり盛り上がります！

普通に会話していてもテーマに上がらないような内容もあるので、ぜひお試しください！

さいごに

neccoで2年ほど働いていますが、拠点が離れているメンバーとのコミュニケーションは、いまだに難しいです！コミュニケーションは、日々改善しながらではありますが、みんなで同じ方向を向いて仕事していけるように、今後も私自身、気をつけていきたいと思います。

neccoでは、カジュアル面談なども受け付けております。neccoにご興味をお持ちの方はぜひご応募ください！

お仕事のご依頼・採用募集

📮 お仕事のご依頼やご相談、お待ちしております。

お仕事のご依頼やご相談は、お問い合わせ からお願いいたします。

🤝 一緒に働きませんか？

下記の職種を募集中です。より良いデザイン、言葉、エンジニアリングをチームで追求していける方をお待ちしております。詳細は 採用情報 をご覧ください。

• デザイナー
• アシスタントデザイナー
• フロントエンドエンジニア
• アシスタントフロントエンドエンジニア

🗒 会社案内資料もご活用ください。

弊社のサービスや制作・活動実績、会社概要、ご契約など各種情報をまとめた資料をご用意しています。会社案内資料 からダウンロード可能ですので、ぜひご活用ください。

（2024年10月時点）