Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Phương pháp sử dụng AR để nắm bắt từ công nghệ và ý nghĩa(dotFes2018 VIETNAM Da Nang)

Takuto Onishi
September 09, 2018

Phương pháp sử dụng AR để nắm bắt từ công nghệ và ý nghĩa(dotFes2018 VIETNAM Da Nang)

This is a presentation sheet on dotFes2018VIETNAM Da Nang.
https://www.dotfes.jp/2018vietnam/schedule_detail.html#detail_s3

Những Frame work có thể thực hiện AR một cách đơn giản như ARKit của iOS, ARCore của Android tăng lên,các ví dụ sử dụng kỹ thuật AR cũng đã tăng lên.
Trong phiên này, sẽ xem xét cách sử dụng AR bằng cách hiểu AR từ cả hai khía cạnh của công nghệ và ý nghĩa.

Links
・る https://r-u.co.jp/
・@024t910 https://twitter.com/024t910

・ARKit Examples https://arkit.r-u.co.jp/
・[Example 1]Suikawari https://arkit.r-u.co.jp/entertainment.html
・[Example 2]Runner https://arkit.r-u.co.jp/sport.html
・[Example 3]AR Cleaner https://arkit.r-u.co.jp/utility.html

・[Example 1 "Body-Measuring"] https://arkit.r-u.co.jp/measuring.html
・[Example 2 "Control Robot"] https://arkit.r-u.co.jp/robotics.html
・[Example 3 "Avatar-System"] https://r-u.co.jp/?page=anicon
・[Example 4 "Hologram"] https://www.youtube.com/watch?v=F6dbYRRzjio

・AR Quick Look Gallery https://developer.apple.com/jp/arkit/gallery/

Takuto Onishi

September 09, 2018
Tweet

More Decks by Takuto Onishi

Other Decks in Technology

