Augmented Reality Tutorial No. 32: User Interface for Augmented Reality using Unity3D and Vuforia (Incorporating Different Scenes)

posted in: Augmented Reality | 30

Little by little we’re moving to

In this Augmented Reality Tutorial a simple User Interface was created using buttons. Different scenes were incorporated in one app. In each scene it is possible to load next or previous scene with different 3D Character.

Download # Unity3D (download and install it, if you don’t have it already) (*.exe file)

Unity3D is also available to download from here

Download # Download and Import Unity3D Extension v5.0.5 (*.unitypackage file)

Unity3D extension is also available to download from here (there might be even be newer version)

Download # Print Euforia of Beauty Logo to Augment Different Scenes and Create the Tracker  (*.jpg file)

Download # You Can Use Already Created Tracker Based on Euforia of Beauty Logo  (*.unitypackage file)

Download # Download the Script for Buttons to Change the Scale, Position and Rotation of 3D Model Character (*.cs file)

Download # Download Whole User Interface for Augmented Reality Tutorial Project Files (the result to test it)  (*.rar file)

30 Responses

  1. herllycules

    hello, i tried to make rotation button on adroid
    but its always looping
    the only way to stop it, is hold the button
    but if i release the button, its looping again

    • admin

      Most likely you did something differently than I showed in tutorial.

  2. dani

    how can i make the button when click on it, the model will duplicate/added and another button that will remove the model..

    • admin

      Hello, this is easily done, but I won’t start coding for you here. I suggest you google Unity3d C# code on that.

  3. orkan

    Is it possible to turn the buttons into virtual ones that can be pressed with your hand like you demonstrated in a another tutorial (No. 19)? I don’t succeed when I try to merge the code UI from this tutorial and the one of Virtual(Vuforia) buttons…

      • orkan

        I thought it’s just because I’m a lame coder… Is there a way to extend interactions with virtual buttons (Vuforia-Unity)? For instance, jumping to a next scene or playing a video?
        Btw, thanks for all your tutorials, they are very helpful.

          • orkan

            I will try until I make it, thank you very much!
            There’s one more issue no one could answer at vuforia’s forum: is it possible to trigger a whole environments in which the viewer can dive?
            Should I use extended tracking (the triggered image would be much bigger than the marker) and keep the image target active even when tracking is lost (can I just disable this function to keep it on even if I turn the device/camera in other direction)?
            I’ve read about different plug-ins like Unified Coordinate System that could help building augmented environments… Could you point a direction I should go?

  4. Saniah

    May I ask, what if there is two model in 1 scene? Because your tutorial only have 1 model in 1 scene. Then, what happened to the tag? Can I tag both of my model as Model?

    • admin

      Sure, why not, if you want to apply the same function.

      • Saniah

        I have tried set both character same tag name as Model, but it does not work.

        What happen is only 1 character that scale up and scale down when I click the button, the other one did not happen anything.

        I’m creating a scene that has two character, one person performing CPR and the other person is the patient. I need both character to scale up and scale down at the same time when the button is clicked.

        • admin

          Firstly try it out on 2 simple cubes (tag it), try to scale it and tell me the result.

  5. Jayam

    I tried your Money augmented tutorial no:28!! that was amazing!!

    How can i use user interface in android app?

  6. Nqb

    Hi, I did the same way as u did and everything worked. Just that the UI buttons will be on screen even when the image is not tracked. The UI Buttons would just stay at the last place it was tracked. I wanted to do when the image is tracked the buttons appear where the should and when is not tracked it would disappear. Please help. Thanks in advance.

    • admin

      Hello. Put your Canvas (with buttons) inside Image Target.

      • Matt

        Hi first thank you for your job ! sure i have the same problem i did everything but the UI buttons are on the screen doesnt matter, if canvas are in or out ImageTarget the result has same the ui button are always on screen.
        Please help. Thanks you.

  7. TBLK1

    Hey could you suggest any tutorials for using real world marker input instead of virtual buttons? The plan is to make an application which reads the position of a real world marker and responds based on it’s hovering over a real world button which is printed on the paper page instead of virtual buttons.

    • admin

      I don’t have such tutorial in my list. But I would know how to code it.

  8. Kevin

    I got same problem with Nqb, and i already put the canvas with buttons inside image target, but the result still same, the button still popped out when the marker is lost

  9. Muhammad Catubig

    I tried this tutorial and successfully implemented but when I moved away the camera the UI stays on my screen.

      • Muhammad Catubig

        I tried that and it didn’t work. I also tried to the Augmented Reality_UI Gameobject inside the image target but still no luck.

  10. sailormewn

    i tried this. everything was smoothly done, but when i run and click the scale button, my model not scale up. pls help me 🙁

  11. yasaman

    hi dear,
    i build AR application that have image and button and video, i want to add one image and button that fix in screen and independent from detect image target.could you please help me?
    when i build such this thing the button in my image target not work.

Leave a Reply

Your email address will not be published. Required fields are marked *