Webの記事一覧

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

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

もっと見る

List

  • 2020/10/19

RiggingJs - 機械学習を使ってWebカメラの人物に沿って3Dモデルを動かす

機械学習はさまざまな分野で活用されています。画像や動画の分析で使われていることも多いです。人の目で見れば認知できる情報も、従来のアルゴリズムではコンピュータには判別しがたいものでした。しかし、機械学習の柔軟性によって乗り越えられています。そんな機械学習を使ってスケルトンモデルに動きを与えられるのがRiggingJsです...

List

  • 2020/10/18

Online GitHub Contributor Graph Generator - GitHubのアクティビティグラフで自由に絵を描く

GitHubでは日々の活動(Gitログ)によってアクティビティグラフが描かれます。それによって毎日開発を続けようと思いますし、モチベーションにしている人も多いでしょう。あのグラフはサーバ側で制御しているものではないので、Online GitHub Contributor Graph Generatorのような仕組みを使...

List

  • 2020/10/17

Twake - Todo/カレンダー/ストレージが合わさったチャットツール

リモートワークが広まるのに合わせて、オンラインコミュニケーションツールが増えています。SlackやTeamsを採用するケースが多いようですが、他にもたくさんの選択肢があります。今回紹介するTwakeはSlackに似たチャットツールになります。オープンソースで、自分で立てられるのが大きな魅力です。## Twakeの使い方...

List

  • 2020/10/15

XML Viewer - XMLの構造をWeb上で閲覧

開発時によく使われるドキュメントフォーマットといえば、最近ではJSONが一番多いかと思います。しかし、少し前であればXMLが主流でした。閉じタグがあったり、可読性の低さがあってXMLはJSONに取って代わられたように見えます。今回紹介するXML Viewerはそんな懐かしい(?)XMLを見やすく表示できるビューワーです...

List

  • 2020/10/15

