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

メディア - 画像の記事一覧

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

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

もっと見る

List

  • 2014/07/14

Gifffer - アニメーションGIFを動画のように再生、停止

TwitterがアニメーションGIFをサポート開始しました(実際には動画に変換しているようですが)。無音で繰り返し表示されるアニメーションGIFは動画とはまた違う趣で面白さがあります。そんなアニメーションGIFがさらに広がっていく中、使ってみたいのがGiffferです。アニメーションGIFがまるで動画のように再生、停止...

List

  • 2014/07/06

gifken – Web上でアニメーションGIFの解析&生成

HTML5になって俄然面白くなってきたのがアニメーションGIFではないかと思います。バイナリとして読み込むことで、単純な再生だけでなく再生を変化させたり、動画から新しいアニメーションGIFを作ってしまったりできます。そのベースとして使えそうなライブラリがgifkenです。アニメーションGIFの解析はもちろん、作成までサ...

List

  • 2014/07/03

Pixel Editor - Webとローカル両方で使えるドット絵エディタ

ドット絵は昔のコンピュータ、ゲーム機の時代から人気のあるイラストです。今なおTwitterのアイコンに設定している人も大勢います。写真やきれいなイラストとは違う、懐かしさが魅力です。そんなドット絵を描くソフトウェアがPixel Editorです。Webベースでのデモに加えて、Windows/Mac OSXのローカルでも...

List

  • 2014/07/02

crossfade.js – スクロールで画像をぼかすエフェクト

パララックスエフェクトによってスクロールに意味を持たせる動きが活発になっています。スクロールするとアニメーションしたり、色が変わったりするサイトもありますが、今回はまたちょっと違うアクションです。crossfade.jsを使うと画像がぼかされて目立たなくなっていきます。シングルページのWebアプリケーションで効果的に使...

List

  • 2014/06/16

TTYGIF – ターミナル操作をアニメーションGIF化

最近、ソフトウェアの操作を動画ではなくアニメーションGIFにするケースが増えているようです。確かに音声不要でかつ手軽に扱える形式としてアニメーションGIFは都合が良さそうです。そんな操作はなにもGUIだけではありません。TTYGIFを使えばターミナル操作をアニメーションGIFにして残すことができます。## TTYGIF...

Missing

  • 2014/06/05

Sassmatic - CSS3を使ってダイナミックに画像へフィルタ適用

画像の加工処理をやろうとすると、サーバサイドでもJavaScriptでも面倒といった印象がありますよね。特にユーザに選ばせたり、その場でダイナミックにフィルタを適用するなんてのは相当大変です。そこで使ってみたいのがSassmaticです。SCSSを使ってCSS3だけでフィルタリングを実現するライブラリです。## Sas...

List

  • Premium_s 2014/05/23

使えるWebサービス・オープンソース(27)「類自画像検索」

今回のテーマは類似画像検索です。スマートフォンが流行るのにつれて、写真コンテンツは爆発的に増えています。テキストよりも画像の方が役立つケースも多く、写真コンテンツは今後も増え続けるでしょう。そこで求められるのは従来のテキスト検索ではない情報提供方法です。その一つ、画像を検索するための技術である類似画像検索を取り上げてみ...

List

  • 2014/05/20

LIRE - Java製の類似画像検索エンジン

Googleの類似画像検索を使うと、例えばどこかのサイトで見た画像のネタ元(さらに言えば加工前)の画像を探すことが出来ます。それによって改変を見破ったり、一次ソースにあたることが出来ます。それだけでなく、類似画像検索は色々な場面で役立つでしょう。大量にある写真の中から類似した写真を見つけ出せば、それだけで魅力あるコンテ...

List

  • 2014/04/24

smartcrop.js - 要注目!スマートなクロップ機能を実現

おお、これは格好いい!写真のサムネイル表示というのはやり方によって大きくインパクトが変わります。単純に縮めて表示すると何の写真か分かりづらくなります。さらに横長、縦長の写真では正方形に切り出すのは簡単ではありません。そこで使ってみたいのがsmartcrop.jsです。写真の中から一部を切り出すライブラリで、よりインパク...

List

  • 2014/04/12

Looks Tiqav To Misawa – レス画像を簡単に挿入できるChrome機能拡張

チーム内で使うとコミュニケーションがスムーズになりそうですね。絵文字の流行、そしてアスキーアートの発展の中に生み出された(?)文化がスタンプやレス画像です。言い出しづらい罵詈雑言もマンガを通してなら穏やかに伝えることができたり、褒める際にもちょっとしたアクセントになります。そんなレス画像をMarkdown形式の中にさり...

