Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
SUZURIの画像合成ハンズオンお冷グラス編
yuta25
June 17, 2021
Programming
2
460
SUZURIの画像合成ハンズオンお冷グラス編
https://pepabo.connpass.com/event/215058/
で発表した資料です
yuta25
June 17, 2021
Tweet
Share
Other Decks in Programming
See All in Programming
React NativeアプリにStorybook CSF3.0を導入しよう
texmeijin
0
160
Gitlab CIでMRを自動生成する
forcia_dev_pr
0
110
Keeping your team in top shape with the Gradle Enterprise API
runningcode
3
120
Improving Developer Experience Through Tools and Techniques 2022
krzysztofzablocki
0
410
What's new in Jetpack / I/O Extended Japan 2022
star_zero
1
170
How we run a Realtime Puzzle Fighting Game on AWS Serverless
falken
0
240
Web API連携でCSRF対策がどう実装されてるか調べた / how to implements csrf-detection on Web API
yasuakiomokawa
2
290
Angular‘s Future without NgModules: Architectures with Standalone Components @enterJS
manfredsteyer
PRO
0
180
Why Airflow? & What's new in Airflow 2.3?
kaxil
0
110
実践エクストリームプログラミング / Extreme Programming in Practice
enk
1
380
パターンマッチングを学んで新しいJavaの世界へ!Java 18までの目玉機能をおさらいしよう / Java 18 pattern matching
ihcomega56
3
380
Git・Git-Flowについて
nerusan_main
0
410
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
5
2.2k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
224
49k
Reflections from 52 weeks, 52 projects
jeffersonlam
337
17k
Embracing the Ebb and Flow
colly
73
3.4k
The Cult of Friendly URLs
andyhume
68
4.8k
VelocityConf: Rendering Performance Case Studies
addyosmani
316
22k
Stop Working from a Prison Cell
hatefulcrawdad
261
17k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
4
500
Fireside Chat
paigeccino
11
1.3k
Principles of Awesome APIs and How to Build Them.
keavy
113
15k
Scaling GitHub
holman
451
140k
BBQ
matthewcrist
74
7.9k
Transcript
1 SUZURIの画像合成 ハンズオン お冷グラス編 川合悠太 @ SUZURI事業部 2021-06-17 Pepabo Tech
Conference #15
2 2 #pepabotech
3 自己紹介 • 会社ではbudo(ぶどう)、SNS等ではyuta25というHN でいます ◦ https://twitter.com/yuta25 ◦ https://scrapbox.io/yuta25 •
2015年にSUZURIの開発に参加して以来、ずっと SUZURIを作り続けています ◦ 必要なことならなんでもやります! 3
4 4 自己紹介 最近の技術的興味→ 永遠のワナビー
5 アジェンダ 1. SUZURIにおける画像合成とは 2. ハンズオン 3. 今後の展望 5
6 6 先にやっておいてほしいこと • brew install imagemagick@6 curl • apt
insttall imagemagick curl ハンズオンで使います!それなりに時間かかるので先 にインストール始めといてください!!
7 SUZURIにおける画像合成 とは Section 1 7 SUZURIでやってる画像合成ってこういうものですよ〜という紹介
8 8 例. Tシャツ
9 9 SUZURIにおける画像合成(Tシャツ)
10 SUZURIにおける画像合成(Tシャツ) 10
11 • シワの感じ • 影 11 SUZURIにおける画像合成(Tシャツ)
12 12 例. ステッカー
13 13 SUZURIにおける画像合成(ステッカー)
14 14 SUZURIにおける画像合成(ステッカー)
15 15 SUZURIにおける画像合成(ステッカー) • 昔住んでた部屋(江戸川橋) ◦ 自部屋の郵便受けを撮影 • 自動で白フチ •
貼ってる面に合わせてパースをつける • 背景に合わせて明度を調整
16 16 例. GIF
17 17 SUZURIにおける画像合成(100TEE)
18 18 SUZURIにおける画像合成(100TEE) +
19 19 SUZURIにおける画像合成(100TEE) • 回転に合わせて画像にパースをつける • 表と裏で別の画像を合成 • 丁寧に一枚ずつ作る ◦
繋げるとGIFになる
20 ハンズオン Section 2 20 実際につくってみましょう
21 21 ハンズオン 手順URLはこちら!! https://scrapbox.io/suzuri/SUZURIの画像合成ハ ンズオンお冷グラス編 発表もそっちでやります!!
22 今後の展望 Section 3 22 Nodejs、Rust、そしてWASMへ
23 • Nodejs(express)の画像合成サーバー • ハンズオンでやったことをまったくそのままできる • https://github.com/aheckmann/gm ◦ Imagemagickのコマンドをラップして呼び出す 今後の展望
23 Nodejs
24 • ハンズオンでおわかりの通り、コマンド引数の多さやその副作用、パイプ多様に よるデバッグの難易度が高い • 画像合成自体はサーバーの外で行われるため、コントロール(リソース管理)が難 しい。 ◦ 重い処理と軽い処理でスレッド分けて、重い処理はリクエストなるべくブロッ クして直列処理、軽い処理はある程度並行処理みたいなのができると理想
◦ (がんばればできるのかもしれないけど...) 今後の展望 24 Nodejs(課題)
25 25 Rust 今後の展望 • Rustで新しい画像合成サーバーを作成中 ◦ 一部プロダクション環境で運用してます
26 26 Rust 今後の展望
27 27 Rust 今後の展望
28 28 Rust 今後の展望 • RustのFFIとMagicWand ◦ コマンド呼んで返りを待つのではなく、サーバー内でメモ リやスレッドをコントロールしていくことでメモリ効率やス レッド効率の改善(展望)
• サーバーはhyper • Rustが良い
29 29 Rust 今後の展望
30 30 そしてWASMへ 今後の展望 • サーバーサイドで画像合成ロジックができたらそ のままブラウザに持ってこれないかな? ◦ 圧倒的リソース削減&レスポンス速度の改善が可能 ◦
サーバーではMagickWandを動的リンクしているが静的リ ンクした上でそのままWASMに持ってこれるのか? ▪ 勉強中... https://doc.rust-lang.org/nomicon/ffi.html
31 31 まとめ
32 32 まとめ • SUZURでは画像合成で面白いことをしてきたし これからもしていきたい • 画像はネットにたくさんある。画像合成は手元で すぐにできる。楽しい。 •
Rustやってます
33 33 We are hiring!!!!!! https://recruit.pepabo.com/