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

Webの記事一覧

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

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

もっと見る

List

  • 2020/01/08

Nonflowers - 世界中どこにも存在しない花を生成

最近、プライバシー保護の動きもあって、機械学習を使って人の顔を生成する動きがあります。自動生成された、世界中どこにもいない人であれば著作権を気にせず利用できるという訳です。それと類似技術を花に対して適用したのがNonflowersです。## Nonflowersの使い方アクセスする度に異なる花が生成されます。!

List

  • 2020/01/07

Nitter - 多彩な検索が可能なTwitterフロントエンド

Twitterのフロントエンドが大きく変更され、使いづらいと感じている人も少なくありません。かつてのTwitterではWeb APIの利用制限が緩く、誰もが自由にクライアントアプリケーションを開発できていましたが、今はそういったソフトウェアが大幅に減っています。今回紹介するNitterはそんな中、珍しいTwitterフ...

List

  • 2020/01/04

Offline Browser Communication - どんな使い道があるか。ローカルで立てるWebRTCサーバ

WebRTCはリモートと動画チャットをしたり、メッセージを送る際に使われる面白い技術ですが、サーバのセットアップなどに手間がかかるイメージがあります。もっと手軽に使えれば可能性が広がりそうです。今回紹介するOffline Browser Communicationはローカルで立ててすぐに使えるWebRTCサーバです。#...

List

  • 2020/01/04

アクセシビリティカラーヘルパー - Webアクセシビリティを考慮した色を提案

Webのアクセシビリティは大事な考え方です。誰もが使いやすいWebサイトを目指す上で、文字の大きさや背景色とのコントラスト、リーダー対応など様々な観点があります。今回紹介するアクセシビリティカラーヘルパーは背景と文字のコントラスト比を維持するためのカラーパレットになります。## アクセシビリティカラーヘルパーの使い方利...

List

  • 2020/01/02

Falco - Webサイトのパフォーマンスを可視化するダッシュボード

Webの解析ツールというと、アクセスを解析するものが殆どです。ビューやUUを計測して、Webサイトの改善に活かします。それらのデータは管理者向けのものであり、訪問者はデータを渡すだけでした。Falcoは異なる視点でデータを収集します。それはWebサイトの使いやすさ、パフォーマンスに注目しています。## Falcoの使い...

List

  • 2020/01/01

Sweetconfirm.js - 送信を思いとどまらせるボタン

送信フォームを押してしまって後悔した経験はないでしょうか。Gmailなどでは送信後にキャンセルできる機能が追加されました。押す前に熟考したはずなのに、押すとアラが見つかる、なんてことはよくあります。今回紹介するSweetconfirm.jsは送信完了するまでに少し猶予をくれる、そんなライブラリです。## Sweetco...

List

  • 2019/12/29

BlockLike.js - ビジュアルプログラミング風に開発できるJavaScriptライブラリ

ブロックを用いたビジュアルプログラミング環境はプログラミング初学者や、英語が分からない小学生などに向いています。極めれば多くのことが実現できる一方、通常のプログラミング言語との壁は常に存在します。ブロックによるプログラミングと通常のプログラミング、その垣根を越えようとするのがBlockLike.jsです。## Bloc...

List

  • 2019/12/28

Markdown Editor - シンプルなWebベースのMarkdownエディタ

Markdownエディタは多数存在します。それらを使うことで、自分のWebアプリケーション内にMarkdownを使った編集機能を簡単に追加できます。特に開発者向きのWebサービスで役立つでしょう。今回紹介するMarkdown EditorはそんなMarkdownエディタの一つです。シンプルですが、使いやすいエディタです...

List

  • 2019/12/26

JSFrame.js - モーダルからチャットまで。軽量なウィンドウライブラリ

Webアプリケーションを高機能化する上で欠かせないのがウィンドウではないでしょうか。ローカルOSの中で使うのはごく当たり前のようになっていますが、Webアプリケーションも複雑化すると、情報をウィンドウごとに分けたくなるはずです。そんなウィンドウを実現してくれるライブラリがJSFrame.jsです。## JSFrame....

List

  • 2019/12/25

LiteGraph - 高機能なビジュアルプログラミング環境

ビジュアルプログラミング環境が注目されています。例えばNode-Redはビジネスレベルでも使われていますし、プログラミング教育の文脈の中でも様々な環境が利用されています。今回紹介するLiteGraphもそんなビジュアルプログラミング環境といえるソフトウェアです。様々なノードを連結し、情報をリミックスできます。## Li...

