AR Fashion in iOS

Have an iPhone or iPad on iOS 11 or 12? Apple's amazing augmented reality experiences are here for fashion industry.

AR Fashion in iOS

  • For ARKit We need to Xcode 9 or newer.Download Xcode from Apple Developer Website.
  • IOS 11 ARKit Compatibility for apps: 1st Check your device is compatible with Apple’s AR Platform.
    • iPhone 6s and 6s Plus
    • iPhone 7 and 7 Plus
    • iPhone SE
    • iPad Pro(9.7, 10.5 or 12.9) – Both first-gen and 2nd -gen
    • iPad(2017)
    • iPhone 8 and 8 Plus
    • iPhone X, XR, XS, XS-Max

What is ARKit

  • ARKit is Apple’s augmented reality(AR) development platform for ios devices.
  • Integrate iOS device camera and motion features to produce augmented reality experiences in your app or game.
  • Augmented reality(AR) describes user experiences that adds 2D and 3D elements to live view from the user’s camera.
  • ARKit allows developers to build high detail AR experiences for iPad and Iphone.
  • Environments captured through the device can have animated 3D virtual text, objects and characters added to them.
  • Using this technologies you can create many kinds of AR experiences,using either the back camera or front camera in IOS Devices.
  • ARKit can be divided into 3 layers. Those layers works together simultaneously.
    • Tracking
    • Scene understanding
    • Rendering

Tracking

  • World Tracking. A Configuration that monitors the IOS device’s position and orientation,while enabling you to augment the environment that’s in front of the user.
  • A 2D surface that ARKit detects in the physical environment.
  • The ARWorldTrackingConfiguration class tracks the device’s movement with 6 degrees of freedom specifically, the 3 rotation axes(roll, pitch, and yaw), and 3 translation axes(movement in x, y,
    and z).
  • World-tracking session also provide several ways for your app to recognize or interact with elements of the real-world scene visible to the camera.
    • Use PlaneDetection to find real-world horizontal or vertical surfaces, adding them to the session as ARPlaneAnchor objects.
    • Use detectionImages to recognize and track the movement of known 2D images,adding them to the session as ARImageAnchor objects.
    • Use detectionObjects to recognize known 3D objects, adding them to the session as ARObjectAnchor objects.

Scene understanding

  • The Scene means, ARKit analyzes the environment presented by camera’s view.
  • Then adjust the scene or provide information on it.
  • This is what enables the detection of all the surfaces in the physical world such as the floor or a flat surface.
  • Then it will allow us to place a virtual object on it.

Rendering

  • ARKit uses technologies to handle the processing of the 3D models and present in our scene such as:-
    • Metal
    • SceneKit
    • Or another third party tools

Start to Create a new Project for ARKit Apps

  1. Select Single View App.
2. Enter your Product Name, team name, organization Name and organization Identifier and Bundle Identifier.

3. Select the Language Swift / Objective – C.
4. Then Click on Next Button.
5. Then Select paths where your project is Store, then Click in create Button.

In this project we are scanning four Different images and adding the Nodes. Particular one Image Scan then Add One SCNNode. And using Different Gesture 3D object can Zoom in and Zoom out. And using the delete Button particular selected SCNNode is Remove form to View.

After Create Project

  • 1st go to main StoryBoard and Select View
  • Then go to the show the Identity inspector and change custom class selected ARSCNView
  • 2nd go to Info.plist and give the Camera Usage
    • In Key:- Add the Privacy – Camera Usage Description
    • Type:- Select the String
    • Value:- Add Message which you Display 1st time app Run
  • Connecting ARSCNView with ViewController
  • Go to ViewController.Swift File and then Import ARKit
  • import ARKit
  • Connecting the IBOutlet
  • Adding 3D object which you want
  • Go to Assets.xcassets Folder then Press the Right Click and adding New AR Resource Group
  • Then in AR Resources Folder drag the images which you want to scan
  • Set the view’s Delegate
  • Adding Delegate Method ARSCNViewDelegate
  • In viewWillAppear() method create an object for ARImageTrackingConfiguration class
  • Then Add delegate, nodeFor anchor method which help to Add SCNNode based on different image scanning
  • Here self.AddDummyNode() is the method to add the SCNNode

Output

Demo Video

References