ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Webの記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2020/09/26

Flexbox Defense - タワーディフェンスゲームを通じてFlexboxの使い方を学ぶ

ゲームを通じて技術を学ぶのは興味深い手法です。体験する人も楽しみながらプログラミングが学べます。書籍やオンライン情報を元に自分だけで学んでいくのは困難ですが、ゲームで対話を楽しみながらできれば継続できそうです。今回紹介するFlexbox DefenseはCSS3のFlexboxをタワーディフェンスゲームをベースに学ぶソ...

List

  • 2020/09/26

TimeCat Chrome - ごく小さなファイルサイズでブラウザ操作を記録

ブラウザの操作を記録したいと思ったことはないでしょうか。動画で録画したり、アニメーションGIFとして保存するソフトウェアもあります。確かに便利ですが、ソフトウェアを立ち上げるのが面倒です。もっと手軽にさくっとできると便利です。そこで使ってみたいのがTimeCat Chromeです。Google Chrome上で、まるで...

List

  • 2020/09/24

ランダムにグループ分け - なるべく重複しないグループ分けを提案

適当にグループ分けするというのが、どれだけ難しいか。マンパワーでやるのは無駄に時間がかかりますし、ランダムでのグループ分けをするとムラが出やすいです。なぜならランダムの場合、前回の結果を考慮せずに行われるからです。今回紹介するランダムにグループ分けは、そうしたグループ分けを繰り返す際に使えるソフトウェアです。なるべく重...

List

  • 2020/09/24

danfo.js - データを素早く手軽にビジュアル化

データのビジュアライズはとても大きな問題です。ツールによって使い勝手がばらばらで、簡単に使えるものもあれば、とても複雑なものもあります。データ量によって選択肢が変わり、最適な表示方法も異なります。今回紹介するdanfo.jsは、とても簡単に使えるデータビジュアライズソフトウェアです。## danfo.jsの使い方dan...

List

  • 2020/09/23

imgproxy - 高速で手軽な変換機能付き画像プロキシサーバ

画像は扱いが難しいメディアです。オンラインでよく使われていますが、同じ写真でも表示する場面によって大きさを変更したいことがあります。常にきれいで、画素の高い画像を使っているとネットワークを圧迫してしまうので、必要に応じたサイズへの変更が必要になります。これがとても面倒です。そこで使ってみたいのがimgproxyです。画...

List

  • 2020/09/23

Speech to Text Webcam Overlay - Webカメラの映像に音声認識した字幕を表示

コロナ禍にあって、さまざまな変化が生じています。ネガティブな変化も多いですが、そうした中だからこそ生まれる新しいしくみもあります。多くのイベントがオンライン開催になる中、聴覚障害がある方に字幕を見せるような試みも行われています。今回紹介するSpeech to Text Webcam Overlayはブラウザ上に移ったW...

None

  • 2020/09/22

webify - コマンドの入出力をWebで行う

CUIとWebの間には大きな壁があります。たとえばWebアプリケーションを使えば、サーバサイドのコマンドを使うこともできるでしょう。しかし、そのために実行環境を作ったり、Webアプリケーションを立てるのはとても面倒です。そこで使ってみたいのがwebifyです。ちょっとしたコマンドをブラウザから実行できます。## web...

List

  • 2020/09/22

Fuzbal - ページ内でファジーな検索を可能にするGoogle Chrome機能拡張

ブラウザのページ内検索で、微妙に文字が違っていて結果に出てこない思いをしたことはないでしょうか。GoogleのWeb検索などでは大文字小文字はもちろん、異なる単語でも意味をくみ取ってくれたりします。そうした柔軟性がローカルの検索でも欲しいと思わないでしょうか。今回紹介するFuzbalはあやふやな検索も可能なページ内検索...

List

  • 2020/09/20

Snapcode - Webベースのスニペット管理

プログラミングをしていると、繰り返し使いたくなる便利な関数ができたりします。そうした関数は同じプロジェクトではなく、異なるプロジェクトでも使いたくなるでしょう。今回はそうしたちょっとしたコードを管理する、Webベースのスニペット管理であるSnapcodeを紹介します。## Snapcodeの使い方メイン画面です。タグと...

List

  • 2020/09/19

Piccolo - ローカルやWebで遊べるオセロゲーム

