amareloのブログ（仮）

IT系勉強会で感じた想いや知見をメインに書いていきます。

Webエンジニア勉強会inVR 第3回　参加レポート

6/21（日）、Webエンジニア勉強会inVR 第3回に参加しましたので、レポートを書きます。 前回は 「リモートワーク」「外出自粛中の過ごし方」、今回は「生産性アップの推しツール」ということで、 在宅勤務が続く今聞きたい話題が続いたため、今回もとても楽しく参加することができました。

目次

イベントページ

study-in-virtual.connpass.com

LT内容

身近なツールを正しく使う　ういろうさん
資料

www.nyamucoro.com

概要
  • ツールを選ぶのは自分の内情（業務の頻度や時間）や予算で変わる
    • いろんな視点が大事

  • 業務で一番多い時間はコミュニケーション

    • 図があるとないでは伝わり方が違う
    • 口だけで伝わるものは少ない
    • 大切なことは声だけでは伝わらない
      • メモを用意できる場合は用意しよう
        • 対面の場合はホワイトボードノート
        • 間接の場合はSlack
    • まとめを箇条書きにして渡す
      • 事前にアジェンダなどを準備していないならば、チャットに今話していることを書いて流す

  • Marp

    • マークダウンでスライド作成が可能
      • Visual Studio Code のアドオンでもWebからのインストールからでも利用可能
時間を意識する推しツールたち　kulunaさん
資料

speakerdeck.com

概要

  • リモートワークが増えて

    • 通勤時間がなくなった
    • 会話は減った
    • 家での誘惑が多いので気が散る
    • 生産性を意識するようになった

  • 時間、めっちゃ大事！

    • 通勤時間を別のことに使えたり、昼寝に使えたり・・・

  • 時間を意識して生産性を高めるための推しツール 1.Focus To-Do 2.頭痛～る 3.Meeting is Money

  • Focus To-Do

    • iOS、Android、PCアプリ
    • ポモドーロタイマー
      • 25分集中して5分休むを繰り返す。
      • どれだけ集中できていたか後で振り返れる
      • 5分は絶対休む。この5分の休憩の大事さに気付いてほしい
        • 意外と疲れていることがわかる
        • おすすめは数歩歩く
        • 5分間は誘惑に負けてもイイなど自分のルールを作る

  • 頭痛～る

    • iOS、Android、PCアプリ
    • 気圧の変化によって頭痛を感じる人のためのアプリ
      • 頭痛が起きるかもしれない時刻を予測する
      • 頭を使うタスクや重要タスクを事前に終わらせるよう調整できる
        • 計画的に頭痛を迎えよう！

  • Meeting is Money

    • 会議に使った時間を算出
      • 時給換算してくれるので、時間の大切さがわかる

meeting-is-money.web.app

Slackを中心に世界はまわっている　jiyuujinさん
資料

webneko.dev

概要

  • 情報の仕入れで日々やっていること

    • Twitterからの情報収集は雑多になるから使っていない
    • はてなエントリーやnoteのRSSを利用する
    • Nuxt.jsで作って使っている管理画面上でチェックしている
      • 自主的に入力できるようにした
      • だんだんめんどくさくなってきて、GAS（Google Apps Script）を使った自動入力できるようにした
      • ダークモードにも対応した

  • IFTTTを使ってはてなエントリーのRSS情報を取得してSlackに通知

    • SlackからリアクションとったメッセージをSpreadsheetに取り込む
      • getPostというメソッドで受けたリアクションを取得する
      • /api/conversations.history（SlackのWebhook）をたたく
      • 年月に合わせてシート名を変更して管理している
      • 取得情報をフロントに合わせて成形している
      • Firestoreにもブログの情報を保管している

  • なぜNuxt.js？

    • Vue.jsが好き
    • サクっとPWAを作れて、すでに「規約」が存在
    • j-stylebookというプラグインを自作しており、そことの連携性を考えて使っている

  • 今後やりたいこと

    • みんなに読んでほしいけど、Firabase Authを使っているので障壁になっている
      • 見れるようにしたい
ノン・デザイナーズデザインツール　おとべさん
資料

speakerdeck.com

概要

  • UIデザインツールFigma

    • アプリとかWebのデザインツール
    • アプリとかWebのプロトタイピング
    • デザイナーさんご用達ツール
    • 使いようによっては最強便利ツールに化ける！
    • ショートカット6個くらい使えれば簡単に使える
    • 基本無料で使える（課金プランもあるみたい）

  • 画像加工・編集

    • 画像に文字、線、図形、フィルタをめっちゃ簡単につけられる
    • 書き出しも超めっちゃ簡単

  • インフラ構成図の作成

    • 設計図や記事の挿絵に使うUIキットやテンプレートがある
    • AWSダイアグラムテンプレート（公式）もある
    • コピペして並べるだけなので簡単

  • SVGの調整

    • SVGとして書き出したい部分を選んでアウトライン化

-登壇資料の作成 - Figmaはプロトタイピングツール - 任意の順にページを再生できるので、スライドとして使える - Frameをならべて再生するだけ - 自由度が高いデザイン - ひな形を作ればスライドづくりは楽 - 雑に図で説明できる - 最低限が保証されないデザイン - アニメーションは難しい

全体の感想

今回は実践してみたいと思えるツールがたくさんあり、発見の多い勉強会でした。 早速、「Focus To-Do」と「Marp」を入れてみました！ 渓流や海岸の音などを流すこともでき、夏を感じながら作業できるのはいいですね！ このブログを書くのにFocus To-Doを使いましたが、25分は長いようであっという間でした。 仕事にも取り入れていこうと思います。

MarpはVSCodeのアドオンを入れてみました。Software Design 2019年11月号にMarpの記事載ってましたね。 買って読んでいたのになぜ実践しなかったのか… これからは書籍に書いてあることで気になることはとにかく何でもやってみようと思いました。 使い込むのはこれからですが、次に登壇するときはMarpでスライドを作ってみたいです！

前回に引き続き気づきを得られた勉強会で有意義な時間を過ごせました。

最後に

前回も書きましたが、自分も何か誰かに気付きのきっかけを見つけてもらえるような登壇をしたくなりました。 今年は技術ネタで登壇すると決めていてまだできてない・・・

もうすぐ今年が半分終わってしまうし、何か考えねば！（汗）