ホーム > blog
  • グループメッセージやグループチャットでのやり取りが煩雑になってきたころには、Backlog(バックログ)を使うとより良くなると思います。

    この記事は、Backlog Advent Calendar 2021 の記事として書いています。

    コロナの影響などで、グループチャットなどのネットを利用したコミュニケーションがIT業界以外にも広がる

    コロナの影響でリモートワークが急速に進みました。IT業界の人であれば、もともとパソコンやスマートフォンを使うことが日常にあるので、リモートワークへの移行は比較的スムーズだったかもしれません。

    ただ、普段PCをあまり使わない業界の方。例えば店舗での営業の方々だと、普段の仕事において、パソコンを操作する時間はそれほど多くなく、また、自宅にはPCが無い方もおられると思います。そういったメンバー同士だと、なかなかPCの情報共有システムを全体で使おうというは難しいこともあります。

    それでも、なんとか部分的にでもネットを利用して仕事の効率をあげたい!そこで、普段使い慣れているスマートフォンからも利用できる、グループメッセージやグループチャットを利用して情報共有をしていこう。ネットでも互いにコミュニケーションをしていこう。という動きがあると思います。

    これはとても手軽で、サクッと導入ができるので始めやすいですね。一斉に通知でき、また即時性も高いので、

    • 全体に伝える
    • 今聞きたいメンションして聞く

    等がネットの力を利用して実現できます。

    グループメッセージ導入時の”あるある”な出来事2つ

    これはとても良いことだと思うのですが、グループで使っているといくつかの、“あるある”に直面されているグループもあるのではないかと思います。

    大きくは次の2つの“あるある”かなと考えています。

    1. いつでも通知が来てしまう。

    こちらは、ネットが持つ便利部分で、24時間365日、常に情報を送受信でき、即時性が高く、プッシュ通知などの便利な機能がある。という強力な機能が逆に不便になるという形ですね。

    例えば業務時間内に限らず、業務時間外にも連絡を送ってしまったり、テキストでのやり取りを延々とつづけてしまって、多くの時間を使い、互いに疲弊するいったが起こります。

    2. 話がどんどん流れて、見逃してしまう。見つけられなくなる。

    こちらもよくありますね。活発に多くの人がチャットに発言することはとても良いことです。しかし、それらどんどん流れてしまい、複数の話題が同時に話されている場合に、どの話なのかが分かり難くなったり、以前の発言探し難くなったりします。

    “あるある”を解消するために

    1については、「チャットだからといってすぐに返す必要はない。すぐに回答が即時に返ってくることを過度に期待しない。」といったグループ内の前提をルールを設けるのが良いと思います。また、業務時間外にはメンションしない。業務時間外は通知をOFFにすることを推奨する。などが、工夫としては良いと考えています。

    2については、チャットグループをトピック毎に複数に分けたり、返信機能やタスク機能、ピン留め機能など、各チャット機能に備わっているものを利用するのが良さそうです。

    ただ、どちらの問題もチャットツールだけで、情報共有をしようとするために難しくなるところがあり、それを解決する方法の一つがBacklog(バックログ)を利用することだと考えています。

    こんな時にBacklog(バックログ)がおすすめです。

    Backlog(バックログ)とは?

    Backlog(バックログ)は、福岡に本社のある株式会社ヌーラボさんが提供する、Web上のサービスで、グループで利用できる掲示板のようなものです。パソコンならインターネットにアクセスするだけで利用できます。スマートフォン用のアプリもあります。

    トピックス(課題)をつくって、情報を管理していく

    掲示板のようなものなので、例えば以下のようなもの

    • お店の看板を12月10日に書き換える。
    • 振り込みに行く
    • 新商品の販売開始のための準備を行う

    何でも良いのですが、こういった作業の一つ一つをトピックとして作り、それに対して、グループのメンバーがコメントします。これだと、トピック毎に話が読めるので、情報を理解しやすいですね。

    実際にはこんな感じです。

    一覧
    トピックでのやり取り

    また、このトピックには期限を設定したり、担当者を設定したりできます。こうすることで作業の抜け漏れが防止できますし、いま誰がどんな作業を持っているのかがわかります。

    さらに、作業毎の進捗状況も設定できるので、その作業が進んでいるのか、完了しているのか等がひと目で分かります。

    これらの機能なら、チャットの“あるある”として挙げた2つの内容を解決できるかもしれません。

    そもそも、Backlog(バックログ)は掲示板のような、体裁なのでチャットなどに比べて、返信するまでに時間的に余裕が持てる気がします。とはいえ、いつまでも返信しなくて良いというわけではないのですが、トピック毎に期限が設定できるので、その期限内に終えるように互いに調整ができそうです。

    とりあえずで、使ってみてはいかがでしょうか。

    いくら便利!とお伝えしたところで、使えるかどうか不安だと思いますし、使ってみないことには分からないというのが本音だと思います。Backlog(バックログ)は最小のプランなら、利用機能に制限があるものの、無料で利用できます。お試しができるわけですね。

    例えば、コチラの記事では家庭内の作業をBacklog(バックログ)をつかって管理されています。

    【インタビュー】「お中元の検討」など、家庭内のタスク管理にBacklogを徹底活用!“IT系母ちゃん”平 愛美さん

    使い始めるハードルは高そうに感じるかもしれません。しかし安心してください。Backlog(バックログ)の良いところ、初見でもそれほど苦労なく使える、見た目の分かり易さだと私は考えています。日本製のサービスなので日本語が分り易いですし、基本的な機能はとてもシンプルなため、少し触れば日常で使う基本的な機能は大まかに理解できると思います。

    準備に何が必要?個人ごとのメールアドレスが必要になります。

    Backlog(バックログ)をグループで利用するに当たり、最低限必要なものとして、参加するメンバーひとりひとりにメールアドレスが必要になります。もしかすると、これを準備するのが会社によっては割と難しいこともあるかしれません。

    なんとか、ここだけ乗り越えていただければと思います。

    流れる情報と貯めておく情報を上手に使い分ける

    グループメッセージやグループチャットの良いところは、情報がどんどん流して、気軽に連絡したり、相談するところと言えます。もちろん、さまざな機能を利用して情報をためておくこともできるのですが、それがメインでは無いと思います。

    それに対してBacklog(バックログ)は即時的な通知などよりも、情報をまとめ、貯めておいてそれぞれにコメントし合うような機能がメインとなります。

    この流れていく情報と、貯めておく情報の両方を上手につかうことが、ネットを利用したグループでのコミュニケーションにとても良いと考えています。

    もし、いまチャットツールだけを利用されていて、“あるある“に困ってられるという方は一度Backlog(バックログ)を試されると良いかもしれません。きっとよりよいグループでのコミュニケーションができると思います。

    皆様のネットを使ったコミュニケーションがより良いものになりますように!

    Backlog(バックログ)についての様々な情報が連続で読めるアドベントカレンダー企画はまだまだ続きます。次回も楽しみです。

  • クライアントのサイト制作において、Snow Monkeyの利用する場合のポイント Snow Monkey アドベントカレンダー2021

    クライアントのサイト制作において、Snow Monkeyの利用する場合のポイントお届けします!

    本投稿は Snow Monkey Advent Calendar 2021 の1日目の記事です。

    1. インブラウザデザインで進める

    サイトの規模感によりますが、小規模のWebサイトで低予算の場合には、特にSnow Monkeyのメリットが受けやすいと考えています。

    Snow Monkeyであれば、まずはじめにある程度、投稿や固定ページを入れておき、カスタマイザーからヘッダーやフッター、全体のレイアウト、キーカラーなどを設定するだけで、仮の状態ではありますが、Webサイトが出来上がります。しかも、かなり素敵に出来上がります。

    こちらを元に、クライアントとお話しながら、画像やCSSを追加し、ブラウザ上でデザインを進めていくことが可能です。なにもないところから作るよりも、素早く形になるのでコンテンツなどに集中する時間を多くとることが出来ます。

    2. ブロックエディターの優位性を最大限利用する

    従来のエディター(現在はクラシックエディタープラグインにて利用可能)の場合は、HTMLを理解していない方が、レイアウトをつくることがなかなか難しく、それを解決するために予めカスタムフィールドに入力枠を準備し、それを駆使して、コンテンツを入力することが多かったです。

    ただ、昨今はブロックエディターが非常に強力で使いやすくなっており、それを利用するだけで、素敵なレイアウトが作れます。

    また、出来上がったコンテンツを複製すれば、簡単に同様のレイアウトが利用できます。さらに、ブロックパターンとして登録したり、再利用ブロックを活用することで、記事内のレイアウトの複製も簡単になりました。

    Snow Monkeyは、ブロックエディターに最適化されており、またSnow Monkey Blocks プラグインを利用することで、より多様なレイアウトを実現できます。Snow Monkeyを利用するなら、ブロックを利用することを中心に考えたほうが、クライアントにとっても使いやすいサイトになると考えます。

    3. カスタマイズはプラグインから実施する

    Snow Monkeyの殆どはフックを利用することでカスタマイズが可能です。テーマのカスタマイズには直接テーマを編集する方法、子テーマを利用する方法、プラグインからカスタマイズする方法と主に3つの方法があります。

    直接テーマを変更する方法は、もっとも手軽で簡単に感じられますが、テーマのアップデート時に消えてしまう可能性が高いので、おすすめできません。

    つづいて、子テーマでのカスタマイズです。こちらは一見良さそうですが、おおきなテンプレートをコピーした場合に、結局テーマのアップデートが続いていくと、どんどん乖離してしまう可能性が高く、そのメンテナンスが難しくなりやすいです。

    プラグインからフックでカスタマイズする方法では、フックでのカスタマイズの内容を細かく分けておくことで、テーマとの乖離を少なく、最小限の範囲に収めることができます。この方法は慣れが必要ですが、おすすめします。

    更に詳しくこのあたりの内容を検討したければ、以下の記事がおすすめです、Snow Mokey作者のキタジマさんの記事です。Snow Monkey のカスタマイズは子テーマよりプラグインがオススメ!プラグインの雛形をダウンロードできるようにしました

    4. オリジナルで作らないんですか?と聞かれたら

    クライアントは、サイトの閲覧者と管理者に双方とって使いやすく、また閲覧者と管理者の双方の目的を果たすサイトを希望されます。その中において、当然デザインも重要になります。

    「Snow Monkeyをもとに作ります。」とお伝えすると、「オリジナルで作らないんですか?」というようなご意見をいただくことがあります。

    そんな場合には、以下のようなメリットをお伝えします。

    • Snow Monkeyは基本的なWebサイトの要素を提供がメインなので、デザインのカスタマイズも、もちろん可能です。
    • WordPressは継続的なアップデートが必要です。特に昨今はブロックエディターの更新の速度が速く、テーマ側で追従していくことは簡単ではありません。そういった部分をSnow Monkeyでは継続的に対応し続けてくれる可能性が高いです。
    • プロトタイプを確認いただきながら、制作を進められるので、進捗が出しやすいです。

    もちろん、とても特徴的なレイアウトや、複雑なアニメーションが多用される場合には、オリジナルテーマを利用したほうが良い場合もあります。しかし一般的なレイアウトの中に収まるWebサイトであれば、Snow Monkeyなら特に制限を感じることなく、Webサイト制作ができると考えています。

    更に詳しくこのあたりの内容を検討したければ、以下の記事がおすすめです、Snow Mokey作者のキタジマさんの記事です。 WordPress を使った制作案件の今後。オリジナルでつくるか、無料/有料テーマを使うか

    5. 継続的なメンテナンスとサポート面での安心感を伝える

    Snow Monkeyのアップデート情報より、最も古い記事の投稿日は2017年10月です。その頃から今まで、ずーっと継続してWordPressのアップデートに追従しながら、メンテナンスが続いています。これは簡単なことでは無いですね。またフォーラムなどでは、活発な情報の交換がされています。これらはクライアントにつたえることで、安心感につながるはずです。

    ということで、5つのポイントをお伝えしました。これからもSnow Monkeyつかって、色んなサイトを作っていければと考えています。明日以降の Snow Monkey Advent Calendar 2021 も楽しみです。

  • オンラインイベントで司会をするときのポイントして考えていること

    コロナの影響もあり、オンラインでのイベントが多くなりました。私自身、オンラインベントに登壇させていただくこともあれば、司会を担当することもあります。先日のWordCamp Japan 2021においてナビゲーター(司会的な立ち位置)を担当させていただきました。そこで、そのときに何に気をつけていたのか、どう考えて対応していたのかなどを書いていきます。何かしらのお役に立ちましたら幸いです。

    司会の役割3つ

    1. 進行を滞りなくすすめる
    2. スピーカーの方に安心してスピーチしてもらえるようにする
    3. イベントが良いものになるように、できる限り協力する

    そのために、セッションの開始時、途中、終盤の3つに分けて実施することを書きます。そして、下記のセッションではご紹介している内容を実施出来ていると思います。合わせてご覧ください。

    1. セッションの開始時

    最初にやりたいことは以下の4つです

    1. 顔の映像が出ている
    2. スライドが画面に映っている
    3. 声が聞こえる
    4. 上記3つが問題なくうまくできていることをスピーカーに伝える

    最初に一言だけわたしが話すのですが、このタイミングで少しだけ、スピーカーの方に挨拶や質問をしています。

    映像を見れば顔と、スライドが出ていることは確認できますので、声が出ていることの確認のために、スピーカーさんが自然に声がだせるように振る舞っています。

    また、リモート登壇の場合、本人自身で1〜3がうまく行っているかどうか確認のしようが無いので、問題なく1〜3ができていることを伝えています。

    2. セッション中

    ここでは、以下を行います。

    1. オーディエンスの代わりにリアクションする
    2. なるべく盛り上げる

    リモート登壇の場合、視聴している人の顔を見ることができず、いま自分の話している内容がうまく伝わているのかわかりません。

    今回、StreamYardという配信サービスを利用しているのですが、この場合、わたしとスタッフの数人の顔だけは閲覧できます。

    そこで、

    • なるべく深く頷く
    • 笑う、突っ込む、盛り上がる

    など大きすぎるぐらいリアクションしています。
    やりすぎかもですが、きっと無いよりはいいであろうと思ってやってます。

    3. 終盤

    ここでは以下を行います。

    1. 時間の調整
    2. オーバしていたら、声だけでまとめてもらうように促す
    3. ショートして終わる場合には、質問や感想をピックアップして伝える
    4. oViceへの誘導を行う

    どうしてもセッションの時間はオーバしたり、短くなったりします。その時間に合わせて対応を変えます。

    オーバしている場合は、声だけで「のこり1分です。」や「そろそろまとめをお願いします。」などと伝えます。

    ショートしそうな場合は、予めこちらで質問を作っておきます。コメントからのピックアップや、セッション中にポイントになりそうな部分を質問としていくつか準備しておいて、それで話します。

    また、終了時にわたしが入るのが遅れると、どうしたらいいの??てきな空気になるので、なるべく良いタイミングで入るようにタイミングを見計らっています。

    今回はoViceで、セッションの内容について話して貰える仕組みがあったので、そちらを紹介して都度誘導を行っています。

    ということで、正直こんな準備はほぼ必要なく、スピーカーの方が皆さん素晴らしかったので、ほとんど何もしませんでしたが、司会のときに気をつけていることでした。

    その他、司会としては

    • じゃまにならない
    • 全体のテンションを楽しい方向に誘導する
    • 臨時の情報などを自然に挟む
    • コメントやTwitter、内部通知コメントなどを見る

    などをしています。

    じゃまにならない

    こちらについては、それぽい司会という感じでなるべく不自然にならないように、皆さんのイメージにある司会っぽさで振る舞うのと、最小限の発言に留めることを意識してます。

    全体のテンションを楽しい方向に誘導する

    これは、常に笑顔でいる。声色や、言葉遣いに面白楽しいよう要素をなるべく含むことを意識しています。
    電話に出るときに声のトーンが2つぐらい上がるわたしの母親を参考にしています。

    臨時の情報などを自然に挟む

    については、時間の変更や、URLの変更などがどうしても発生するので、そういうのをセッション終わりやセッション始まりにはさみます。今回は殆どなかったような気がします。

    コメントやTwitter、内部通知コメントなどを見る

    フィードバックは常に色々目を配ります。音が聞こえないとか、かくかくしているとか、ハウリングしてるとか。そういうのはすぐにコメントで教えていただけるケースが多いので、見ながら調整が必要であれば調整します。
    今回、こちらも殆どなかったように思います。

    良い反応が多い場合は、終盤にいち早くスピーカーさんに伝えたりします。
    みんなが嬉しくて、スピーカーさんもその反応を知れて嬉しいと、またみんなで嬉しくなれますよね。

    リハーサル時

    リハーサル時は、以下をスピーカーさんの以下を確認しています。

    • 音質のクリアさ
    • 映像のクリアさ
    • 背景の映り込み
    • 全体の流れ

    音質のクリアさ

    マイクのクオリティー、エアコンの音、PCのファンの音、マイクが衣服や髪の毛にこすれる音、キータイプの音、単純な雑音。などなど様々な理由で音がクリアに入らないケースがあるので、できる範囲でなるべく良くなるように、改善できそうなところはお願いします。

    • その時だけエアコンを切ってもらう
    • 髪の毛をまとめていただく
    • PCとはちがう外付けのマイクをつかっていただく

    映像のクリアさ

    逆光だったり、暗かったり、明るすぎたり、いろいろなので、可能な範囲で改善をお願いします。

    背景の映り込み

    版権のものが映ってたりすると面倒なので、片付けてもらったりをお願いします。

    と、色々かきましたが、そんなに多くのことを司会でできるわけではないので、なるべく安心して、セッションをしていただけるように心配りをできる限りでするという感じです。

    あまりこちらの理想が高かったりして、要望しすぎるとかえって、萎縮してしまったりで良くないので、なるべくできる限りで、お願いして、あとはもう当日、なんとかなる!的な気持ちであたっております。

    結局当日のバタバタしているところで、なんとなくやっているだけです。みなさんのおかげですね。

  • Zoom環境改善 Yeti – Blue (USB接続コンデンサーマイク)とSony ZV-1を利用してよい映像で雑音の無い状態で配信したい

    はい、どうも生放送をなるべく、よい映像で雑音の無い状態で配信したいと思いまして、いろいろ機材を揃えました。その結果をお伝えします。

    利用機材

    全体の構成

    ライトとグリーンバック

    グリーンバックは、ちょうど部屋の天井に柱の出っ張りがあったので、突っ張り棒とループ付きの洗濯ばさみで釣っています。

    グリーンバックは、突っ張り棒でカーテンみたいに止めました。

    ライトについては女優ライトと呼ばれる円型のが主流に感じますが。ライト検討時にそういうのがあることをいまいち認識しておらず、明るければいいんだろうという安易な発想で、LEDがたくさんついているのを利用しています。けっかとしてこちらは、明るさの段階調整ができることもあり気に入っています。 

    ディスプレイの奥に、カメラ、その奥に照明

    カメラ → スイッチャー → mac

    ZV-1にはUSBでWebカメラとして取り込めるソフトウェア『Imaging Edge Webcam』がリリースされています。これを使えば、問題なくUSBでパソコンに繋ぐだけでカメラと認識してくれるので、良いはずなのですが、2021-01-05時点で、Appleシリコン搭載Macには対応していないということで、ATEM miniに繋いでから、パソコンに繋いでいます。

    機材による見栄えの改善結果

    上が、macbookについてるカメラでzoomに参加したもの、下が機材を活用したあとのものです。比べてみると、

    • めがねに画面が写り込んでない
    • 顔がはっきり写ってる
    • バーチャル背景との区切りがしっかりくっきり

    などの違いがわかると思います。実際にはZoomが配信の際に圧縮してくれるので、Zoomミーティングに出ているそれぞれには、もっと低解像度で送られますが、パット見にも違いがわかるぐらいにはなります。めがねに映り込みが無いだけでも嬉しい感じです。

    マイク → mac → Audio Hijack → Loopback → krisp

    映像と音声がずれる

    マイクを繋ぐ先として、カメラと同様にスイッチャーにつなぐ場合と、macに直接繋ぐ場合があります。前者の場合、音と映像がずれることはそれほど気にしなくて良さそうです。しかもずれたとしても、スイッチャーに付属するソフトウェアで音声のタイミングを調整することが可能です。

    私の場合、マイクがUSBでつなぐタイプのものであったため、直接スイッチャーにつなぐことが出来ませんでした。マイクにヘッドホン端子があるので、そこからスイッチャーのマイク入力に繋いでも見たのですが。ノイズが乗ってしまったり、おそらく取り扱う出力インピーダンスが違うようで、マイクの性能が発揮できませんでした。

    なので、USBでmacと直接つないだのですが、そうすると直接つながるマイクの方が、スイッチャー経由の映像よりも早くmacに取り込まれ、結果として少しですが、口と音声が合わなくなりました。

    そこで利用したのが、Audio HijackとLoopbackというアプリケーションです。どちらもRogue Amoeba Software社からリリースされている音声を扱うためのアプリケーションです。

    音声を微妙に遅らせる

    Audio Hijack はマイクなどから取り込んだ音声を加工できるアプリです。エコーを掛けたり、コンプレッサーやイコライジング等など、様々な加工ができるのですが、今回はSync の Delayという、単純に音声を遅らせる機能のみを利用します。

    マイクから取り込んだ音声を90ミリ秒ほど遅らせたところ、いい感じな気がしています。そして、遅らせたあとの音声をLoopbackというアプリケーションに送ります。

    少し遅らせる

    遅らせた音声を入力として取り込む

    Loopbackは様々な音声入力を、とりまとめ、外部からの入力のように認識させるアプリです。ここで、Audio Hijiackから受けた音声をLoopback Audioという名前の音声入力にします。

    遅らせた音声を入力として再度扱う

    ノイズを除去する

    遅らせた後に、Krispを利用して、ノイズの除去を行っています。ノイズの除去はAudio Hijackでも可能なのですが、マニュアル設定な部分が多く、なかなか調整が難しかったので、専門のkirspに任せることにしました。

    私の環境だと、近くにMacbook Proがあるので、ファンの音がノイズとして沢山入っていました。また日中は家族の生活音も入ります。これについては回避のしようがないので、Krispで消してもらっています。

    音声については、以下の3つを聞いていただくのがわかりやすいかと思います。サーっと鳴っているファンの音などがだんだん少なくなります。それぞれは同日に、同じ場所で録音しています。

    mac内臓のマイク
    Earpodsのマイク
    Yeti Blue + Audio Hijack + Loopback + krisp

    こんなに必要なの?

    私もそう思います。。。

    大した見栄えでも、いい声でも無い私が、仕事柄、日々Zoomでお打ち合わせをしたり、教育系の動画作ったりしておりますので、多少でも見やすく、聞きやすくなるようにできればと思って、はじめたぐらいなのですが、随分と回り道をしたような気がしますし、現在ももっとシンプルに簡単にできないのかなー。。と感じています。

    これを見て、「ここがおかしい。」「もっとこうしたらいいのに。」といったアイディアがあればぜひ教えて下さいませ。Twitterとか、Facebookとかなんでもコメントいただけると嬉しいです。

    もっと手軽にできない?

    とりあえず音質の向上だけなら、EarPods を利用されるだけでも十分向上すると思います。

    カメラとマイクを直接USBでPCにつなげるタイプのものであれば、スイッチャーや音声を加工するアプリも不要かと思います。これだけぐらいなら簡単にシンプルにできそうな気がします。

    おまけ、たくさんの失敗コーナー

    • カメラがチラチラする
      • とりあえずUSBのカメラを買えばきっといいはずとおもって、ライト付きのUSBカメラを買いましたが、設定が良くないのか、ヘルツの設定がうまく行かないのか、ずーっとチラチラするし、色味も満足行くものでなく、タンスの肥やしになっています。。
    • ずーっとマイクで録画しては聴き比べる日々
      • 良いマイクを買ったから良いはず!!、あれ思うように行かない。。というかEarPodsのほうが音が綺麗。線をつないでも音が小さい、もしくはずーっと「ビーーー!!」的なノイズが入ってる。空気の音デカイ。エアコン止めると暑い寒い。などなど、もう挫折しっぱなしでした。なのに一般のyoutubeの生配信の人はみんなノイズが気になることなくて、もうきっと運命的にうまく行かないのだと、何回か諦めました。。
    • ATEM mini活用しきれてない。
      • ご覧の通り、カメラをUSBでmacに接続するためにした使っておらず、あと3chも空きがあるのですが、なにかに使える日が来るのだろうか。
    • Zoomだと画面共有した方がきれい
      • ATEM miniにはピクチャ・イン・ピクチャ機能(ワイプ的な機能)がありまして、独自に自分の画面と顔映像を組み合わせることが出来るのですが。これだとzoomで画面共有でない、通常のカメラ状態で画面が認識されるので、圧縮される結果、画面が高画質で配信されませんでした。なにかしらやり方があるのかもですが。。
    • マイクアームを買ってみるも、机で反響する
      • 口に近いところにマイクがあったほうが良いということでマイクアームを購入しましたが、取り付けるところが同じ机しかなく、タイピングなどで机に衝撃があると、もろにその音が、マイクアームを伝ってマイクに入ってしまい、使えませんでした。。
    • 正直いまもこれでいいのかよくわからない。
      • きっともっと素直に簡単にできる方法があるんじゃないかなと感じています。
      • もっと低予算でもいい感じにできるといいですよね。とおもいます。

    というわけで、以上です。何かしらお役に立てましたら幸いです。

  • Shifterの特徴を書いてみました。

    こちらは Shifter Advent Calendar 2020 の 記事になります!様々なShifter関連の記事が見られますので、ぜひリンクしてみてください。この記事では、どシンプルにShifterの特徴をご紹介します。

    Shifterの特徴

    ShifterWordPressという世界で最もシェアの高いオープンソースのブログツールを利用したサービスです。普通のWordPressと何が違うかと言うと、WordPressから静的なHTMLなどに生成して、ホスティングしてくれるという点です。

    難しい言葉が急に出てきましたね。専門用語は難しいです。静的? まずこの言葉のご紹介から行きましょう。

    静的と動的の違い

    ここでの静的は動的の反対語として使われています。英語では静的がStatic。動的がDynamicです。

    HTMLファイルによって表示されるWebサイトは静的と言われます。サーバーにHTMLのファイルを設置し、そのファイルまでのURLを入力するとブラウザから閲覧できるという仕組みですが、1URLにつき、基本的には1つのHTMLファイルがあり、それを表示するという仕組みです。100ページを作る場合は、100のHTMLファイルが必要ということになります。もともとWebサイトはこういうものでした。この、基本的に1対1でそこにある予め完成されたファイルがそのまま表示されるというのを静的といいます。

    WordPressは動的なブログツールです。ブラウザからURLでアクセスした時に、サーバー内でPHPのプログラムが動き、データベースと連携して情報を取り出し、ページをその場で生成して表示します。ですので予めURL毎にファイルがありません。

    動的なことのメリット

    この静的と動的の違いが肝です。動的の良さは、例えば共通パーツを利用できることです。ヘッダーのメニューを変更する時に、静的だと該当するすべてのページのファイルを編集する必要がありますが、動的な場合は、該当部分のプログラムを編集するだけで、全てのページに反映させることが可能です。

    また、動的であることを利用し、

    • 管理画面から記事を書いて表示
    • 記事を貯めながら、一覧ページを作成
    • TOPページに最新の記事を表示
    • ランキングを表示
    • 会員機能をもたせて、会員と非会員で表示する内容を変更
    • サイト内を検索

    等などたくさんのことができます。この自由度が動的なメリットです。

    じゃあ動的でいいじゃん。

    そうなんです、そうなんです。ただこの動的なことにもデメリットがあります。

    プログラムを利用して動的に都度ページを生成するため、サーバー内で動くプログラムをメンテナンスし続ける必要があります。管理画面があるということは、ログイン画面があるということであり、ログインできるとサイト内に様々な作業を行えるということです。パスワードが漏れたら、悪意を持った人にハッキングされたら。こういった驚異につねに対策を続ける必要があります。

    また、昨今はサーバーがとても早くなったので、気にならないかもしれませんが、なるべくサイトの表示を高速化できたほうが使いやすいと考えた場合に、都度ページを生成しているのは、もともと生成されている静的な状態よりも時間がかかると言えます。

    じゃあ静的のほうがいいか。

    そうおもいました?でも、通常のHTMLには便利な管理画面もありませんし、記事を一覧にしてくれる機能もありません。動的に表示ができないので、ページ数が多くなると一括編集も大変そうです。そもそもHTML覚えるのも、低いハードルではありません。

    じゃあどうしたらいいのよ?

    その一つの解決方法を提供してくれるのがShifterです。Shifterを利用するとWordPressが立ち上がった状態で提供されます。そしてその中で動的にサイトを作ることができます。サイトができたら、Shifterでデプロイというボタンをポチッとおします。すると、動的に作られるShifter内にあるWordPressのページすべてを静的なHTMLファイルに自動で生成してくれるんです。

    しかも、生成してくれたファイル群をホスティングしてくれるので、即座に公開できます。また、サイト制作に利用していたWordPressはShifterで使っているときだけ動き、それ以外はシャットダウンされた状態になるので、常にWordPressを利用している状態よりもセキュリティー面での安心が増します。表示も早くなりますね。

    というのが、Shifterの特徴です。動的と静的のメリットを両方一挙にとった状態ですね。

    全く伝わるかはわかりませんが、黒魔道士と、白魔道士のあいだの赤魔道士ということです。

    FF的な説明。

    流行りのブログサービスを使えばよくない?

    そうですね。それもあると思います。でもWordPressのメリットは静的か動的かということにとどまりません。他のサービスと異なる、WordPressのサービスのメリットは自分の資産であるというところです。

    外部のサービスの場合、もしサービスが終了したら、その時までに書き溜めた記事群は一緒に消えてしまうかもしれません。WordPressを利用しているShifterはいつでもまるごとのバックアップを取得することができます。コレが自分の資産であるメリットですね。

    比較的デザインが自由というところもメリットでしょう。見栄えを司るテーマを本当に多くの中から選ぶことができますし、自作することもできます。

    無敵なの?

    いえいえ、光があれば影があるように。無敵なものは少ないです。最終的に静的になるので、サイト内検索や、フォーム、会員機能といった、生成されたページに対してあとから、閲覧者が操作するものについては動的に処理することができません。そのために、静的に生成されたページ群に対し別のサービスを組み合わせて、動的な機能を追加する必要があります。

    このあたりを利用するとなると、またそれらを利用する知識が必要になりますね。

    Shiterの特徴まとめ

    • WordPressの動的なメリットを受けられる
    • 静的なファイルのメリットを受けられる
    • 閲覧者が利用する機能としての動的な処理を追加するのには工夫が必要
    • 自分の資産
    • デザインなどの自由

    なんとなくShiterの特徴がわかっていただけたら幸いです。セキュリティーを重視する会社のWebサイトや、広報用のブログサイトなどにはたいへん向いていると考えています。

    では!

  • Snow Monkey テーマのすごいと感じるところ

    この記事は Snow Monkey アドベントカレンダー2020 の記事になります。

    アドベントカレンダーに何を書けば、そのプロダクトの良さが伝わるのか?すごく悩ましい問題ですね。いろいろ考えても、それほど文章力があるわけでもありません。ということで、私が感じているSnow Monkey テーマ(以下 Snow Monkey)のすごいと感じるところ10個ぐらい!をご紹介します!

    Snow Monkeyとは?

    Snow Monkeyをしらない方に念の為。Snow Monkeyは日本人の作者がつくるWordPressの有料テーマです。
    https://snow-monkey.2inc.org/

    ブロックエディター対応

    WordPressは5.0からブロックエディターが採用されました。ブロックエディター利用されていますか?もし「当時触ってみたけど、イマイチでClassicエディタープラグインを利用して、旧エディターを利用し続けている。」そんな方は、ぜひ一度Snow Monkeyと一緒にブロックエディターを試してみてください。

    ブロックエディターはコレまでのClassicエディター環境から考えると、比較にならないくらい柔軟に、直感的にコンテンツをレイアウト、デザイン、執筆ができるようになっています。

    そしてSnow Monkeyはブロックエディターの良さを最大限に活かしたテーマと言えます。是非体験いただきたいと思います。きっと楽しくて嬉しくなります。

    デザインが素敵

    Snow Monkeyはシンプルで素敵なデザインがもともと、適用されています。それだけでも十分魅力的なデザインとなっています。以前に開発者であるキタジマさんと話をした際に、彼は「デザインについてはカスタマイズ前提で、薄くしてある。」といっていましたが、いやいや、そのデザインがイケてる!と私は感じています。

    カスタマイズしやすい

    WordPressのカスタマイズには、様々な手法があります。最もシンプル手法は、テーマやプラグインを利用し、それらが提供する設定を利用する方法です。

    Snow Monkeyではヘッダーやフッターのレイアウト、記事の一覧表示のデザイン、フォント、アクセントカラー、メニュー、ウィジェット、SEO、等など書ききれないぐらいのカスタマイズが初期状態から提供されます。これは便利ですね。

    それだけでも十分素敵なのですが。Snow Monkeyはそれだけではありません、テーマ内の至るところに設定されているフックと呼ばれる部分を利用することで、要素や機能などを追加したり、上書きしたりすることが可能です。

    フックを利用したカスタマイズは、直接テーマに編集を加えずにプラグインから実施できます。ここが大きなポイントです。フックが無いテーマの場合をカスタマイズしたい場合に、直接テーマファイルを書き換えたとしましょう。その場ではうまくカスタマイズができました。

    しかし。その後テーマをアップデートすると、コレまで頑張ったカスタマイズが綺麗サッパリ上書きされて消えてしまうのです。これはよくないですね。

    ということで、予め提供されている機能としてのカスタマイズと、フックを利用したカスタマイズの両方に対応しているのがSnow Monkeyの素敵なところです。

    ※子テーマがあるじゃん!という詳しいあなたはコチラを合わせてご覧ください
    https://snow-monkey.2inc.org/2019/02/04/my-snow-monkey-plugin/

    コアのアップデートに対応

    アップデートという話がでましたので、WordPressのアップデートにしっかりと追従しているというのもSnow Monkeyの素晴らしいところです。たとえば2020-12-09現在は次期のWordPressバージョンであるWordPress 5.6 RC 5がリリース前のテストバージョンとして発表されています。

    これは、開発者向けに次期バージョンで不具合が出ないように、各々テストしてね。バグが有ったら、報告してね。という目的で毎バージョン事前に発表されています。

    Snow Monkeyはそれに対して “Snow Monkey v12 リリース候補1” という記事の中で、それぞれの対応内容が発表されています。これはとてもありがたいこと感じています。これらはとても手間なことなわけですが、こんなにしっかりとバージョン毎の対応のレポートが出ているテーマは少ないと思います。

    周辺プラグインも充実

    Snow Mokeyを利用するなら、以下の3つを合わせて利用すると、さらに柔軟なカスタマイズが実現します。

    • Snow Monkey Block
      Snow Mokey Themeに最適化されたブロックを複数提供。
      セクションブロックや、項目ブロック、FAQブロック、吹き出しブロック、ステップブロックなどなど、「コレ便利ーー!」とうなるブロックがたくさんあります。
    • Snow Monkey Editor
      SP版とPC版で表示と非表示を切り替える。表示にアニメーションを入れる。権限毎に公開設定を行なう。段落の背景に色を付ける。などなど、「気が利いてるー!」とうなる機能がブロックに追加されます。
    • Snow Monkey Form
      ブロックエディターに対応したメールフォームがマウス操作だけで作れます。フィールドの種類が選べるのはもちろん、バリデーションの設定、自動返信メール、メール確認画面などなど、基本的な機能はもれなく揃っているでしょう。「ありがてー!」とうなってしまいます。

    しかもこの3つのプラグインは無料で利用できます!なんということでしょう。
    ※ Snow Monkey Themeは有料です。

    フォーラムが充実

    有料と無料と言うお話がでたので、Snow Monkeyの有料で受けられるメリットを紹介します。Snow Monkeyは1年毎のサブスクリプションモデルです。この契約を行なうと、フォーラムに投稿できる権限がもらえます。閲覧自体は無料です。

    Snow Monkey フォーラム
    2020/12/09現在 1,495のトピックがあり、6,680の返信があります。すごい量!!!これだけあれば、ちょっとしらべるだけで、大抵の小さな困り事やカスタマイズの疑問は解決できそうです。

    その多くは作者のキタジマさんのコメントなのですが、利用者同士が、回答し合うということもできます。これはWordPressのフォーラムでも行われている、オープンソースらしい、Snow Monkeyへの貢献の気持ちによるボランティア活動です。

    そして、このフォーラムに関わる質問者も、回答者もお互いに尊重しながら、利用がされているというところも好きなポイントです。ハートがつけられるのも地味に良いところだと感じています。私は3いいねでした。キタジマさんは417いいねだったので、ちょっとでも追いつけるといいなとおもってます。

    コミュニティーが素敵

    ユーザーコミュニティーとしてのSlackをが活用されています。ここもフォーラム同様にお互いに尊重しながら、Snow Monkeyが好きで、これからも一緒に盛り上がろう!といった心持ちを感じています。

    コミュニティーというのは、ボランティア活動的な部分も多く、なかなか一つにまとまったり、同じ方向を向くのは難しい面もあると感じているのですが、そういったところが自然とうまくでいているのがとても心地よく感じますし、これからもこういう雰囲気で続いていくと素敵だなーと感じています。

    開発者が素敵

    ということで、これらのことを企てたのが、開発者のキタジマさんなのですが、すごいですね。かっこいい。いつもそう思います。ちょっと昔話で、彼とはじめて対面で出会ったのは
    問い合わせフォームを考える市民フォーラムふくおか(仮) でした。

    これは、2013年の話です。当時WordPressの問い合わせフォームプラグインを作っていた日本の作者3名が一同に介し、問い合わせフォームの話をするという会です。このイベント自身がとても楽しかったのを記憶していますが。その中でキタジマさんは、おそらくSnow Monkey Formの実装の発想の元になったであろう、MW WP Formの話をされてました。そこで印象的だったのがこのスライドです。
    https://www.slideshare.net/inc2734/mw-wp-formss

    キタジマさん的には、このMW WP Formプラグインで”革命が起きるかも!”と考えて機能を拡張するのですが、なんどやっても革命がおきない。という話をされていました。

    キタジマさん自身の雰囲気は当時も今も変わらず優しい物腰なのですが。この発言で見た目とは裏腹に、ギャップのある野望性や、ユニークさ、そして技術力の高さに度肝をぬかれたことを思い出します。
    それで当時インタビューしたことを思い出しました。よかったらコレも読んでみて下さい。

    そしてSnow Mokeyはいま少なくとも日本のWordPress業界において革命を起こしだしているんじゃないかなと感じています。というわけで、Snow Monkeyとキタジマさんのファンである私が思う、Snow Monkey テーマのすごいと感じるところでした。

    これからも使っていきますー。みなさんもつかってみてくださいませ。

  • Backlogにヌーラボアカウントの生体認証でログインする

    こんばんわ!この記事は #Backlogアドベントカレンダー 2020 by #JBUG の12月4日分の記事として執筆しています。Backlogにログインする時に使うヌーラボアカウントによる、複数のスペースへのログインが便利だなーと思っています。ということでそのお話しです。

    ただ、2段階認証ちょっと難しい

    便利なのですが、なるべくセキュリティーも高めたいと思いますよね。それで私は2段階認証にしています。スマートフォンなど専用アプリに30秒ごとぐらいに変わりながら表示される数字をちゃちゃ!っと入力するタイプですね。

    慣れれば、それほど間違うことはないのですが、せっかちな私は、ギリギリのタイミングで数字を入力して、若干手間取って遅れてしまい、入力する頃にはもう数字が変わっている。。みたいなことあります。

    ちょっとむずかしいですね。

    ヌーラボアカウントには生体認証がある!!

    そうなんです。”さよならパスワード!WebAuthnに対応したBacklog / Cacoo / Typetalkで指紋を使って安全ログイン” ということでヌーラボアカウントには生体認証があるんですね。これ去年のニュースです!!知ってたんでけど、なかなか設定する気にならなかったと言うか、まあ2段階認証でもいいかあ。みたいな気になってたんですけど。今回ブログを書くに当たり、ちょっと試してみたところ、登録はすごく簡単でした。なんで今までしてなかったのか。。。

    生体認証を登録すると、例えばタッチIDのあるmacなら、メールアドレスと指紋認証でログインできます。iPhoneも同様ですね。私のiPhoneは顔認証なので、そちらにも対応されてました。

    いままで、2段階認証で、ギリギリのタイムアタックで赤くなる字を見ながら、「まだいける。赤くなってからでも多少は余裕ある。」とか思って入力して負ける。みたいなことからはさっぱりお別れです。

    登録方法と実際のログイン

    登録方法について詳しくはコチラをご覧ください “生体認証の設定 | Nulab

    ざっとやってみたキャプチャはこんな感じです。

    1. セキュリティーのタブから、セキュリティデバイスの登録のページに進み、セキュリティデバイスを登録をクリック

    2. 本人確認を行なうオプションを選択。私は内蔵センサーを選びました。

    3. 指紋センサーを触って登録

    4. 任意のデバイス名称を入力して完了です。かんたん!!

    5. 実際のログインには、まずメールアドレスを入力して、次へをクリック

    6. 指紋センサーをさわって、ログイン完了!password入力いらずです。

    というわけで、とても簡単でしたし、便利でした。ほんといままでなんでやってなかったんだろうという感じです。そういうことってありますよね。同様にスマホでもできました。流れも同じです。利用する端末によってセンサーの内容が自動的に選ばれるようですね。

    コレで顔パスです。というわけで、コチラからは以上です。(一応Backlog関連の話ということでご了承下さい!)あすはNulab Conference 2020 ということで、YouTubeで参加できるようです。たのしみ。

    今後ともBacklogをつかっていきますー!

  • WordPress+Gridsome+Netlifyを組み合わせたJAMStackにて静的に出力することを試みした。

    こんにちわ、こんばんば。今日は昨今流行と言われているJAMStackに挑戦してみました。とりあえずやってみた!というところですので、間違いとかあればご指摘くださいませ。引続きがんばります。

    成果物とその仕組について

    当ブログをもとに、静的に出力したものがこちらです。https://gridsome.demodemo.link/

    Githubのリポジトリはこちら
    https://github.com/megane9988/gridsome-megane-blog

    もともとあった、このWordPressのブログの情報をAPIとして利用します。静的出力までの流れは、NetlifyがGithubのリポジトリにおいてあるGridsomeのフレームワークを利用して、WordPressの情報を元に 静的なファイルを生成してホスティングしてくれています。

    • WordPressのRest-API
      • WordPressのコンテンツをJSON形式で出力します。WordPressに組み込まれている標準機能の一つです。
      • こちらが提供されるのでいわいるHeadless CMSみたいな使いかたができます。
    • Netlify
      • 静的なファイルをホスティングしてくれるサービス
      • Githubなどのリポジトリと連動し、Javascript等を利用したコマンドも実行できる。
    • Gridsome
      • Vue.jsでつくられたスタティックサイトジェネレーター(静的にファイルを生成してくれるもの)

    このための追加したプラグイン

    APIとしてデフォルトでは足りない部分を補ってくれます。Jetpackでは関連記事とアイキャッチ画像を。REST API – Head Tagsでは`<head>`内で利用するmetaタグ関連をそれぞれ追加。

    いいと感じたところ

    • とりあえず速い、それだけでありがたいことですね。
    モバイル
    PC
    • そもそも静的なのでセキュア
      • いまはこの執筆用のWordPressが見えていますので、セキュアさは何も変わってないですが、静的な方をメインに据えるスタイルにして、執筆用のWordPressを一般にはアクセスできないようなところにしておくと、より良さそうです。
    • WordPressの管理画面が普段どおり使える
      • 執筆方法について特別何も覚えなくてよいのはありがたいですね。
      • ブロックエディター使いやすいです。
    • Gridsomeにある程度出来上がってる雛形があるので、サクッと出来る
    • なんとなく今風
    • npmのライブラリを利用しやすい
      • ひとまずブックマーク用にアイコンを入れてみましたが、こういうふうに使えるのいいですね。
      • 他にも色々使ってみたいです。

    試されるJS力

    • Gridsomeの場合はVue.jsを利用するため、その知識が必要。
    • ほぼほぼ素人のため、つまづきながらポチポチ進めました。
    • このあたりは引続き学習します。
    テンプレートをJSで書く機会が訪れた!

    とりあえず利用してみて

    私のブログのように、それほどアクセスがなくて、そんなに仕組み的に難しいこともしてないようなサイトなら、積極的に使っていくことが可能だなと感じました。今後、さらにいろいろ使いたい機能を足していきながら、出来ることと出来にくいことを調べていきたいです。