タグ

pngと画像に関するiwwのブックマーク (11)

  • 「耳すま」のお父さんが語りかける「ドット絵あるある」の世界 Twitterで画質劣化させないための画像投稿術

    限られた色数で温かみのあるイラストを表現するドット絵。そのドット絵をうっかりJPG形式でTwitterに投稿すると、せっかくの色味が損なわれてしまうという「ドット絵職人あるある」を表現した投稿が話題になっています。 ジブリ作品「耳をすませば」のワンシーンをドット絵で再現した銀親(@ginoyahutaushi)さん。投稿時に「雫、そのドット絵ってのは、JPGで保存してはいけないほど繊細なのかい?」という作中セリフのパロディ文を添えて、一見同じのドット絵画像を投稿しました。投稿された画像は2枚。 その2枚を見比べてみると、1枚目の画像はきれいな発色なのに対し、2枚目は画質が劣化していてところどころ色がくすんで見え、せっかくのドット絵が魅力半減となっています。これこそがドッター殺しとなる、「JPG投稿」という罠。 こちらがきれいなほう 画像が荒くなっている方。拡大するとよく分かる あまり知られ

    「耳すま」のお父さんが語りかける「ドット絵あるある」の世界 Twitterで画質劣化させないための画像投稿術
    iww
    iww 2018/03/20
    『1カ所でも透過情報(アルファチャンネル)が含まれていると、Twitter側では圧縮をせず、元画像のまま載せることが可能になります』 そんなテクが
  • はてなフォトライフに PNG をアップロードすると 64bit RGBA に変換されて無駄にファイルサイズが増える話 - しばやん雑記

    気が付いたきっかけは、フォトライフにアップロードした画像をダウンロードしたことでした。 Snipping Tool を使ってキャプチャした画像は常に 32bit PNG になるので、それを 24bit にしてからアップロードしようと思い、実際に反映されてるか確認を行いました。 はてなフォトライフの縮小処理おかしい気がする— しばやん (@shibayan) 2017年7月4日 200KB の PNG が 880KB になった— しばやん (@shibayan) 2017年7月4日 Windows のプロパティを表示すると、何故か 24bit だった画像が 64bit になってる。そんな仕様あったか— しばやん (@shibayan) 2017年7月4日 最初の方は Windows のプロパティ表示に問題があるのかなと思ってましたが、この辺りからはてなフォトライフの処理について疑うようになり

    はてなフォトライフに PNG をアップロードすると 64bit RGBA に変換されて無駄にファイルサイズが増える話 - しばやん雑記
    iww
    iww 2017/07/06
    マジかよと思って確認したけど、自分の場合ファイルサイズが大きくなってるファイルはいっこも無かった。 あーオリジナルサイズじゃなくて縮小表示画像のファイルが超ビッグになってる。 縮小の仕方がくそ下手っぽい
  • Trianglify.io · Low Poly Pattern Generator

    Trianglify.io is a tool for generating low poly triangle patterns that can be used as wallpapers and website assets.

    Trianglify.io · Low Poly Pattern Generator
  • 日記 | ヨモツネット

    blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTMLSVG 混在でき

    iww
    iww 2015/12/08
    マジックナンバー
  • JavaScript を PNG に圧縮する | Yomotsu net

    JavaScript を PNG に圧縮するツールを作りました。JS_Packer demoscene は最近 WebGL を使ったものも多くなってきています。 demoecene は基的に ローカルにファイルとして存在しているものを使う そのファイル容量は 1 バイトでも少ないほうがいい (容量制限がある分野がある) という文化です。そして JS ファイルを圧縮する手法の一つに、JS を PNG 画像にして、それをデコードする、という手法が存在します。 JS の性質JS のコードは基的にアスキー文字の集まりです。アスキーコードは、小文字/大文字のアルファベット、数字、スペースといった 128 種類しか存在しません。 PNG8 の性質8 ビット PNG は 256 種類の色をパレットに持っています。 PNG は可逆圧縮(ロスレス)形式の画像です。圧縮しても失われるデータはありません。

    JavaScript を PNG に圧縮する | Yomotsu net
    iww
    iww 2015/05/14
    JavaScript系の人たちはいつも突拍子もないアイデアをサクッと実装してしまってすごい
  • 結城友奈はサンタである - kivantium活動日記

    一、前書きはきちんと 2014年も終わりに近づき冬シーズンのアニメも佳境を迎えるなか、いよいよクリスマスがやってきます。絶望的な戦いに臨む讃州中学勇者部のみなさんにもクリスマス気分を味わってもらいたいですね。というわけで、勇者部のみなさんにサンタ帽をかぶってもらおうと思います。 一、なるべく手動にしない サンタ帽を写真にかぶせるだけならGIMPなりPhotoshopなりを使えば簡単にできるわけですが、21世紀を生きる人間がいつまでも手動に頼るわけにはいきません。なるべく自動化したいものです。幸いなことにアニメ顔の顔認識は簡単にできるので自動でサンタ帽をかぶらせてあげるプログラムを書くことができそうです。ではやってみましょう 一、よくググって、よく見つける サンタ帽のフリー素材はいくつかあったので、サンタクロースの帽子の無料イラストから使います。帽子をかぶらせる素材は顔がすべて認識できるとい

    結城友奈はサンタである - kivantium活動日記
  • borderで背景画像を表示する border-image - シンプルシンプルデザイン CSS

    border-imageは、一枚の画像で9スライスのデザインが実現できちゃうという優れもの。 残念ながらIE8以下で適用できず、実際にはまだ使えないかなーという印象。プログレッシブエンハンスメントを適用してうまく見せるのは結構難しそうだなー、という感触。 とはいえせっかく調査したので備忘録。 border-image を使ったサンプル 仕様 border-image-source none(初期値)/ url(画像パス) border-image-slice 100%(初期値)/ 数値 / ○○% / 数値 fill / ○○% fill border-image-width 1(初期値)/ ○○px / ○○% / auto border-image-outset 0(初期値)/ 数値? px? border-image-repeat stretch(初期値)/ repeat / rou

    iww
    iww 2014/12/03
    cssで9スライス(9パッチ)
  • GIFアニメ生成にImageMagickはオワコン、情強は高速なGraphicsMagickを使う - 海峡

    大した話ではないけれど、GIFアニメをコマンドラインから作るならGraphicsMagickが便利なので共有します。 MP4の動画ファイルからGIFアニメを作ろうとすると、まずffmpegで動画を画像に分割してそれからimagemagickでGIFに結合するという方法があります。 % ffmpeg -i hoge.mp4 -r 2 %04d.png % convert *.png hoge.gif複数枚の画像をimagemagickでGIFに結合するのが実は結構時間がかかるため煩わしいことが多いです。場合によっては、数十秒かかったりする。 ImageMagickのfork版であるGraphicsMagickを使うと高速にGIFアニメを生成することができます。 GraphicsMagickのほうが3~4倍速い GraphicsMagickを使えばImageMagickよりも3~4倍高速にGI

    GIFアニメ生成にImageMagickはオワコン、情強は高速なGraphicsMagickを使う - 海峡
    iww
    iww 2013/05/19
    冒頭のgifがLinuxから見れない / Windowsからもまともに見れなかった
  • MODULE.JP - PNGとGIFとJPEGにコメントを埋め込む

    mod_ezweb_downloadモジュールに絡んで、携帯端末むけの著作権保護機能(?)について遊んでました。というわけでPNG,GIF,JPEGにコメントを埋め込む場合についての簡単なメモとテスト実装。 これらの情報は遊びで調べて実装した物なので、著しく正確さを書いている可能性があります。また画像のpixelサイズの参照や操作、といった話題は含まれませんので注意。 それにしてもKDDIの"kddi_copyright=on"で転載(?)を抑制する、というまるで著作権のあるコンテンツは一切転載不許可 by KDDIと語っているようなネーミングセンスがスゴいな。あ、いやべつに私はKDDIが嫌いとかそーいうわけじゃないですよ。はい。 PNGのファイルは、1つのシグネチャと、複数のチャンクが並ぶ構造です。 SIGNATURE(8 byte); CHUNK(12 + data byte) x n

  • PNG画像を自力で読む

    このサイトではPNG画像をあちこちで使ってます。 まあ、一番よく使ってるのはJpegですが。 プログラムを組むときも、この二つはよく使われますね。 なんせどちらも無料、かつ使い勝手のいいライブラリ (libpng、libjpeg) が用意されてますし。 てなわけで、普通はPNG画像を自分のプログラムに組み込みたいなら libpng を使えばいいんですが、ちょいと思い立って自力で組んでみることにしました。 D言語ならコードを劇的に減らせますし、MMX化したきゃインラインアセンブラも付いてます。慎重に組めば若干の高速化も期待できるかも。 なによりファイルフォーマットを理解するのは、けっしてマイナスにはなりません。 機能を必要最小限にとどめておけば、たった1,000行程度のコードでPNG画像を読むことが可能ですぞえ。 もっとも実際にネットで配布するようなソフトウェアには安全なライブラリを使った方

  • Android チュートリアル:9patchで画像を作って綺麗にする方法 | TechBooster

    Android SDKにはNinePatchを簡単につくるツール「draw9patch」が付属しています。9patchはビットマップイメージを高品位に拡大するためのフォーマットです。縮小には対応していませんが、1つの画像でいくつものサイズに対応できるため、効率的にアプリケーションサイズを圧縮できます。 右の画像ではTextViewの背景画像に9patchを適応したpngイメージを指定しています。2つのTextViewは改行の都合でアスペクト比が異なっていますが、9patchを使うことで背景画像のゆがみを抑制できています。 9patchまとめ リソースを節約しつつ高品位な背景が作れる 命名規則は画像のフォーマットに併せて最後尾に.9を付与(.9.pngなど) 画像の左と上の端1pxは拡大範囲を表す 画像の右と下の端1pxはコンテンツの範囲を表す(オプション) 以下は9patchの適用例(画像

  • 1