メディア - 画像の記事一覧
Tiler - 画像で画像を表現
風景の写真をモザイクで表現したり、小さな写真をちりばめて大きな写真を作ったりと、同じ素材でも表現の仕方を変えるだけで印象が大きく変わります。画像編集ソフトウェアでもそういった機能を持ったものがあります。今回紹介するTilerはPythonを使って、画像を画像で表現します。## Tilerの使い方元画像。!
webp-hero - WebP非対応ブラウザでも表示するpolyfill
WebPはGoogleがメインで開発を進めている画像フォーマットです。写真やイラストなど用途を区別せずに使えるフォーマットで、とてもサイズが小さく済むのが特徴です。しかし、対応しているブラウザが限られるのが難点です。そこで使ってみたいのがwebp-heroです。WebP非対応ブラウザでも表示可能にするpolyfillラ...
Glitch Studio - グリッチ画像を自在に作成
グリッチには何とも言えない魅力があります。古く言えばファミコンカセットを中途半端に差し込んだ時の画像と言うか、普通ではない状態だからこそ感じる面白さがあります。今回紹介するGlitch Studioはそんなグリッチ画像を様々なフィルタを通して作成できるソフトウェアです。## Glitch Studioの使い方画像を開き...
Looper - Webブラウザ上でループするアニメーションGIFを作成
アニメーションGIFはループする動画が簡単に作れるとあって、繋ぎが感じられないループアニメーションが映えます。アニメーションGIFを一から作るのは大変ですが、動画を使ったりプログラムで組んだりできます。今回紹介するLooperはそんなアニメーションGIFを生成するためのソフトウェアです。すべてプログラミングして作成しま...
Anime4K - 高速に画像を拡大
ぼやけた映像をくっきりとさせたり、拡大できるのがwaifu2xです。イラストや写真に特化し、世界中から高い評価を受けています。処理時間が若干長いですが、それだけハイクオリティな成果が得られます。そんなwaifu2xに対抗するのがAnime4Kです。リアルタイムでも処理できる、とする高速さが売りです。## Anime4K...
Silicon - ソースコードを綺麗な画像に
スライドの中でソースコードを取り扱いたいと思うことはよくあります。コードハイライトに対応していないと、見づらいものになってしまうでしょう。そのため、プログラミングエディタのコードをスクリーンショットで画像化したりしているかも知れません。そんな面倒はせずにSiliconを使えばコードを綺麗に画像化できます。## Sili...
SuperTinyIcons - 1KB以下の軽量アイコン集
アイコン集はいくら知っていてもいいものです。多彩なパターンに対応したものもあれば、特定の用途に使えるものもあります。様々なものを知っていれば、役立つ機会が多いにあります。今回紹介するSuperTinyIconsは1KB以下という小さなサイズが特徴なアイコン集となっています。## SuperTinyIconsの使い方ソー...
Convert360 - 360度（全天球）写真を見やすく切り出し
360度写真、360度動画が流行っています。自由に視点が変えられる写真、動画はとても面白いのですが、閲覧するためには専用のビューワーが必要なのが難点です。普通の写真や動画として見ると、端が丸まった見えづらいものになってしまいます。そこで使ってみたいのがConvert360です。360度写真を見やすく整形してくれます。#...
GifCapture - デスクトップ操作をアニメーションGIF化
アニメーションGIFはとても使い道が多いです。動画だとついつい冗長的になってしまいがちですが、アニメーションGIFはハイライト部分だけを切り出して作られています。面白い部分だけが繰り返し再生され、音声もないとあって、面白さが増幅します。そんなアニメーションGIFをデスクトップで手軽に作成するソフトウェアとしてGifCa...
imgpush - オープンソースの画像共有サーバ
ImgurやGyazoなど画像アップロードサイトは多数あります。そうしたサイトを使うことで友人やコミュニティサイトなどで画像共有を簡単に行えますが、コンテンツの公開制限をはじめ、自分で制御できないことに不安を感じる人もいるでしょう。そこで使ってみたいのがimgpushです。画像を簡単にアップロードできるサーバを手軽に設...
photoEditor - Web上で簡易的な画像編集
ユーザに画像をアップロードしてもらう機能はよくありますが、そのままでは使いづらいことが良くあります。例えばサイズが大きすぎたり、回転してしまっていたりといった具合です。そんな時に簡易編集機能を提供できるのがphotoEditorです。## photoEditorの使い方写真を開いたところ。この状態では、まだサーバに送信...
gosimimg - 画像が似ているかチェック
Googleでは検索した際に「もしかして」と出ることがあります。多少の打ち間違いであったり、文字が繋がっていても良い感じに分割して検索してくれます。しかしバイナリデータの場合はそう簡単ではありません。今回紹介するgosimimgは画像同士が似ているかどうかを判別してくれるソフトウェアになります。## gosimimgの...
OpenMo - どこでも使えるオープンな絵文字
絵文字は様々なサービス、アプリで使われるようになっています。AppleやAndroid、Slack、Facebook、Twitterなどが各社独自の絵文字を作っており、完全に統一されている訳ではありません。また、それらは各サービスのものであり、自由に使える訳ではありません（Twitterの絵文字はオープンソースです）。...
COCO Annotator - 機械学習用に画像のタグ付け
機械学習で面倒なのは最初のデータセット作りでしょう。画像のタグ付けを行う場合、まずトレーニング用のデータをアノテーションしなければなりません。この結果によって精度が変わるのでしっかりやらないといけませんが、手間がかかります。そんなアノテーションを少しでも楽にしてくれるのがCOCO Annotatorです。## COCO...
glfx.js - JavaScriptで画像を加工
画像を加工する場合、画像編集ソフトウェアが使われます。そして加工したファイルを保存し、Web上にアップロードするでしょう。しかしこの場合、再度編集する際に備えて元ファイルは保存しておかなければなりません。また、同じ加工を何十枚もの画像に施すのも大変です。そこで使ってみたいのがglfx.jsです。JavaScriptを使...
kromo - 画像にレンズぼけ、色収差加工を施す
写真を撮影したそのまま使うのではなく、ちょっとした加工をするだけで全く見え方が変わったりします。しかし慣れていないと、ちょっとした加工でも時間がかかってしまいます。加工法の多くはパターン化されており、それであれば自動化もできるはずです。今回紹介するkromoは画像にレンズぼけ、色収差といった加工を施すソフトウェアです。...
Audio GIF - 無茶しおる…アニメーションGIFに音声を埋め込む
アニメーションGIFの良いところは何でしょう。動画とは異なり、同じ場面を繰り返してくれること、音声がないことが挙げられます。制約も多いので、利用場面も異なってきます。しかし、技術の力で乗り越えられる壁もあるのです。それがAudio GIFです。その名の通り、アニメーションGIFの中に音声を詰め込むという無茶なソフトウェ...
ken-burns-slideshow - ケン・バーンズ効果を実現できるWebコンポーネント
ケン・バーンズ効果という演出を知っていますか。複数を写真がある時、それを単に差し替えるだけでなく、ズームや左右上下にゆっくりとアニメーションしながら切り替えることで、単なる写真に命を与えると言われています。ケン・バーンズ監督が映画の中で使っていたことでそう呼ばれています。そんなケン・バーンズ効果を手軽に実現できるWeb...
Medium Zoom - Medium風に画像をズーム
Mediumは人にとって読みやすい、使いやすいUI/UXにこだわっています。様々な工夫がされており、それははっきりと分かるものもあれば、細かすぎて気付かないものもあるでしょう。しかしそういった細部にこそ神が宿るものです。今回紹介するMedium Zoomは画像のズーム表示をMediumライクに表現してくれるライブラリで...
JS Cloudimage 360 View - 自由に360度させられる商品ビューワー
正面からの商品画像だけで購入を決めるのは難しい製品は多数あります。左右や後ろからの写真を見てはじめて自分の納得いくものかどうか判断するでしょう。しかしそのために動画を見るのは面倒です。今回紹介するJS Cloudimage 360 Viewは様々な角度から撮影した商品画像を使って360度回転できるウィジェットを生成しま...