List

  • 2014/04/11

I ♥ ∆ – 三角形を組み合わせたポリゴン画像を作成!

おお、これは面白い。ポリゴンを組み合わせた画像って格好いいですよね。大小さまざまなポリゴンを組み合わせることで写真やイラストとはまた違った印象を与えます。しかしゼロから作ろうと思うと相当難しいのではないでしょうか。既にある写真やイラストをもとにポリゴン化された画像を作成するソフトウェアがI ♥ ∆です。読み方は恐らくア...

List

  • 2014/04/09

Asciidia - EBNFに対応したSVG/画像によるテキストダイアログ出力ツール

言葉や文字列の定義では分かりづらい内容も図にすると明確になることがあります。そのため技術的なドキュメントにも図表が多く使われています。しかし図にすると後々の修正が面倒に感じる事も多いでしょう。そこでテキストから図を起こすのがお勧めです。テキストであれば修正は容易で、その後コマンド一つで画像にできる訳です。今回はEBNF...

List

  • 2014/04/03

CIntruder – Captchaの解析を目指すPythonスクリプト

人とコンピュータのどちらが賢いのか、それは永遠の命題と言えます。将棋やチェスで人とコンピュータが争う中、もっとシンプルに見えるCaptchaは未だに人とコンピュータを区別する手段として有効に使われています。コンピュータには解読できず、人には十分に可読できるCaptchaをコンピュータで自動的に読み込ませようとするプロジ...

List

  • 2014/03/26

imgo - JPEG/PNG/GIF/ICO。画像なら何でも圧縮してサイズ軽減

こういう取りまとめてくれるツールは便利ですね!Retinaディスプレイや4Kディスプレイなど高解像度のディスプレイが出回ると、その中で扱われる画像サイズも自ずと大きくなっていきます。それは致し方ないと思うのですが、何の対策もしないのはいただけません。PNG/JPEG/GIFなど様々な画像フォーマットに応じて圧縮ライブラ...

List

  • 2014/03/24

Link2QR - QRコードを使ってリンク、画像のURLを送信

デスクトップとスマートフォンの間でやり取りするのに便利ですよ!デスクトップで見ているサイトをスマートフォンに送りたい時、どうしているでしょうか。専用アプリを介しても良いですが、個人的にお勧めなのはQRコードです。Googleのグラフ作成APIの中にはQRコードも生成可能で、下記のブックマークレット一つで今見ているURL...

List

  • 2014/03/23

Camo - GitHubでも使われている画像プロキシ

最近のWebサービスではSSLを常用するようになっています。しかしそんな中、意外と厄介なのが画像などの外部リソースです。HTTPSに入っていない外部リソースを参照しようとすると全てがSSLでないといった注意が出てしまいます。そこで使ってみたいのがCamoです。GitHubでも使われている小さな画像プロキシになります。#...

List

  • 2014/03/19

Iconion - 素敵なアイコン画像が簡単に作れちゃう!

これは素敵すぎる!アイコン画像の作成は大変です。小さな画像ながら、それを見て内容が理解できないとアイコンとしての意味がありません。最近ではIconfinder

List

  • 2014/03/18

Wireframe & UI Kit - 凄く利便性の高そうなワイヤーフレームキット

手早く、かついい感じにワイヤーフレームが作れそうですよ!Webサイトやスマートフォンアプリを作成する際にはワイヤーフレームを作ることが多くなってきました。そこで一旦アイディアをまとめて、それから実際に形にしていく訳です。そのためのツールもたくさんあります。しかしそういったワイヤーフレームツールの多くが画像を四角とバツ印...

List

  • 2014/03/10

ImagesLoaded – 画像の読み込み状態を管理するJavaScriptライブラリ

Webアプリケーションを作っていて、画像を読み込んだタイミングで何か処理を行いたいと思うことは多々あります。しかしこれといった良い方法がなかったように思います。そんな状況だからこそ紹介したいライブラリがImagesLoadedです。複数の画像を含めて、その読み込み状態を管理できる面白いライブラリです。!複数の画像の読み...

List

  • 2014/03/08

psdiff - GitHub上でPSDファイルの差分表示を可能にするスクリプト

デザイナーの方は覚えておくと便利そうですよ!GitHubでは様々なファイルの差分表示が行えます。その一つに画像があります。PNGやJPEGといった画像の差分をWebブラウザ上で行えます。これはデザイナーの方にとってかなり便利な機能ではないでしょうか。しかしデザイナーであればなんとしても対応して欲しいと思うのがPhoto...