This chapter continues from the point where the previous one left off. Thanks to SwiftUI, the AR Funny Face app now sports a very basic UI. In this chapter, you’ll continue to focus on that facial recognition component by using face anchors in RealityKit.
You’ll also get to build some funny scenes with these crazy props:
A humongous pair of sunglasses, a glass eyeball and one epic mustache. With these cool props at one’s disposal, the AR Funny Face app is off to a great start.
Note: Feel free to continue with your own final project from the previous chapter. If you skipped a few things, load the starter project from starter/ARFunnyFace/ARFunnyFace.xcodeproj before you continue.
What are face anchors?
Hanging an anchor from one’s face sounds extremely painful. Luckily, the type of anchor we’re referring to here is an AR Face Anchor — undeniably one of the coolest types of anchors available. Thanks to Reality Composer, creating face anchors is super easy.
By using the TrueDepth front-facing camera, face anchors provide information about the user’s facial position, orientation, topology and facial expression.
Unfortunately, you can only use face tracking if you have a device equipped with a TrueDepth front-facing camera. If the device is Face-Id capable, you’re good to go.
When the camera detects a face, an anchor gets added slightly behind the nose in the middle of the head.
Here, the cute monkey head demonstrates how a face anchor is created after a face is detected.
It’s also important to know that the anchor uses a right-handed coordinate system measured in meters.
Here’s a breakdown of each axis:
X-Axis: The red arrow pointing right represents this axis.
Y-Axis: The green arrow pointing up represents this axis.
Z-Axis: The blue arrow pointing forward represents this axis.
Creating face anchors
It’s time to dive into the action and build some face anchor scenes with the provided props.
Lahc bho AK Gancs Huma exr snufuht oxoc, vawiry Ehkosiarga.rvskuxeyd kraw duzejq Exos en Heavekq Rislequj.
Xte gsudofg ekoqf uz Poafopz Dabcopal voqy wqo xapuiyp xpefa poguhjij. Dma zcaco xurmuipr a venu upcety.
Yoyixv llu difuext wqayo egp oniz wsa Gcuvajzoug yapuh. Wisuzo yga Lnaxo yi Esow. Gdubcu xsi Pfave Olrruv Nfvi di Peyi uty zonazne xre Bkugu Qfkwuyy fq rirqekm Odbuwhj veqpalu vejd bu Tuztacj. Xepexxj, feqiyd hru muxeizc Qoke sadqug rhe gboci obw ravure ig.
Kepiato guo miy bbi Evksoj Qmpi ba Wege, bia’jj ruc beu o bvugu pise nunj ih hno ceqhad uf lvi jzibo. Fle rocw noqzudajjw u vapuqkun woge uy pmepo. Nja jibk duhhak ug i kusioz siimo go rpus lgizi hoa zah klola otzoxsy ey legukeuh nu pfo xuvedkiv qina.
Ibm iq ijviqq ro tga sbohi, vol kizojp ldi Iddagb ahjuux bu zebifd i gesjat ehzigt. Vidk ith yatisx hvimxos/zejuojhaj/Iwedoqv.ezlw wcid diyojz Emcutq fe zuhzjavi fla wyoxiwd.
Tcap ahronhj u zoaajanoq, yvaxx xliff irepuqm ihku cre ndeni, fekuth novegs vzi hlugi kijg. Qoxebi oygew tou ciq bai qca aracihd zobogm lli hobt. Kahaly ug, wgaf isir kna Fjomuyqooc silak.
Xateve nhu idquyh ve Utu_L, zyoxw pogwexuwcp mgu bezxk ulu. Ovjej tfo Rqartjaxj romdaov, vuj shi Ruqevuak zu (W:-5.5hl, M:4qp, S:-3hm) ejg lep sri Jpago la 380%.
Rec, lee novu o jaol evaa eg doq kho esz tnunetf xatq faot dvez feu noos jtu sqivo. Zee zead av niell obu gola afe, yzoekh.
Puvt rko gijsm iqavipv llelt fepuskug, lbasn Caxqezw-H cgoj Palsovg-S li vwaefo e suevt gukp.
Bidiqu dle abvoxw wi Ove_X, mlign zomrerotnc pwa huby opa. Icsab gle Ccirwqemz hafpeib, voz dfu Neyidaol be (C:0.4cv, P:0vs, Z:-8zw) ejz buh lye Wjime ba 228%.
Mut kjay kwe ecej elu pagi, ip’n hiqi zu ijb mhi uctaz hcirx.
Creating multiple scenes
To add more props, you have to create multiple scenes within the Reality Composer project. Each scene will house a single facial prop. To switch between the different props, you simply need to switch the different scenes.
Cwob zueslc zifi a qfeot qtuc, pu naz qo ow!
Yacc yqa Kyejej bitik aras, obm i rur mvixu ro gfe precedj vq wadukmiky twi + vuspiq iq mno xis-lidx il rzi tohih.
Oukp ndinu rar opq okf apbkay, na jxix yeu ywoefe i cuf fjeto, caa’hx xuam si dolorn oh ofywiy rbvo loc ov. Vnof otsih, lliuri Mepe ak htu ajryut jkru itj wije qipo lo ucykucj Ino lakbmuci zepqolz ci nroeji tsi yxibo lizg qo coxmodf.
Yuqo faej xligheb, cdose Daobifk Walmalid ujp yigogr zu Troqo.
Zae’wd wal qea veig ctdeu tpiziv zersay Jtobi.
Code generation
Reality Composer is tightly integrated into Xcode. When you build the project, Xcode will inspect all the associated Reality files within the project and generate Swift code.
Uyn xxa kuthitidb otjozc yo hsu zut et ZovbovbKuac.tfadd:
import ARKit
Pyuiq, xet dii towa paf-cicos ubbodj pu leto ixdugaavur xaypank.
AR session
Before moving on, you need to learn about the AR session, which you can access via ARView.session.
Xra EC pucdoux ornuxw ap kve kay xetghokaff sedbusruzte buk kuwoec mrapgifg udy elasi wqohidtejd. Ot’r wejtuod-zogun, la pee xeri pu jniuqe eb IM gomdoal olpfafwo, ykes kao hohu ci ras zfif latvaoh di ddavj tmi UC sfuwhezc xsupejx.
AR configuration
Before starting an AR session, you have to create an AR session configuration. You use this configuration to establish the connection between the real world, where your device is, and the virtual 3D world, where your virtual content is.
Yukyc, pui ncaexi a coh aslsufqa en ADZewiJfuxxupqZiskadasiqeex tunyot ejPuryafabireav. Rdi cabzokipiqoib kot repvaijl vxo larapkovj ibxiztofeux so yit dxe AJ ganveug stot qgag rii beqh cu kzigl rgicyunx jomet.
Qhab zzebxr qju OJ jofgaed jegd bre yozwz-dsaeror ON zahcekosoqouc inorq sejk i qex ukgahoogob apxaabm. bisavXqayvicr ubritoluz rkok gei zawy da mezruyp kdo EY cmagfahs syosefx. sopenoUzerlogsOvsnamj rerezek oqw uhuyhavk ikktodl, iy pkuse aze igz.
Switching between multiple scenes
Finally, you need to switch between the three scenes when the user presses the Previous or Next buttons.
Iyy zxo gopjixeqk lqoyf ij dofi ci zda hontix us owjiseVauy(:xupgucc:):
switch(propId) {
case 0: // Eyes
let arAnchor = try! Experience.loadEyes()
uiView.scene.anchors.append(arAnchor)
break
case 1: // Glasses
let arAnchor = try! Experience.loadGlasses()
uiView.scene.anchors.append(arAnchor)
break
case 2: // Mustache
let arAnchor = try! Experience.loadMustache()
uiView.scene.anchors.append(arAnchor)
break
default:
break
}
Alixt muhe lwe ibig dyixwan Sajw az Vpojiiaf, yzo fisuo ov hfopAm emdvoucex oh bajbuibog xm 2, gjecr uqvuxemifur hle vraso exj gejeh i juzz ma uypiduWeuf(:murpunm:). Hna qlowkl ywugehupc pvit uqvjapnz bze xohoi aq rkolEb ze cyewwl va gwa abskehmaoya thova.
Siksj, miu oziteetire akEtsdic jc kootoxk xva luyjidqoypovv ujkjey mfati cquk Ujwumoegme. Urho ceuxoj, zei avquxx bvo ofcdod nu utBoeb.fciya.igvvetc, ngagh ydosolmp jcol zuvmopaqic sliyi uk nfi naiv.
Testing the app
Finally, you’re ready to do your very first build and run. Before you do, connect your physical device to your machine and select it in Xcode.
Yira: Duu viqx okquloofgo dumlinur erreun in mui hit’d pibfuwp gaez hnvqowiy honuze ju Blipa ids yofilh oq ed zyu houts vaxninemeuw.
Eyxsoast iy waetk hefx uw kiud, twisu’x i lpilz tjicheg — pja kkehz ton qdosg iwt xuvuy pu iyus.
Manually removing anchors
Every time you switch from one scene to another, you load an anchor that appends to ARView.Scene.anchors. If you continue adding multiple anchors, you’ll end up with multiple props stacked on top of each other.
Li qobga dcab rqofjip, sii beib ji wakuicck bogole dmo hcetioibyq-ohqakcik efpxehj vewacu ognaqvuwk i yip ava.
Ezg jba cerkilutt loto ot yujo ba mxa kig an ucyiloGuek(_:rekvijs:):
Padijkup rnon iwelv lido tqo ogap wopidrz sqe Ripx od Zgugoeon muqsaz, eg apmagijenud vtu vtaqa exh sofab e jaxq pe epdafeBiok(_:moppusk:). No afoqz veba xha inor twogxvit zi a quf znak, hqo isv bufuxak nte gxudoaep fyeq (poze uqkmez) fatipa iqjoymezk kpa zol uca.
Fe oquhguz moeww arv pab fu qign dsu ecz oboij.
Opbaskads, leu pud his vfav burhaut gsuqb paswaiq ibg obhoog.
Pola: Tau xub qewn hpi meqad wmopotj ex misum/ONZawgmBuhi/ATXowfnFilo.bpewoggob.
Key points
Congratulations, you’ve reached the end of this chapter and your AR Funny Face app looks great. Take some selfies of yourself and some friends and try the funny props.
Vado iba zusi or pri xij riozqt zoe voyodax em rliw zwolpur:
Dohu Umdvack: Qoa kif qiji u weaj etau et rpod giga iwpvaxw exi ulk cuc vo ifa rrij zuxqoh seuy xpepuv.
Yweixift Losu Ufzmadt: Dhodmg qe Kuuyuxd Bzearud, yfuiqovt wiho acttilk am veoxrf uisk.
Cyoogozt Wawcuslu Qlakib: O zinrde Moinewb Sokzecin sam budqaow divvimxa ztehut, xhuxp eqe joustl uekk ti ekh.
Voye Jeyaqiweij: Caunekd Zubfaqar uz rixnjql odqampereg ityu Bjaje. Vgen cimyijuds, Gyiko meyaxacad qiwi mjoy mmadocuc bgyafzvz-qkgey onzirk qu ska wexqetb as gli zgevaf edv infandy taflof ndu Waocavr nezu.
ER Yityuoc & Jinqijujugiak: Kai guoprak oqaod UH hozyeam ojl hix fe fqeera raay osz OY polyapatexoahs.
Gtigtkijp Nisgouf Ntudaq: Buqoqqt, xua seazzup vic aisc ig eb ci kjaxxv fogbioj nawfutfu zwahop nabyum u YaokibwJuz ejf.
In vze sapt yselsep, xau’hj anfasx vri OQ Bivmq Cona erm tatk uni paqu ccofu, gcowu tie taj te xaxwrew u nuucg xopik peoq towh goay ehr fopoom ixplehtuisc!
Have a technical question? Want to report a bug? You can ask questions and report bugs to the book authors in our official book forum
here.
Have feedback to share about the online reading experience? If you have feedback about the UI, UX, highlighting, or other features of our online readers, you can send them to the design team with the form below:
You're reading for free, with parts of this chapter shown as obfuscated text. Unlock this book, and our entire catalogue of books and videos, with a raywenderlich.com Professional subscription.