Apple ][js - Web上で動くApple ][エミュレータ

Apple はAppleの歴史を語る上で欠かせないハードウェアです。Apple Iの成功から、パーソナルコンピュータの市場を確立すべく投入されたマシンで、当時は多くの開発者が触った筐体です。そんなApple をWebブラウザ上でエミュレーションするのがApple jsになります。## Apple jsの使い方起動します...

List

  • 2020/10/14

Drawflow - データフローを作成するライブラリ

ノーコードプラットフォームが普及してきています。プログラミングはせずに、多くの場合はGUIで部品同士を組み合わせて一つの機能を作り上げていきます。そうしたUIを作るのに使えそうなUIライブラリとしてDrawflowを紹介します。## Drawflowの使い方デモのUIです。!

List

  • 2020/10/13

labelmake - WebでもCUIでも使えるPDF生成ライブラリ

PDFとシステムの連携で思いつくのはレポートや帳票でしょう。基本的に両方とも提携であり、データだけ変わります。テンプレートがあると、より作りやすくなります。今回紹介するlabelmakeはスキーマと呼ぶスタイル設定を用いてPDFを生成するソフトウェアです。## labelmakeの使い方左側がコード、その結果が右側のP...

List

  • 2020/10/12

WebGui - WebGL上でImGuiを使ってUIを構築する

OpenGLでUIを作る際にはImGuiのようなライブラリを使います。ゲームや3Dなどを使っている人にとってはよく使い慣れたライブラリかも知れません。ではWebGLな環境ではどうなるでしょうか。WebGuiはWebGL環境でImGuiを使った実証デモになります。WebAssemblyを使っており、高速に動作します。##...

List

  • 2020/10/10

AVR8js - WebベースのArduinoシミュレータ

IoTをはじめてみようと思っても、一番のネックになるのが専用のマイコンを手に入れないといけないことでしょう。高いものではありませんが、それでも最初から出費が伴うのを嫌がる心理は分かります。そうした中登場したのがAVR8jsです。なんとJavaScript製のArduinoシミュレータです。## AVR8jsの使い方確か...

List

  • 2020/10/09

SmartBlock - ブロックベースのReact用WYSIWYGエディタ

ユーザにHTML編集を任せる場合、何らかのツールバーやWYSIWYGなエディタが欲しいと思うでしょう。そういったツールは多々ありますが、なかなか使いやすいものに出会えません。今回紹介するSmartBlockはブロック単位での編集が可能なエディタです。並び替えもできて使い勝手はよさそうです。## SmartBlockの使...

List

  • 2020/10/08

html-midi-player - MIDIファイルの再生と可視化を行うWebコンポーネント

MIDIはかつて耳コピーが流行っていた時代に一世を風靡した音楽フォーマットです。今もミュージシャンの人たちは使っていることでしょう。Web上で再生もできますが、ただアップロードするだけでは味気ないものです。そこで使ってみたいのがhtml-midi-playerです。MIDIファイルの可視化と再生ができるWebコンポーネ...

List

  • 2020/10/06

OTP Manager - Web/デスクトップ対応のワンタイムパスワード管理

多要素認証の基本として、ワンタイムパスワードの入力が行われています。多数のアプリがすでにありますが、何を利用しているでしょうか。筆者はAuthyを長く使っていますが、これから変えようと思っている人もいるはずです。ベンダーの色がないものが好きな方はOTP Managerを試してみましょう。Webやデスクトップアプリとして...

List

  • 2020/10/05

ZzFXM - JavaScript製の小さな音楽ジェネレータ

音楽を作ったり、奏でるのは大変です。才能に恵まれないと、人々を感動させる曲を作るのは難しいでしょう。しかしできあがった音楽をWebではインする際には開発者の力が必要になるはずです。今回紹介するZzFXMはごくごく小さな音楽ジェネレータです。## ZzFXMの使い方デモです。実際には音楽が流れます。数字の配列だけで音楽が...

List

  • 2020/10/05

umami - Google Analytics代替を目指すシンプルなアクセス解析

Google Analyticsを使っているWebサイトは多いです。しかし、個人のプライバシーに関わるデータがGoogleに吸い上げられていることを懸念する声もあります。サイト運営側にとっても、アクセスデータという重要なものがGoogleに蓄積されるのを嬉しくは思わないでしょう。そこで使ってみたいのが自分たちで立てるア...

List

  • 2020/10/03

Shift-Ctrl-F - 自然言語によるWebページ内検索

世の中には検索が上手な人もいれば、苦手という人もいます。具体的なキーワードが思いつかない場合、雰囲気で検索してしまいがちです。それでは欲しかった答えにたどり着けないでしょう。しかし、それを克服するのもまた、技術の力です。そこで使ってみたいのがShift-Ctrl-Fです。Webページ内で自然言語による検索を可能にします...

List

  • 2020/10/03

Arwes - サイバーパンクな世界を再現するWebデザイン

開発者であれば、誰しもSFに興味を持つはず(個人の意見です)。近未来を舞台にした映画は数多くありますが、その多くで電気的な、かつ薄暗い世界が描かれています。粗暴な人たちがいたり、裏路地のような看板が並ぶ中、デバイスや乗り物だけは進化している世界です。そんな世界観にぴったりなWebデザインフレームワークがArwesになり...

List

  • 2020/10/02

Taskcafe - いかしたデザインのカンバンシステム

カンバンの概念は多くのシステム、サービスに影響を与えています。単純なタスク管理とは異なり、ビジュアル化されること、ステータスの変化がはっきりと分かるのがポイントです。カンバンを共有すれば、チーム全体で状況を共有できます。今回紹介するTaskcafeはそんなカンバンシステムになります。デザインも格好良く、使いやすそうです...

List

  • 2020/10/02

ztext.js - テキストや絵文字、画像を3D化

2Dのものを3Dで表現する試みは多数あります。人の脳は2次元であったとしても、奥行きを持たせることで、向こう側にある空間を意識します。さらに静的ではなく、動かしたりするとより、立体感が生まれます。今回紹介するztext.jsはテキストや絵文字を3D化するソフトウェアです。## ztext.jsの使い方実際に試していると...

List

  • 2020/10/01

PeopleMap - 研究者を自然言語で可視化

学術的な研究分野はオンラインの発展により、どんどん広がっています。世界はどんどん狭くなっており、情報は日々大量に作成されています。大学内にある古いインデックスを見ても正しい研究者にたどり着くのは至難の業でしょう。そこで作り出されたのがPeopleMapです。研究者のグルーピングを機械学習によって行います。## Peop...