ちょっと時間が空いた時、ちょっと休憩したいと思わないでしょうか。頭をしっかり使った分、リラックスさせたくなります。寝たりするのもいいですが、ちょっと頭の使い方を変えるだけでリフレッシュできたりします。今回紹介するPiccoloはGUIまたはWebで遊べるオセロゲームです。## Piccoloの使い方こちらはWeb版です...

List

  • 2020/09/19

handwritten.js - テキストを瞬時に手書き風PDFに変換

パソコンで書いたレポートを教諭のところに持っていったら、手書きで提出しろと理不尽なことを言われたことはないでしょうか。印刷したドキュメントを真正直に書き直してもいいですが、それでは屈したと感じてしまいます(個人の感想です)。そこで使ってみたいのがhandwritten.jsです。テキストファイルを瞬時にして手書き風に変...

List

  • 2020/09/18

電脳麻将 - Webブラウザだけで遊べる麻雀

麻雀が好きな人は多いですが、コロナウイルスの影響で雀荘が軒並み営業できない状態です。オンラインに流れている人もいますが、顔も分からない人と打つのにちょっと気後れしてしまっている人もいるでしょう。今回紹介する電脳麻将はWebブラウザ、JavaScriptで実装された麻雀アプリです。## 電脳麻将の使い方最初に書いておくと...

List

  • 2020/09/16

Text to Handwriting - テキストを手書き風に変換

宿題などは手書きで提出するように求められたことはないでしょうか。コンピュータで出力するのと何が違うのかと思ってしまいますが、そうした時代錯誤は常に存在します。そこで屈して手で書くのは凡人であり、そうした逆境を克服するのもまた開発者です。今回紹介するText to Handwritingはテキストを手書き風にしてくれるソ...

List

  • 2020/09/13

WikiLoop DoubleCheck - Wikipediaを守るレビューツール

Wikipediaは世界最大の百科事典であり、日々多くの人たちによってコンテンツが作成、編集されています。それを一定の品質に保つため、レビューする人たちがいますが、差分を確認して受諾したり、リジェクトするのはとても大変です。そこで作られたのがWikiLoop DoubleCheckです。Wikipediaのレビューを素...

List

  • 2020/09/12

Gradio - 機械学習用のUIを3分で作成

AI/機械学習の分野で研究が日々行われており、これまでには考えられなかったような製品や技術が出てきています。画像認識やゲーム、さらに動画を変換するようなことまで機械学習によって実現しています。今回紹介するGradioはそんな機械学習を体験できるUIを作成するためのライブラリです。## Gradioの使い方例えば写真にカ...

List

  • 2020/09/12

wasgen - Web Audio用のサウンドを生成するライブラリ

Web Audio APIを使いこなせば音楽を奏でられることは分かっています。しかしWeb Audio APIはかなりローレベルなので、音を奏でるために必要な実装をすべてやらなければなりません。単純なビープ音であればまだしも、音楽として聞かせられるレベルではないでしょう。そこで使ってみたいのがwasgenです。Web ...

List

  • 2020/09/11

city-roads - 地図の道ごとに色分けして表示

地図を元々提供されているままではなく、オリジナルのデータを載せたり、描画方法を変えたいと思ったりすることはないでしょうか。その手のことをしようと思うとGoogleマップでは難しかったりします。そうした目的でよく使われるのがOpenStreetMapです。今回紹介するcity-roadsもそうした一例になります。地図の道...

List

  • 2020/09/09

Moufette - ユーザフィードバックのフォームを生成

Webサイトを表示すると、右下のあたりにチャットウィンドウが表示されることがあります。個人的には煩わしいのですが、よく使われているということは、効果があるのでしょう。メールを書いたり、コンタクトフォームで入力するよりは手軽なのは間違いありません。そんな訪問者との接点としてフィードバック用のフォームを生成できるのがMou...

List

  • 2020/09/07

The Fabricius Project - AI/機械学習を使ってヒエログリフを学ぼう

古代のエジプトではヒエログリフと呼ばれる象形文字が使われていました。博物館などで、エジプト関連の遺跡を見たり、映画で考古学系のものを見ると目にすることの多いものです。あのヒエログリフ、書かれていることが分かったらちょっと知識人っぽいですよね。そんな夢を叶えてくれるのがThe Fabricius Projectです。AI...