Transcript

  1. Nắm bắt ý nghĩa và kỹ thuật
    Phương pháp sử dụng AR
    Công ty cổ phần Ru
    Takuto Onishi
    2018.09.09 @ dotFes 2018 VIETNAM DaNang

    View full-size slide

  2. Tự giới thiệu bản thân

    View full-size slide

  3. Công ty cổ phần Ru
    Takuto Onishi

    (Đại diện phụ trách công ty cổ phần Ru).
    Contents Planner / Technical Director.
    Application, Web, Digital Installation,

    Product Prototyping etc…
    Twitter @024t910

    View full-size slide

  4. WORKS
    Xin quý khách vui lòng truy cập vào URL bên
    dưới để biết thêm thông tin chi tiết: 

    https://r-u.co.jp/

    View full-size slide

  5. 4VZOHIⓄWề"3

    View full-size slide

  6. Vậy AR là gì?
    Augmented
    Reality
    - Hiện thực được phóng đại -

    View full-size slide

  7. Lịch sử của AR
    1965
    1993
    1994
    1999
    2007
    2008
    2009
    2011
    Ultimate Display

    (Ivan Sutherland)
    KARMA

    (Columbia Univ.)
    NaviCam

    ( J. Rekimoto and K. Nagao)
    FLARToolKit

    (@saqoosh)
    iPhone

    (Apple)
    Sekai Camera

    (Tonchidot)
    Vuforia

    (PTC)
    2017
    ARKit

    (Apple)
    ARCore

    (Google)
    2014
    Tango

    (Google)
    2016
    Hololens

    (Microsoft)
    2018
    Magic Leap One

    (Magic Leap)
    AR Quick Look
    WebXR

    (Mozilla)
    Kinect

    (Microsoft)
    iPhone X
    ARToolKit

    (Kato, H., Billinghurst, M.)
    NyARToolKit
    NyARToolKit

    (@nyatla)
    Information
    Overlay
    Marker Based AR
    AR
    for WEB
    AR Library
    SmartPhone
    Geolocation
    (GPS + commpass)
    Mobile AR

    Library
    IR Tracking
    AR Infrastructure
    Native AR
    Library
    Pokemon GO

    (Niantic)

    View full-size slide

  8. Những hình thức tương tự
    VR MR XR
    Virtual Reality Mixed Reality Extended Reality

    View full-size slide

  9. VR MR XR
    Virtual Reality Mixed Reality Extended Reality
    ỞUIờJ㶟JểNOÁZ
    AR
    đang là công cụ được Output thông tin sử
    dụng hiện tại bằng kỹ thuật kỹ thuật số.

    View full-size slide

  10. Thiết kế trải nghiệm AR

    View full-size slide

  11. :ếVUốRVBOUSọOHOIấULIJTVZOHIⓄWềLếIPạDI"3
    kỹ thuật position tracking hướng dẫn
    quan hệ vị trí với hiện thực và user
    người dung.
    Kỹ thuật xuất CG lên màn hình
    AR

    View full-size slide

  12. Nhờ sự tiến bộ của tốc độ và kỹ thuật nên giới hạn vị trí
    của user người dùng đã được xóa bỏ.
    1965
    1993
    1994
    1999
    2007
    2008
    2009
    2011
    Ultimate Display

    (Ivan Sutherland)
    KARMA

    (Columbia Univ.)
    NaviCam

    ( J. Rekimoto and K. Nagao)
    FLARToolKit

    (@saqoosh)
    iPhone

    (Apple) ηΧΠΧϝϥ

    (Tonchidot)
    Vuforia

    (PTC)
    2017
    ARKit

    (Apple)
    ARCore

    (Google)
    2014
    Tango

    (Google)
    2016
    Hololens

    (Microsoft)
    2018
    Magic Leap One

    (Magic Leap)
    AR Quick Look
    WebXR

    (Mozilla)
    Kinect

    (Microsoft)
    iPhone X
    ARToolKit

    (Kato, H., Billinghurst, M.)
    NyARToolKit
    NyARToolKit

    (@nyatla)
    Information
    Overlay
    Marker Based AR
    AR
    for WEB
    AR Library
    Geolocation
    (GPS + commpass)
    Mobile AR

    Library
    IR Tracking
    AR Infrastructure
    Native AR
    Library
    Pokemon GO

    (Niantic)
    SmartPhone

    View full-size slide

  13. Sự biến đổi quan hệ vị trí
    Cố định display (hiển thị):

    User (người dùng) và marker (vật ghi hình) hoạt động cùng nhau.
    Cố định vật ghi hình:
    User (người dùng) và display (hiển thị) hoạt động cùng nhau
    Không có marker (vật ghi hình):

    User (người dùng) và marker (vật ghi hình) hoạt động tự do cùng nhau.
    Không có marker (vật ghi hình):

    user (người dùng) và marker (vật ghi hình) hoạt động tự do riêng biệt.

    View full-size slide

  14. Thiết kế thể nghiệm hoạt động thân thể
    ?
    sự kiện hướng đến display (hiển thị)
    phóng đại những sự việc

    đang diễn ra trong thực tế
    Từ “sự kiện hướng đến display (hiển thị)” 

    thì việc lưu tâm đến đặc tính của position tracking
    (hiệu chỉnh vị trí)

    trong “phóng đại những sự việc đang diễn ra trong
    thực tế” là cực kỳ quan trọng.

    AR Effect

    View full-size slide

  15. Our Examples
    https://arkit.r-u.co.jp/

    View full-size slide

  16. Example 1
    https://arkit.r-u.co.jp/entertainment.html

    View full-size slide

  17. Example 2
    https://arkit.r-u.co.jp/sport.html

    View full-size slide

  18. Example 3
    https://arkit.r-u.co.jp/utility.html

    View full-size slide

  19. .ấVDIốUDủBUIJếULếUIểOHIJệN
    Sự việc căn cứ trên hành động của
    người dùng trên thực tế. 



    Kéo dài thực tại của bản thân.
    ?
    Kéo dài thực tại của bản thân.

    User Action

    AR Effect
    Trả lại phản ứng ngược (reaction)
    với hình ảnh bản thân user
    (người dùng) ở quá khứ.

    View full-size slide

  20. Mấu chốt của thiết kế trải nghiệm
    ?

    User Action

    AR Effect
    Không phải là xuất ra cái gì
    mà mang đến trải nghiệm
    như thế nào mới quan
    trọng!

    AR Effect

    View full-size slide

  21. Để sản sinh ra cảm giác tốt thì hãy
    để ngón tay bạn trên máy ảnh!
    Example 1

    View full-size slide

  22. Để cảm nhận thực tế tốc độ
    bước chạy thì người dùng vừa
    chạy vừa sử dụng nội dung!
    Example 2

    View full-size slide

  23. Example 3
    Để biết được vị trí hiện đã
    dọn dẹp thì hãy hiệu chỉnh vị
    trí đã dọn dẹp trong thực tế.

    View full-size slide

  24. Tương lai của AR

    View full-size slide

  25. Đặc trưng của kỹ thuật AR hiện tại
    Nhận thức vị trí
    đối tượng sàn nhà tường Camera

    View full-size slide

  26. Ngoài những nhận thức nói trên

    thì tự bản thân mình phải tự làm!
    Thiết bị có thể sử dụng ở đó là thiết bị nhận
    thức đối tượng và thiết bị cảm ứng vật lý.

    View full-size slide

  27. Công nghệ làm phát triển hơn kỹ thuật AR
    ʜ
    ʜ
    OpenCV dlib
    YOLO CoreML MLKIt OpenPose
    ʜ
    VR
    Tracker
    Sensor
    Module
    ʜ
    FaceTracking

    GPS

    Compass
    Acceleration

    Gyro

    Microphone
    ʜ
    Nhận thức hình ảnh
    Khám phá hình ảnh
    Thiết bị cảm ứng vật lý
    4NBS1IPOF 0O%FWJDF4FOTPS

    LiDAR

    View full-size slide

  28. Example 1 “Body Measuring”
    ARKit
    OpenCV
    +
    3DWorld Scale / Screen Pixel Scale

    = Target Scale Per Pixel
    FieldOfView Angle

    for iOS Camera
    Distance from Target
    Floor
    https://arkit.r-u.co.jp/measuring.html

    View full-size slide

  29. Example 2 “Control Robot”
    ARKit konashi
    + +
    Roomba
    Send Tracking Data
    Control Motor
    Through a Serial Port
    https://arkit.r-u.co.jp/robotics.html

    View full-size slide

  30. Example 3 “Avatar System”
    ARKit
    FaceTracking
    Motion Sensor Controller
    +
    +
    "OJ$PO ˜8POEFSMFBHVF*OD

    6OJUZ$IBO ˜6OJUZ5FDIOPMPHJFT+BQBO6$-

    https://r-u.co.jp/?page=anicon

    View full-size slide

  31. Example 4 “Hologram”
    VIVE Tracker
    Micro Projector
    +
    "TTPDJBUF$PNQPOZ,PLZP*OD
    https://www.youtube.com/watch?v=F6dbYRRzjio

    View full-size slide

  32. )ơOOữB UươOHMBJDủB"3
    Display Handheld-Display

    (Smart Phone)
    Wearable

    (Glasses / Goggles)
    Retinal

    Projection
    Thiết bị ngăn
    bức xạ mặt trời
    Kính mắt
    display Hiển thị
    display

    View full-size slide

  33. Giá cả interaction giảm xuống
    Không cần những hành vi như giương tay
    nắm bắt hay xóa bỏ thì chúng ta vẫn có thể
    nhận được thông tin.

    View full-size slide

  34. Biến đổi của vật chứa thông tin AR
    Việc nhận thức hướng về đâu trở thành nhân
    tố hiệu chỉnh vị trí quan trọng.
    Vật chứa hình ảnh của máy ảnh cố định.

    Vật chứa những hướng máy ảnh.

    Vật chứa những thứ hướng về thị tuyến.

    View full-size slide

  35. .ộUUIếHJớJMÁNHJBU㶙OHUSảJOHIJệNWÁ
    UIÔOHUJODIỉCằOHDÂDIOIÌO

    View full-size slide

  36. ARCore thực tế là đối ứng với IOS.
    Nếu chỉ với chức năng chia sẻ thì chúng tôi
    khuyên dùng sử dụng ARCore+Unity.
    ARKit ARCore
    or ?

    View full-size slide

  37. ARKit ARCore
    Object Detection 

    FaceTracking
    Support Android
    Plane Detection(Horizontal & Vertical)
    Position Tracking
    Share World Tracking DataɾMulti User

    (ARWorldMap / Cloud Anchors)
    Image Tracking (Image Marker AR)
    Lighting Estimation

    View full-size slide

  38. "32VJDL-PPL(BMMFSZ
    https://developer.apple.com/jp/arkit/gallery/

    View full-size slide

  39. Reference source
    • Page6.

    ɾFile:Augmented-reality.jpg - Wikimedia Commons https://commons.wikimedia.org/wiki/File:Augmented-reality.jpg

    Description:Монгол: Augmented Reality Технологийг IKEA брэнд үйл ажиллагаандаа ашиглаж байна

    Date:20 March 2016 Source:Own work Author:OyundariZorigtbaatar
    • Page7.

    ɾ֦ுݱ࣮ײٕज़ͷকདྷల๬(2012 ྐྵຊ७Ұ)

    ɾThe Sword of Damocles - Head Mount Display(1964, Ivan Sutherland)

    ɾKARMA(1993, Columbia University Computer Graphics and User Interfaces Lab Steven Feiner, Blair MacIntyre, Dorée Seligmann)

    https://graphics.cs.columbia.edu/projects/karma/karma.html

    ɾ"The World through the Computer:Computer Augmented Interaction with Real World Environments”,Proceedings of UIST’95(1995 J. Rekimoto and K. Nagaoʣ

    ɾʮ߈֪ػಈୂʯʮి೴ίΠϧʯͷੈքΛ࣮ݱʂ - ARToolKitΛ࢖֦ͬͨுݱ࣮ײϓϩάϥϛϯάʢ2007 ޻ֶφϏ ڮຊ ௚) http://kougaku-navi.net/ARToolKit/

    ɾ͍·ɺΈ͓͖͍ͯͨ΢ΣϒαΠτ ୈ2ճ(2009 gihyo.jp - Lançamento ) http://gihyo.jp/design/serial/01/website-pickup/0002

    ɾiPhone (Original)(2015 iMore) https://www.imore.com/iphone-2g

    ɾηΧΠΧϝϥऴྃͷ͓஌Βͤ……։ൃݩɾ಴ஐυοτʮ໨ࢦͨ͠ࢥ૝͸ఘΊ͍ͯͳ͍(2013 TechCrunch Japan) https://jp.techcrunch.com/2013/12/17/the_end_of_sekai/

    ɾXbox & Kinect - Stories https://news.microsoft.com/presskits/xbox/

    ɾGoogle expands Project Tango tablet sales to more countries(2015 ZDNet) https://www.zdnet.com/article/google-expands-project-tango-tablet-sales-to-more-countries/

    ɾMicrosoft Hololens https://www.microsoft.com/en-us/hololens

    ɾMagic Leap One: Creator Edition https://www.magicleap.com/magic-leap-one

    ɾWebXR Viewer on iOS App Store(Mozilla) https://itunes.apple.com/us/app/webxr-viewer/id1295998056?mt=8

    ɾAR Quick Look brings augmented reality to Safari in iOS 12 (2018 apple insider ) https://appleinsider.com/articles/18/07/13/ar-quick-look-brings-augmented-reality-to-safari-in-ios-12

    ɾʰPokémon GOʱͷ༡ͼํ(2017 Niantic) https://www.pokemongo.jp/howto/play/

    ɾiPhone X - Appleʢ೔ຊʣhttps://www.apple.com/jp/iphone-x/

    View full-size slide

  40. Reference source
    • Page8.

    ɾͦ͜ʹ੢ӝ͸͋Δͷ͔͍ʢ2017 ෌Ӭܟͱ૿ా༤ଠͱେ੢୓ਓʣhttps://www.youtube.com/watch?v=d5w8pYwOBoU

    ɾMicrosoft Hololens https://www.microsoft.com/en-us/hololens

    ɾMinority Report made today's technology possible, says production designer Alex McDowell (2015 dezeen) https://www.dezeen.com/2015/11/06/minority-report-sci-fi-movie-
    steven-spielberg-future-of-technology-predictions-possible-production-designer-alex-mcdowell/
    • Page11

    ɾFile:Augmented-reality.jpg - Wikimedia Commons https://commons.wikimedia.org/wiki/File:Augmented-reality.jpg

    Description:Монгол: Augmented Reality Технологийг IKEA брэнд үйл ажиллагаандаа ашиглаж байна

    Date:20 March 2016 Source:Own work Author:OyundariZorigtbaatar

    ɾAppleɺARKit 2Λൃද - Apple (೔ຊ) https://www.apple.com/jp/newsroom/2018/06/apple-unveils-arkit-2/
    • Page25.

    ɾScanning and Detecting 3D Objects | Apple Developer Documentation https://developer.apple.com/documentation/arkit/scanning_and_detecting_3d_objects?language=objc

    ɾARKit By Example — Part 2: Plane Detection + Visualization https://blog.markdaws.net/arkit-by-example-part-2-plane-detection-visualization-10f05876d53

    ɾPart 1: ARKit Wall and Plane Detection for iOS 11.3 | Collective Idea https://collectiveidea.com/blog/archives/2018/04/30/part-1-arkit-wall-and-plane-detection-for-ios-11.3

    View full-size slide

  41. Reference source
    • Page26.

    ɾVIVE Tracker https://www.vive.com/jp/vive-tracker/

    ɾCMU-Perceptual-Computing-Lab/openpose: OpenPose: Real-time multi-person keypoint detection library for body, face, and hands estimation https://github.com/CMU-Perceptual-Computing-Lab/
    openpose

    ɾYOLO: Real-Time Object Detection https://pjreddie.com/darknet/yolo/

    ɾML Kit | Google Developers https://developers.google.com/ml-kit/

    ɾdlib C++ Library http://dlib.net/

    ɾOpenCV library https://opencv.org/

    ɾ௒Ի೾ڑ཭ηϯαʔɹ̝̘ʵ̨̧̌̐: ηϯαҰൠ ळ݄ిࢠ௨঎-ిࢠ෦඼ɾωοτ௨ൢɹhttp://akizukidenshi.com/catalog/g/gM-11009/

    ɾXbox & Kinect - Stories https://news.microsoft.com/presskits/xbox/

    ɾiPhone X - Appleʢ೔ຊʣhttps://www.apple.com/jp/iphone-x/

    ɾଌҬηϯα σʔλग़ྗλΠϓ/UST-10/20LX ঎඼ৄࡉ | ๺ཅిػגࣜձࣾhttps://www.hokuyo-aut.co.jp/search/single.php?serial=16
    • Page29

    ɾ800γϦʔζʛϩϘοτ૟আػ ϧϯό | ΞΠϩϘοτެࣜαΠτ https://www.irobot-jp.com/product/800series/index.html

    ɾkonashi - A physical computing toolkit for iPhone, iPod touch and iPad http://konashi.ux-xu.com/
    • Page30.

    ɾWonderleague corp. http://www.wonderleague.co.jp/
    • Pge31.

    ɾVIVE Tracker https://www.vive.com/jp/vive-tracker/

    ɾPicoPro – Celluon Inc. https://www.celluon.com/picopro-3/

    View full-size slide