List

  • 2019/12/25

cloudretro.io - 懐かしいゲームをクラウド化

GoogleのStadiaをはじめとして、クラウドゲーミング市場が盛り上がってきています。高速なネットワークとクラウドコンピューティングが合わさった今だからこそ注目したい市場でしょう。そんなクラウドゲーミングで、昔ながらのゲームを遊べるのがcloudretro.ioです。## cloudretro.ioの使い方ゲーム画...

List

  • 2019/12/24

Jobmiru - どんなスキルが手に入るのかを重視した転職口コミサイト

仕事を決めるとき、何を重要視するでしょうか。給与、勤務地、待遇、同僚、上司など様々な条件が考えられます。そんな中、何の仕事をして何が得られるのかを重視する人もいるでしょう。そんな方に見て欲しいのがJobmiruです。何のスキルが身につくのか、そんな視点で作られた転職口コミサイトです。## Jobmiruの使い方トップペ...

List

  • 2019/12/23

texme - Markdownの中にLaTeXを埋め込めんで表示

Markdownではベーシックな記法しかサポートされていないので、こだわった記法を使うために拡張している人たちがたくさんいます。特に論文などを書く人たちにとっては表現力の低さが気になるでしょう。そこで使ってみたいのがtexmeです。Markdownの中にLaTeX記法が埋め込めるソフトウェアです。## texmeの使い...

List

  • 2019/12/23

dot-to-ascii - Graphviz記法からアスキーアートでチャート生成

dotファイルはGraphviz用のフォーマットとして有名です。テキストから画像などのグラフが描けるので、仕様書など開発者用ドキュメントの中でもよく使われています。クラス図など自動化もしやすいのがメリットです。そんなdotファイルからアスキーテキストのチャートを描くソフトウェアがdot-to-asciiになります。##...

List

  • 2019/12/22

WebGLStudio.js - 本格的な3D Webアプリケーション

デスクトップアプリケーションが続々Webアプリケーション化されています。開発環境や画像編集ソフトウェア、オフィススイートまで幅広くWebブラウザで動作するようになっています。今回紹介するWebGLStudio.jsはWebブラウザ上で3Dグラフィックスを作成できるソフトウェアです。## WebGLStudio.jsの使...

List

  • 2019/12/21

UXBOX - プロトタイプをさくさく作るためのWebアプリケーション

Webサイトやアプリなど、プロトタイプをさくっと作ってUIを検討するというのはよくある進め方です。そんな時にはデザイナーしか使えないソフトウェアよりも、誰でも編集できるものを使った方が素早く進められるでしょう。今回紹介するUXBOXはオープンソースのプロトタイピングソフトウェアです。## UXBOXの使い方まずプロジェ...

List

  • 2019/12/21

Flowy - さくさく作れるフローチャートライブラリ

フローチャートを利用する機会は意外と多いです。しかし専用のソフトウェアがないために表計算やプレゼンソフトウェアを使って無理矢理作っているのではないでしょうか。Webブラウザで手軽に作れると便利です。今回紹介するFlowyはシンプルなフローチャートライブラリです。## Flowyの使い方左側にあるノードをドラッグ&ドロッ...

List

  • 2019/12/20

cloudmacs - Webブラウザから使えるEmacs

最近、Webブラウザ上で使える開発環境に注目が集まっています。Visual Studio CodeはついにMicrosoftからオンライン版がリリースされました。さらにvimについてはWebAssembly版のvim.wasmが登場しています。そんな中、Emacsはどうなのか。もちろん手をこまねいている訳がありません。...

List

  • 2019/12/20

p5.riso - 画像を懐かしさ溢れるリソグラフ風に加工

リソグラフというのは印刷方式の一つで、原版を作ることで高速な印刷ができます。色数を押さえることで高速印刷可能で、新聞の折り込みチラシにあるような風合いの印刷が可能です。そんなリソグラフをWeb上で再現してくれるのがp5.risoです。懐かしい風合いの表現になります。## p5.risoの使い方デモです。ちょっとかすれた...

List

  • 2019/12/19

LegraJS - レゴ風ブリックを使ってドローイング

レゴはみんなが好きなおもちゃでしょう。一つ一つは小さなブリックですが、それを組み合わせることで何でも自分が好きなものを作り上げられます。最近ではIoTとも組み合わせて使われています。そんなレゴ風のブロックを使ってドローするライブラリがLegraJSです。## LegraJSの使い方スマイルマークのアニメーション。!