post Image
iOSで超解像 – その1:waifu2xのMetal実装を試す

「超解像」(Super-resolution)とは、画像の解像度を高める技術のことです。100×100ピクセルの画像から200×200ピクセルの画像を生成する、というような話。

従来のリサイズ処理とはどう違うのか、はあとで見ていただくとして、これがiOSアプリ内で、しかもオンデバイス1リアルタイムに処理できるとなると、それによって享受できるメリットは計り知れません。なんといっても

通信量を削減できる!

という点は多くのアプリにとって嬉しいのではないかと思います。幅・高さ半分でファイルサイズが約4分の1、品質(解像度)は同等だとすると、熱くないですか?2 ネイティブアプリにおいて、サクサク感はUXの肝。モバイルデバイスの性能が著しく向上した現在、ボトルネックは通信、というケースは多いかと思います。また通信インフラが十分に整っていない国にもサービス展開するにあたって、通信周りをカリカリに最適化しているという話もちょくちょく耳にします。

というわけで、本記事では、この超解像技術をiOSで、しかもオンデバイスで利用する可能性について探っていきたいと思います。

waifu2x

2015年5月、こういう記事がバズりました。

このシンプルなタイトルにしてなんと2197ブックマーク。このwaifu2xとは、深層畳み込みニューラルネットワークによる二次元画像のための超解像システムです。

こちらでブラウザ上で試すことができます。

waifu2xのMetal実装

さて、私が現職に移ってMetalを勉強せねばとググっていたころ、なんと上述のwaifu2xをMetalで書いてみた、というスライドを発見しました。

おもしろそう、と思いつつ、試すことがないまま1年が過ぎ・・・今日やっと試してみました。

waifu2x-metalを試す

waifu2xのMetal実装はGitHubで公開されています。

こちらの実装はmacOS向けですが、処理内容、利用APIの観点でいうとiOSでも動くはず。

iOSに移植してみる前に、まずはその実力を見てみよう、ということで試してみました。

(入力画像: サイズ220×220)

comic_half.png


(macOSの「プレビュー.app」を用いた従来のリサイズ: サイズ440×440)

comic_従来拡大.png


(waifu2x-metalによるリサイズ: サイズ440×440)

comic_waifu2x.png


あれ・・・凄くないですか・・・?

Web記事だと閲覧環境によっては見づらいかもしれないので、拡大して並べてみましょう。左が従来手法、右がwaifu2xです。

比較.png

クオリティが段違いですね。。

写真で試す

イラストではなく、写真にも効果があるのでしょうか?試してみました。

比較2.jpg

(写真はitSnap様より特別に許可をいただき使用させていただきました3

左からそれぞれ従来手法、waifu2x-metalで元画像(540×810)を2倍に拡大(1080×1620) したものです。

拡大してみてみましょう。

比較2_2.png

写真にも絶大な効果があることがわかります。昨今の高解像度なスマホ上ではこの差はくっきり表れるかと思います。

つづく

次回、iOSへ移植して、動作させてみます。パフォーマンス改善についても触れます。Metalアドベントカレンダーのいち記事として書くので、興味のある方はぜひ購読してみてください。

(2017.12.17追記)

「その2」を書きました。

iOSに移植し「オンデバイスで」動作させました。「その3」ではパフォーマンス改善について書きます。

Metalの参考書籍

技術書「iOS 11 Programming」の、「第13章 Metal」を執筆しました。

書籍のタイトルにはiOS 11とありますが、Metalについては新機能の紹介だけではなくて、基礎からじっくり解説しています。Metalの章だけで37ページもあり、日本語ではこれだけのまとまったMetalの解説はレアかと思います。

  • 13.1 はじめに
  • 13.2 Metalの概要
  • 13.3 Metalの基礎
  • 13.4 MetalKit
  • 13.5 Metal入門その1 – 画像を描画する
  • 13.6 Metal入門その2 – シェーダを利用する
  • 13.7 Metal入門その3 – シェーダでテクスチャを描画する
  • 13.8 ARKit+Metalその1 – マテリアルをMetalで描画する
  • 13.9 ARKit+Metalその2 – MetalによるARKitのカスタムレンダリング
  • 13.10 Metal 2
  • 13.11 Metalを動作させるためのハードウェア要件

他の章も他著やネットではなかなか得られない濃い情報が詰まっているので、気になった方はぜひサンプルPDFもあるので見てみてください。

PEAKSのサイトにて電子書籍・紙の書籍ともに販売されています。

iOS 11 Programming

iOS 11 Programming

  • 著者:堤 修一,吉田 悠一,池田 翔,坂田 晃一,加藤 尋樹,川邉 雄介,岸川克己,所 友太,永野 哲久,加藤 寛人,
  • 発行日:2017年11月16日
  • 対応フォーマット:製本版,PDF
  • PEAKSで購入する

執筆を担当したARKit、Metalの章の詳細、あるいは全体的なおすすめポイントは以下の記事にも書きました。


  1. ここでは、WebAPI経由などではなく、そのiOSデバイスのCPU/GPUで処理する、という意味で使っています。 

  2. こういうメリットだとHEIFを思い浮かべる方もいると思いますが、超解像技術はファイルフォーマットとは別の話であって、共存こそすれ競合はしないので、今回は横においておきます。 

  3. dealforestさんありがとうございます! 


『 Swift 』Article List
Category List

Eye Catch Image
Read More

Androidに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

AWSに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Bitcoinに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

CentOSに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

dockerに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

GitHubに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Goに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Javaに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

JavaScriptに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Laravelに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Pythonに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Rubyに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Scalaに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Swiftに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Unityに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Vue.jsに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

Wordpressに関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。

Eye Catch Image
Read More

機械学習に関する現役のエンジニアのノウハウ・トレンドのトピックなど技術的な情報を提供しています。コード・プログラムの丁寧な解説をはじめ、初心者にもわかりやすいように写真や動画を多く使用しています。