メディア - 画像の記事一覧
IconGenerator - iOS/macOS/watchOSなどのアイコン画像をまとめて生成
iPhoneやiPadなどiOSデバイスの種類が増えるのに伴ってアプリで用意しなければならないアイコンの種類も増えています。サイズが多彩にあり、いちいち用意するのが面倒に感じているのではないでしょうか。そこで使ってみたいのがIconGeneratorです。一つのファイルからまとめてアイコンファイルを生成してくれます。#...
imagemin - 画像サイズをコマンドラインでまとめて軽減
ネットワーク上に流れるデータは極力小さい方が良いです。圧縮はもちろん、余計なメタ情報を削除したりして、ネットワーク負荷を軽減するのが望ましいでしょう。しかし一つ一つのファイルを手作業でやるのは現実的ではありません。そこで自動化です。今回はコマンド一つで画像サイズを軽減できるimageminを紹介します。## image...
みんなだいすき東京アメッシュ！ - ターミナルで東京アメッシュの画像を表示
日本の気候はまるで熱帯雨林のように、ゲリラ豪雨が当たり前になっています。そうした突然の天候の変化を知るのに使えるのが天気図で、特に今の降雨状態が分かると自分のいる場所にも雨が降るのかどうか分かります。そこで使われているのが東京アメッシュ
carbon-now-cli - プログラミングコードを画像化
プログラミングコードをブログなどで綺麗に表示したいと思っても、ブログの環境が対応していないケースがあります。多少のハイライトは入っていても、タブ幅、フォント、テーマなどカスタマイズしたい要素は無数に存在します。そこで使えるのがコードの画像化ですが、毎回手作業でやるのは面倒です。自動化したいならcarbon-now-cl...
Terminalizer - ターミナルの入出力内容をアニメーションGIF化
サーバのセットアップ時など、ターミナルの作業内容をメモしておきたいということは多々あります。後になって、コマンドだけで振り返っても分かりづらいので、入出力内容をそのまま保存しておくのが便利です。そこで使ってみたいのがTerminalizerです。ターミナルの作業内容をアニメーションGIFに変換してくれます。## Ter...
Save images - ページ内の画像をまとめてダウンロード
Webサイトの中には写真をたくさん掲載しているところがあります。気に入った写真をまとめてダウンロードしたいと思っても、いちいち写真を選択するのが面倒だったりしますよね。そこで使ってみたいのがSave imagesです。ページ内にある写真を一気にダウンロードできるソフトウェアです。## Save imagesの使い方任意...
lepto - WebとCLIで画像最適化
スマートフォンやデジカメなど、画像コンテンツがどんどん増えています。綺麗な写真を、と思うとファイルサイズも大きくなる一方で、あっという間にストレージを逼迫してしまいます。そこで使ってみたいのがleptoです。様々なフィルタリングをつけた上で自動的に画像を最適化してくれるソフトウェアです。## leptoの使い方Web版...
Icon Font to PNG - WebFontから画像を生成
WebFontは非常に便利ですが、常にWebFontが良いという訳ではありません。時には画像のが良いということもあるでしょう。例えばデスクトップアプリで使いたいと言った場合や、ドキュメントに使いたい時もあるでしょう。そこで使ってみたいのがIcon Font to PNGです。WebFontを画像にしてくれるソフトウェア...
twentytwenty - 上下または左右で画像を比較
二つの画像を見比べて何が違うのか判断するにはどうしたら良いでしょうか。横並びにしてもなかなか分かりづらいかも知れません。逆に変換前後でファイルサイズが軽減されている場合は、見た目が変わっていないことを理解させたいこともあります。そんな時に使えるのがtwentytwentyです。スライダーを使って左右の画像を差し替えます...
RTP.PinchZoom.js - 画像をピンチ操作で拡大
スマートフォンアプリでよく使われるのがピンチ操作です。複数指を使って操作することで、デスクトップではできなかったような操作が可能になります。より直感的で、誰でもすぐに使いこなせるのも利点です。そんなピンチ、ズームと言った操作をWeb上でも使えるようにするのがRTP.PinchZoom.jsです。## RTP.Pinch...
gif-for-cli - コンソールでアニメーションGIFを楽しむ
ここ数年、アニメーションGIFが広く使われるようになっています。動画のように高画質でもありませんし、ファイルサイズも大きくなりがちなのですが、ハイライトシーンだけを繰り返すようなアニメーションはとても面白いです。そんなアニメーションGIFをコンソール上でも楽しめるのがgif-for-cliです。面白いのはこれがGoog...
letter-icon-generator - SVG/画像で一文字のアイコンを生成
最近、プロフィールアイコンを設定していないアカウントは頭文字だけを表示するといったアイコンが増えています。Slackでもデフォルトではチャットの頭文字だけが表示されます。そういったアイコンを生成してくれるのがletter-icon-generatorです。## letter-icon-generatorの使い方lett...
S3 Album Publisher - 静的ホスティングサイト向けにアルバムをアップロード
Webサイトを立ち上げるというのは昔に比べると手間がかからないものになりましたが、逆に手間がなくなりすぎて一切立ち上げる気がなくなってしまっています。ちょっとしたサイトをあえて自分でメンテナンスするのは面倒というものです。例えば写真を他の人に公開したいというだけであればS3 Album Publisherを使ってみるの...
MRISA - Google画像検索を使って類似画像APIを実現
AIや機械学習で良く取り上げられるのが画像の分析です。何や誰が写っているのかを分析したり、タグ付けするような技術が人気です。また、ある写真と似たような写真を探すこともできます。そうした画像検索をGoogle画像検索を使ってAPI化するのがMRISAです。## MRISAの使い方MRISAは以下のようなAPIを呼び出して...
GIFPop - アニメーションGIFを最適化
最近アニメーションGIFが使われる場面が増えていますが、難点としてサイズが大きくなりがちという問題があります。特に動画からアニメーションGIFに変換した場合、FPSが高すぎたりしてWeb上に貼るのに向きません。そこで使ってみたいのがGIFPopです。アニメーションGIFを手軽にリサイズできます。## GIFPopの使い...
geotiff.js - Web/nodeでTIFFを扱う
画像には多彩なフォーマットがありますが、それでもWebブラウザ上で扱われるものは多くありません。JPEG/PNG/GIFくらいではないでしょうか。そんな中、目にする機会の多いフォーマットとしてTIFFがあります。TIFFはタグ情報を持ったビットマップ画像フォーマットです。そんなTIFFをWeb上で扱えるのがgeotif...
qlImageSize - QuickLookで画像のサイズを表示 & WebP/BPGをサポート
QuickLookで画像を表示するのは便利なのですが、画像サイズが分かりづらいのが難点でした。大きな画像でも最適化して表示する一方、小さな画像もそれなりの表示になります。そして画像編集ソフトウェアで表示してがっくりするのです。そんな経験がある方はqlImageSizeを使ってみましょう。QuickLookのタイトルに画...
Isolate - 写真をPinterest風に表示
撮りためた写真を見るのに、一枚一枚見てもいいですが、大量にあると時間がいくらあっても足りません。一覧でざざっと眺めたいと思うこともあるはずです。しかし、せっかくの写真が画一的に整列して表示されるのは何となく味気ないですよね。そこで使ってみたいのがIsolateです。ディレクトリにある写真を読み込んでPiterest風に...
Crunch - PNG画像のサイズを大幅に軽減
PNGは可逆な暗号化が可能で、BMPに比べて大幅に小さくできます。しかし、多くのアプリケーションが作成するPNGファイルが圧縮などは行われず、サイズも大きいものです。Webサイトなどでそのまま使ってしまうと転送量が増えてしまいます。そこで使いたいのがCrunchです。PNG画像ファイルをドラッグ&ドロップするだけでサイ...
blend.js - 二つの画像を重ね合わせるJavaScriptライブラリ
一つ一つの素材は単純でも、素材同士を合成することで新しい素材を生み出すことができます。最近ではAIによって、風景写真を別な風合いに変えたりするものもあります。従来、人手でやっていたような作業がすべて自動でできるようになっています。今回紹介するblend.jsはAIほど高度な訳ではありませんが、二つの画像をWeb上でミッ...