Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
google/mediapipe で始めるARアプリ開発/iOSDC2020
Search
noppefoxwolf
September 21, 2020
Programming
1.7k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
google/mediapipe で始めるARアプリ開発/iOSDC2020
noppefoxwolf
September 21, 2020
More Decks by noppefoxwolf
See All by noppefoxwolf
High performance GIF playback/iOSDC25
noppefoxwolf
1
600
Spice up your notifications/try!Swift25
noppefoxwolf
3
840
iOSの隠されたAPIを解明し、開発効率を向上させる方法/iOSDC24
noppefoxwolf
2
1.3k
今から理解するApp Intentエコシステム/WWDC24Recap
noppefoxwolf
0
74
既存アプリをvisionOS対応してリリースした話/visionOS LT vol5
noppefoxwolf
0
230
UIのブラックボックスを探る/iOSDC23
noppefoxwolf
3
5.1k
CoreGraphicsでドット絵を描こう/iOSDC22
noppefoxwolf
0
3.2k
ランタイムデバッグのススメ/iOSDC21
noppefoxwolf
1
5.6k
モバイルファーストなアプリを作るためにvearがしたこと/xRDCC
noppefoxwolf
0
200
Other Decks in Programming
See All in Programming
PHP に部分適用が来るぞ!……ところで何それ?おいしいの? #phpcon / phpcon-2026
shogogg
0
200
The Bowling Game- From Imperative to Functional Programming - Part 1
philipschwarz
PRO
0
330
SLOをサービス品質の共通言語にするために 取り組んできたこと
wakana0222
0
500
act1-costs.pdf
sumedhbala
0
230
Embedded SREと共に達成した会員管理システムのAWS移行 - SRE NEXT 2026 ランチスポンサーセッション
niftycorp
PRO
1
2.6k
SREは、MCPとSRE Agentをこう使え!
kazumax55
0
150
20260623_Loop Engineeringで自分の分身の問い合わせBotを作る
ryugen04
0
220
Claude Opus 4.6以後の受託開発エンジニアの変化(Claude Code開発ノウハウ大公開スペシャルbyクラスメソッド)
iidatakuma
1
760
yield再入門 #phpcon
o0h
PRO
0
380
型も通る、synthも通る、それでも危ない 〜AIのCDKの権限とコストを機械で検証する〜 / It Passes Type Checks, It Passes Synth Checks, but It’s Still Risky — Automatically Verifying Permissions and Costs in AI’s CDK —
seike460
PRO
1
310
PHP初心者セッション2026 〜生成AIでは見えない裏側を知る:今だからLAMPを通して仕組みを学ぶ〜
kashioka
0
430
継続モナドとリアクティブプログラミング
yukikurage
3
600
Featured
See All Featured
Navigating the moral maze — ethical principles for Al-driven product design
skipperchong
2
420
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.4k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.4k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
23k
Kristin Tynski - Automating Marketing Tasks With AI
techseoconnect
PRO
0
290
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.5k
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.5k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
63
55k
Designing Powerful Visuals for Engaging Learning
tmiket
1
450
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
8.2k
The agentic SEO stack - context over prompts
schlessera
0
840
Unsuck your backbone
ammeep
672
58k
Transcript
google/mediapipe Ͱ࢝ ΊΔARΞϓϦ։ൃ ϨΪϡϥʔτʔΫʢ20ʣ noppe 1
ର • ARΞϓϦʹڵຯ͕͋Δ • τϥοΩϯάʹڵຯ͕͋Δ • ػցֶश͔Βͳͯ͋͘Γ·ͤΜɻ 2
noppe • גࣜձࣾσΟʔɾΤψɾΤʔ • ιʔγϟϧϥΠϒΞϓϦ Pococha • ݸਓ։ൃऀ • vear
ReplayKitͰεϚϗ͔Β৴Ͱ͖Δ VTuberΞϓϦ • iOSDC18,19 • ͖ͭͶ͕͖ 3
4
5
noppe • גࣜձࣾσΟʔɾΤψɾΤʔ • ιʔγϟϧϥΠϒΞϓϦ Pococha • ݸਓ։ൃऀ • vear
ReplayKitͰεϚϗ͔Β৴Ͱ͖Δ VTuberΞϓϦ • iOSDC18,19 • ͖ͭͶ͕͖ 6
mediapipe ͱʁ 7
mediapipe github.com/google/mediapipe • ॲཧ(Culculator)Λܨ͛ͯύΠϓϥΠϯʢGraphʣΛߏங͢Δ πʔϧ • ओʹը૾ॲཧͷύΠϓϥΠϯߏஙʹΘΕΔ • MLॲཧΛࠞͥࠐΉࣄ͕ग़དྷΔ 8
9
10
mediapipe Culculatorɺ࣮ࡁΈͷ͑Δ • LuminanceCalculator RGBΛड͚औΓɺًը૾Λग़ྗ͢Δ • SobelEdgesCalculator SobelϑΟϧλΛ͔͚ͨը૾Λग़ྗ͢Δ ...etc 11
12
࣮ࡁΈͷGraph ͜ΕΒͷ࣮͙͢ʹ͑Δios ࠓ͜ΕΛ͏ྲྀΕΛղઆ ios Ұ෦iOSͰ࣮͕ͳ͍ͷ͋Δ 13
ΞδΣϯμ • άϥϑͷϏϧυ • ARKitͱͷ࿈ܞ • Ͱ͖ΔࣄɾͰ͖ͳ͍ࣄ 14
άϥϑͷϏϧυ 15
github.com/noppefoxwolf/HandTracker ࠓճ͏ιʔείʔυ 16
Graph • ߏஙͨ͠GraphόΠφϦͱͯ͠Ϗϧυ ͢Δ͜ͱ͕Ͱ͖Δ • όΠφϦΛObjC͔Β͏࣮͕͋Δͷ ͰɺͦΕΒΛͬͯϑϨʔϜϫʔΫΛ࡞ Δࣄ͕Ͱ͖Δɻ • ࠓσϞͰհͨ͠ϋϯυτϥοΧʔ
ΛϑϨʔϜϫʔΫͱͯ͠Ϗϧυ 17
18
άϥϑͷϏϧυ ϏϧυπʔϧΛͬͯϏϧυΛߦ͏ • bazelbuild/bazel (ϕΠθϧ) • KubernetesTensorFlowͰ࠾༻ Track E -
Ryo Aoyama BazelΛར༻ͨ͠Micro Modular Architecture 19
άϥϑͷϏϧυ bazelͷΠϯετʔϧεΫϦϓτམͱ͖࣮ͯͯ͠ߦ͢Δ͚ͩ curl -LO "https://.../bazel-3.2.0-installer-darwin-x86_64.sh" chmod +x "bazel-3.2.0-installer-darwin-x86_64.sh" ./bazel-3.2.0-installer-darwin-x86_64.sh 20
άϥϑͷϏϧυ XcodeͰϏϧυ͕Ͱ͖Δtulsi - bazelbuild/tulsi tulsi BuildPhaseScriptͰbazelΛୟ͚ͩ͘ͳͷͰɺඞਢͰͳ͍ 21
άϥϑͷϏϧυ tulsiϏϧυεΫϦϓτୟ͚ͩ͘ͰΠϯετʔϧͰ͖Δʢཁbazelʣ git clone
[email protected]
:bazelbuild/tulsi.git ./build_and_run.sh 22
ͦͷ΄͔ඞཁͳͷ • Xcode • ࣌ؒ • ωοτϫʔΫ 23
ϏϧυͷྲྀΕ 1. ϑϨʔϜϫʔΫͷίʔυΛॻ͘ 2. BUILDϑΝΠϧʹՌͷใґଘੑͳͲΛهड़͢Δ 3. bazelͰbuild͢Δ 4. framework͕ग़དྷ্͕Δ 24
ϑϨʔϜϫʔΫͷίʔυ Λॻ͘ 25
ϑϨʔϜϫʔΫͷίʔυΛॻ͘ 1. binarypbΛಡΈࠐΜͰMPPGraphΛ࡞Δ 2. MPPGraphΛ։࢝͢Δ 3. MPPGraphʹը૾ΛૹΔ 4. delegateͰ݁ՌΛड͚औΔ 26
27
binarypbΛಡΈࠐΜͰMPPGraphΛ࡞ Δ + (instanceType) init { NSURL* url = [NSURL
...@"hand_landmarks.binarypb"]; NSData* data = [NSData dataWithContentsOfURL:url options:0 error:nil]; mediapipe::CalculatorGraphConfig config; config.ParseFromArray(data.bytes, data.length); self.graph = [[MPPGraph alloc] initWithGraphConfig:config]; } 28
MPPGraphΛ։࢝͢Δ GraphͰར༻͢Δ֤छίϯϙʔωϯτͷॳظԽ͕ߦΘΕΔ - (void)start { [graph startWithError: nil]; } 29
MPPGraphʹը૾ΛૹΔ - (void)sendPixelBuffer:(CVPixelBufferRef)pixelBuffer { [self.mediapipeGraph sendPixelBuffer:pixelBuffer intoStream:@"input_video" packetType:MPPPacketTypePixelBuffer]; } 30
delegateͰ݁ՌΛड͚औΔ - (void)mediapipeGraph:(MPPGraph*)graph didOutputPacket:(const ::mediapipe::Packet&)packet fromStream:(const std::string&)streamName { const auto&
timestamp = packet.Timestamp().Value(); const auto& landmarks = packet.Get<::mediapipe::NormalizedLandmarkList>(); NSArray *landmarkObjects = [self toObject: landmarks]; [delegate didOutputLandmarks: landmarkObjects]; } 31
BUILDϑΝΠϧॻ͘ 32
BUILDϑΝΠϧͱ bazelͰϏϧυ͢ΔϑΝΠϧґଘؔΛهड़ͨ͠ϑΝΠϧ 33
objc_library( name = "HandTrackerLibrary", hdrs = ["HandTracker.h"], srcs = ["HandTracker.mm"],
data = [ "hand_tracking:hand_tracking_mobile_gpu_binary_graph", ... ], deps = [ "//mediapipe/objc:mediapipe_framework_ios", "//mediapipe/objc:mediapipe_input_sources_ios", "//mediapipe/graphs/hand_tracking:mobile_calculators", "//mediapipe/framework/formats:landmark_cc_proto", ], ), ) 34
35
bazelͰϏϧυ͢Δ $ bazel build mediapipe/iosdc:HandTracker 36
framework͕ग़དྷ্͕Δ githubʹஔ͍͓͖ͯ·ͨ͠ https://github.com/noppefoxwolf/HandTracker 37
ARKitͱͷ࿈ܞ 38
ARKitͱͷ࿈ܞ ARKitͷ্༷ग़དྷͳ͍ࣄΛmediapipeͰิ͏͜ͱͰɺදݱྗΛղ ์Ͱ͖Δ • AR্ۭؒͷΦϒδΣΫτΛखͰૢ࡞͢Δ • ݕग़ͨ͠ΦϒδΣΫτͷԣʹΩϟϥΫλʔΛஔ͢Δ • إͷࠎ֨Λิਖ਼͠ͳ͕Β৭Λม͑Δhair hair
Hair Segmentationݱঢ়iOSඇରԠͰ͕͢ 39
ARKitͱͷ࿈ܞΞϓϦ։ൃ ͜ΜͳͷΛ࡞Γ·͢ 40
41
ARKit࿈ܞͷྲྀΕ 1. ARFrame͔ΒcaptureImageΛऔΓग़͢ 2. PixelFormatΛม 3. TrackerૹΔ 4. DelegateͰ݁ՌΛड͚औΔ 5.
RealityKitͷϘλϯΛ্ԼɾΧϯτΛ දࣔ 42
ARFrame͔ΒcaptureImageΛऔΓग़͢ • captureImage = Χϝϥ͔Βͷө૾ arSession.delegate = self ... //
ARSessionDelegate func session(_ session: ARSession, didUpdate frame: ARFrame) { let captureImage: CVPixelBuffer = frame.capturedImage } 43
PixelFormatΛม ը૾σʔλ͕ͲͷΑ͏ʹ֨ೲ͞Ε͍ͯΔ͔Λද͍ͯ͠Δ • ARKitͰYCbCrܗࣜ • mediapipeBGRAͷΈΛड͚औΕΔ →มͷඞཁ͕͋Δ 44
kCVPixelFormatType_32BGRA 1ϐΫηϧ32bitͰදݱ͢ΔϑΥʔϚοτ B:FF G:00 R:00 A:FF → 45
kCVPixelFormatType_420YpCbCr8BiPl anarFullRange • 2ຕͷY(8bit)+CbCr(16bit)ͷΈ߹ΘͤͰ1ϑϨʔϜΛදݱ͢Δ ϑΥʔϚοτ • ܰྔͳͷͰϏσΦσʔλͰΘΕΔ͜ͱ͕ଟ͍ 46
YCbCr͔ΒBGRAͷม • Accelerate • vImage • Metal • MSL GPUΛ͏Metalͷํ͕ߴ
47
YCbCr͔ΒBGRAͷม ࣍ͷܭࢉࣜͰม͕Ͱ͖Δ R = Y + 1.402 × Cr G
= Y - 0.344136 × Cb - 0.714136 × Cr B = Y + 1.772 × Cb A = 1 48
BlueDress YCbCr͔ΒBGRAʹߴίϯόʔτ͢ΔϥΠϒϥϦ https://github.com/noppefoxwolf/BlueDress 49
TrackerૹΔ let captureImage = frame.capturedImage let bgraCaptureImage = converter.convertToBGRA(captureImage) handTracker.send(bgraCaptureImage)
50
DelegateͰ݁ՌΛड͚औΔ ؔઅͷҐஔX,Y,ZͰऔΕ·͢…͕ɺੈք࠲ඪܥͰແ͘ X,Y: Screen࠲ඪܥ Z: खट͔ΒͷԞߦ͖ ͔͠औΕ·ͤΜɻ೦ʂ 51
52
RealityKitͷϘλϯΛ্ԼɾΧϯτΛ දࣔ ࠓճਓࠩ͠ࢦͷԆઢ্ʹEntity͕͋ΕɺisPressΛtrueʹ͢Δ func handTracker(_ handTracker: HandTracker!, didOutputLandmarks landmarks: [Landmark]!)
{ let indexFinderPosition = landmarks[8] let screenLocation: CGPoint = ...(indexFinderPosition) self.isPress = arView .entities(at: screenLocation) .contains(where: { $0.id == self.buttonEntity.id }) } 53
RealityKitͷϘλϯΛ্ԼɾΧϯτΛ දࣔ private func press() { self.scene.notifications.press.post() count += 1
changeText("\(count)") } 54
55
56
Ͱ͖ΔࣄͰ͖ͳ͍ࣄ 57
ؾʹͳΔͱ͜Ζ • HandTrackerΧϝϥ͔Βͷڑ͕औΕΔΘ͚Ͱͳ͍ࣄʹҙ →IrisͰԞߦ͖͕औΕΔ • ֤ؔઅͷճసऔΕͳ͍ →ࣗͰܭࢉͯࣗ͠વʹݟͤΔ͕ඞཁ • ϑϨʔϜϫʔΫαΠζ͕·͊·͊Ͱ͔͍ →100MB͘Β͍
58
͍͍ͱ͜Ζ • ࣮ࡁΈͷάϥϑ͕ඇৗʹ࣭͕ߴ͍ • OSS • ϚϧνϓϥοτϑΥʔϜ 59
ͬͯΈ͍ͨ͜ͱ • HairSegmentationͳͲΛiOSʹରԠ͍ͯ͠ͳ͍ͷԿނͳͷ͔ௐ ͍ͨ • NSObjectΛܦ༝͠ͳ͚ΕߴԽ͕ΊΔͷͰ • ϥϯυϚʔΫ͚ͩΛग़ྗ͢ΔάϥϑΛ࡞ͬͯΈ͍ͨ 60
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝ ·ͨ͠ 61