SUZURIの画像合成ハンズオンお冷グラス編

https://pepabo.connpass.com/event/215058/ で発表した資料です

Transcript

1. 1 SUZURIの画像合成
 ハンズオン
 お冷グラス編
 川合悠太 @ SUZURI事業部 2021-06-17 Pepabo Tech Conference #15
2. 2 2 #pepabotech
3. 3 自己紹介 • 会社ではbudo(ぶどう)、SNS等ではyuta25というHN でいます ◦ https://twitter.com/yuta25 ◦ https://scrapbox.io/yuta25 • 2015年にSUZURIの開発に参加して以来、ずっと SUZURIを作り続けています ◦ 必要なことならなんでもやります！ 3
4. 4 4 自己紹介 最近の技術的興味→ 永遠のワナビー
5. 5 アジェンダ 1. SUZURIにおける画像合成とは 2. ハンズオン 3. 今後の展望 5
6. 6 6 先にやっておいてほしいこと • brew install imagemagick@6 curl • apt insttall imagemagick curl ハンズオンで使います！それなりに時間かかるので先 にインストール始めといてください！！
7. 7 SUZURIにおける画像合成 とは Section 1 7 SUZURIでやってる画像合成ってこういうものですよ〜という紹介
8. 8 8 例. Tシャツ
9. 9 9 SUZURIにおける画像合成(Tシャツ)
10. 10 SUZURIにおける画像合成(Tシャツ) 10
11. 11 • シワの感じ • 影 11 SUZURIにおける画像合成(Tシャツ)
12. 12 12 例. ステッカー
13. 13 13 SUZURIにおける画像合成(ステッカー)
14. 14 14 SUZURIにおける画像合成(ステッカー)
15. 15 15 SUZURIにおける画像合成(ステッカー) • 昔住んでた部屋(江戸川橋) ◦ 自部屋の郵便受けを撮影 • 自動で白フチ • 貼ってる面に合わせてパースをつける • 背景に合わせて明度を調整
16. 16 16 例. GIF
17. 17 17 SUZURIにおける画像合成(100TEE)
18. 18 18 SUZURIにおける画像合成(100TEE) +
19. 19 19 SUZURIにおける画像合成(100TEE) • 回転に合わせて画像にパースをつける • 表と裏で別の画像を合成 • 丁寧に一枚ずつ作る ◦ 繋げるとGIFになる
20. 20 ハンズオン Section 2 20 実際につくってみましょう
21. 21 21 ハンズオン 手順URLはこちら！！ https://scrapbox.io/suzuri/SUZURIの画像合成ハ ンズオンお冷グラス編 発表もそっちでやります！！
22. 22 今後の展望 Section 3 22 Nodejs、Rust、そしてWASMへ
23. 23 • Nodejs(express)の画像合成サーバー • ハンズオンでやったことをまったくそのままできる • https://github.com/aheckmann/gm ◦ Imagemagickのコマンドをラップして呼び出す 今後の展望 23 Nodejs
24. 24 • ハンズオンでおわかりの通り、コマンド引数の多さやその副作用、パイプ多様に よるデバッグの難易度が高い • 画像合成自体はサーバーの外で行われるため、コントロール(リソース管理)が難 しい。 ◦ 重い処理と軽い処理でスレッド分けて、重い処理はリクエストなるべくブロッ クして直列処理、軽い処理はある程度並行処理みたいなのができると理想 ◦ (がんばればできるのかもしれないけど...) 今後の展望 24 Nodejs(課題)
25. 25 25 Rust 今後の展望 • Rustで新しい画像合成サーバーを作成中 ◦ 一部プロダクション環境で運用してます
26. 26 26 Rust 今後の展望
27. 27 27 Rust 今後の展望
28. 28 28 Rust 今後の展望 • RustのFFIとMagicWand ◦ コマンド呼んで返りを待つのではなく、サーバー内でメモ リやスレッドをコントロールしていくことでメモリ効率やス レッド効率の改善(展望) • サーバーはhyper • Rustが良い
29. 29 29 Rust 今後の展望
30. 30 30 そしてWASMへ 今後の展望 • サーバーサイドで画像合成ロジックができたらそ のままブラウザに持ってこれないかな? ◦ 圧倒的リソース削減&レスポンス速度の改善が可能 ◦ サーバーではMagickWandを動的リンクしているが静的リ ンクした上でそのままWASMに持ってこれるのか? ▪ 勉強中... https://doc.rust-lang.org/nomicon/ffi.html
31. 31 31 まとめ
32. 32 32 まとめ • SUZURでは画像合成で面白いことをしてきたし これからもしていきたい • 画像はネットにたくさんある。画像合成は手元で すぐにできる。楽しい。 • Rustやってます
33. 33 33 We are hiring!!!!!! https://recruit.pepabo.com/