OBSの通話チャットの表示をCSSで変更する

趣味ゲーム

手順
表示例
追記

OBSでdiscordのボイスチャットを表示する時、フォントを変えたりしたいのでCSSを使って表示を変更してみます。

手順

1. discordボイスチャットのURLを取得する

上記サイトにてInstall for OBS > Voice Widget 以下のURLをコピーする。

f:id:misos:20210107223846p:plain — この画面のしたのURLをコピー

2. OBSのブラウザソースを追加

f:id:misos:20210107223919p:plain

3. ブラウザにて先ほど発行したURLを指定＋適用するCSSをカスタムCSSから指定する

f:id:misos:20210107224031p:plain — 上の赤枠部分に先ほどコピーしたURL、下にCSSを記述する

CSS記述例、通話している人だけアイコンの大きさを1.3倍にします。

span {
    font-family:'puikko-Regular' !important;
}

img {
    transition: 0.2s;
    -webkit-transition: 0.2s;
    transition-timing-function: ease;
}

img.speaking {
    transition: 0.3s;
    -webkit-transition: 0.3s;
    transition-timing-function: ease;
    transform: scale(1.3);
}

表示例

通話している人だけ少しアイコンが大きくなるように地味修正。 pic.twitter.com/T2UL18Ztz6
— nanja (@nanjakorewa) 2021年1月7日

追記

CSSのアニメーションでコマ送りだったり簡単なアバター表示とかできるじゃん、と思って調べてみたらすでに多くのかたが取り組まれてました。参考：

2021-01-01

2021

雑談書きかけ

2021年 - Wikipedia

新年あけましておめでとうございます。いろんなブログを購読しておくと様々な職や趣味の人の今年の抱負が見れて新鮮な感じがする。それらに倣って自分も『2021年にしたいこと』を文字に起こしてみる。

エンジニア・技術関係

バックエンド側のプログラミング・実装の勉強
自然言語処理関係を一から勉強する
強化学習を使ったアプリを作る
論文をもっと読み専門知識を深める
技術書店などに一つ本を書いてみる
Blender/Zbrushを使う＋3Dプリンタで何か作ってみる

とかでしょうか。あと電子工作がしたい気がしないでもない...（できるのか？）。また、『【まつもとゆきひろ】20代のためのプログラマー勉強方法を聞いてきた。 - Qiita』とかを読みつつ、作ったものは公開できたらいいなと思います。

エンジニア・技術関係以外

したいことは無限にあるんですが、”2021年に”したいこと...って絞ると決めるのが難しい。

英語（話す・書く）
小説（読む・書く？）
DTM、道具揃えて何かする
デザイン関係の技術に触れる
演劇みる
ゲーム

2020年が直ぐに終わってしまったように今年もきっとあっという間だと思う、戒驕戒躁に、無理しない範囲でいろいろしたいです。おわり。

2020-12-27

休みが終わる前に積読を整理する

雑談買った本リスト漫画

積読、積ん読（つんどく）とは入手した書籍を読むことなく自宅で積んだままにしている状態を意味する用語である[1][2][3]。引用元：積読 - Wikipedia

読まずに放置している本がたまりつつあるので整理したいです。以下読みかけで止まっている書籍など。

技術書関係

Atomic Design by Brad Frost
しっかり学ぶ数理最適化
モノリスからマイクロサービスへ――モノリスを進化させる実践移行ガイド
異常検知と変化検知
AWS認定ソリューションアーキテクト関係の本（『AWS 認定試験に備える』に関するもの）
React/Next.js関係の本

技術書は必要になってから読み始めては遅いような気もするし、かといって何に使うかわからない状態で勉強しようにもモチベが出ない、といった感じで難しい。そして自分の理解度が浅い箇所にぶつかると、場合によっては何日も進まなかったりしてしまいます。だから、大学の授業は真面目に受ける必要があったんですね(メガトン構文)。

小説・漫画

涼宮ハルヒの驚愕（出版された当時に一度読んだけどまた買った）
魔法少女りすか4
数学ガールの秘密ノート数冊
『スクウェア・エニックスの社長にYouTuberデビューさせられましたダラドル・ヤマダのだらだらYouTuber暮らし』いずみせら美少女タップアクションRPG「プロジェクト東京ドールズ」 | ツイ４ | 最前線

↓上のページの著者のツイッター

ペニー・パーカーちゃん　#SpiderVerse pic.twitter.com/PrDenb4dbQ
— いずみせら (@izumi_sera) 2019年4月3日

↓ペニー・パーカー

最近漫画も小説も読まなさ過ぎなので探すところからはじめないと...。

余談

整理しているときに見つけた、ISBNから引用情報を出力するサイト。ただbibtexファイルはGoogleブックスからもダウンロードできるので用途は限定されるかもしれません。

2020-12-21

CSSだけで作成するいい感じの背景のサンプル

css リンク集

この記事は何
サイト

この記事は何

CSSだけで作成できるお洒落なウェブページ背景について、興味半分で調べたもののリンクを貼るのみの記事。面白そうですが直近で使ったりする機会はない気がします。

サイト

固定のチェックがらなどのパターン

上記ページはCSSで表現する背景パターン51種＋【コピペで簡単！/アニメーション有】 | WebDesignFactsと同じ内容です、どちらが出典元かは不明。

粒子が動いている感じ？のパターン

動く系

2020-12-19

2020年ふりかえり

雑談

毎年の終わりに一年のまとめを書いてたような気がしたけど、見てみたら2019年も2018年も記事を非公開にしていた。なんかチェックリストで「あれができた・これができなかった」みたいなことを硬い文章で書いていて恥ずかしくなったっぽい。

今年について、色々変化の大きい年だったね〜みたいな月並みな感想はさておき

変化がある中でもいろんな人に助けられた一年だった。あと、これまで一度もやったことがないものに興味を持ったり始めたりすることができた。来年はもっと色々と習得したり上手くなったりして、誰かに教えられるようになりたい。

あと、大学の頃は平気で徹夜して作業するみたいなことをやってたのに、今年急に出来なくなった。体力がないという訳では無く、なんだか眠くなってしまう。だからと言って『大学の頃にサークルとかゲームして過ごした時間でもっと色々やっておけばよかった』...と後悔している訳でもないです、それはそれで価値のある時間だったと思う。

なんだかんだ自分のやりたいことができた年だった、周りのおかげですね。来年は勉強とプライベートをさらに良くする方向に頑張りたい。