Preview a Quantum Visualizer App on a Device

Using the Quantum App, you can view the front-end prototype of a project on a device. You can run any action attached to a form or widget such as navigating from one form to another, executing events of the forms, and applying a skin to a widget.

You can make changes to your project and then incrementally preview those changes, you can see those changes reflected in a local preview of the app on your device. For the incremental preview, you must set the Quantum App on your device to do so, as described later in this topic.

IMPORTANT: Incremental preview is supported only for local preview of projects. For previews published to the cloud, the project must do a full Preview > Publish; incremental previewing is currently not available for the cloud.

This section provides the following documentation on Previewing an App:

• Prerequisites

  After the prerequisites have been met, you are ready to generate a preview of the app and then view it on a device.

• Generate a Preview of the App

  Once you have generated the preview, you can view it on your device via the cloud or locally. For more information, click the option you want:

  • Preview an App Locally: Runs the Quantum App for a prototype by using the device on which you have Quantum Visualizer installed, to act as the host for displaying the app on your device. You can connect your device either by using a wireless connection or, starting on Quantum Visualizer version 7.3, via a USB connection.
    • Preview an App by using a USB connection
    • Preview an App by using a Wi-Fi connection
  • Preview an App on the Cloud: Runs the Quantum App for a prototype that is published to the cloud.
  • Access Marketplace: Runs the Temenos Forge in a browser to access components available. You or those you invite to access the preview on the cloud can preview the Temenos Forge components.

Prerequisites

To preview an app, you must meet the following prerequisites:

• Create a Quantum account.
• Install the Quantum App on Your Device

Create a Quantum Account

You must have a Quantum account to use the App Viewer feature of the Quantum App. If you do not have a Quantum account, you can create one by using one of the following methods:

• Self-Registration: Go to the Quantum website and create a new account.
• Receive an Invitation: You receive an invitation to register with Quantum from an existing Quantum user.

Self-Registration

To self-register:

1. Navigate to the Quantum Cloud registration site.

   The Create your Quantum Cloud Account page appears.

2. Provide the required details, and then click Create your account.

   A message appears confirming that your request for registration is accepted.

3. You will receive an email from the Quantum Accounts with an activation link. Click Activate My Quantum Account.

   The Activate Your Account page appears.

4. Provide the required details, and then click Create Cloud.

   Your account is activated, and the Quantum Cloud dashboard appears.

Receive an invitation

When the owner (or a member) of a Quantum account who has the necessary permissions to invite a user sends an invitation from manage.kony.com. The invitee receives an email asking them to register for Quantum cloud.

When the owner of a Quantum account sends an invite to allow you access to the cloud, you receive an email with a Quantum account registration link.

To create a Quantum account after receiving an invitation:

1. In the invitation mail, click Accept Invitation.

   The Accept Invitation page appears.

2. Provide the required details, and then click Accept invitation.

   Your account is activated, and the Quantum Cloud dashboard appears.

Install the Quantum App on Your Device

The Quantum App allows you to view the complete prototype designed on Quantum Visualizer on your mobile or tablet device.

You can download theQuantum App on your

• Android devices from the Google Play Store.
• iOS devices from the Apple App Store.

Android

To install the Quantum App:

1. Tap Applications, and then tap Google Play. Google Play Store opens.
2. Search for Temenos Quantum.
3. From the search results, tap Temenos Quantum.
4. Tap Install.
   Type your login credentials, if requested.
5. Tap the Applications folder, and then tap Quantum to open it.
   NOTE:

   • Follow the same process for installing the QuantumTablet app on your Android tablet. The Reports and Analytics feature that is present in the Quantum app is not available in the QuantumTablet app.
   • On Android, the Quantum App Viewer has been upgraded with additional enhancements and has been renamed as Quantum App.

iPhone or iPad

To install the Quantum App:

1. On your Apple device, tap App Store.
2. Search for Temenos Quantum.
3. From the search results, tap Temenos Quantum.
4. Tap Install. Type your login credentials, if requested.

   The app is downloaded and installed on your device.

5. Locate Quantum on your home screen and tap it.
6. Log in to your account by entering your username and password. If you want to bypass entering your log in credentials the next time you run the app, select Remember me. Then tap Sign In.

Generate a Preview of the App

You must have Quantum Fabric configured for Quantum Visualizer. This procedure assumes that you already have created and published a Quantum Fabric app, and have bound your client app to it. These details are covered in Publish a Project to Quantum Fabric.

From V8 SP4 onwards, to create a prototype viewable on the Quantum App:

1. If you are not currently logged in to your Quantum account, do so now by clicking Login in the top right corner of the Quantum Visualizer window. The Quantum Account sign-in window opens.
2. Enter your email and password credentials for your Quantum account, and then click Continue. Once you are signed in, your account name displays in the top right corner of the Quantum Visualizer window.
3. Do one of the following, depending on whether you want to preview the app via the cloud, or locally by establishing a connection between the device and the computer hosting the app.
• Local. On the Build menu, click Run Live Preview.
  1. The Live Preview Settings windows appears. Select the platforms and channels that you want the Quantum Appto support.
  2. Click Save & Run. Quantum Visualizer builds the local preview. To view it, see Preview an App Locally.
• Cloud. On the Build menu, click Publish Live Preview. The Publish Live Preview window appears.
1. Select the platforms and channels that you want to publish.
2. If the project has an existing preview with a publish code, the Publish Live Preview window displays a Preview option.

Toggle the Preview switch to Create New option to publish the app to a new cloud account. If you have access to the app's account, Replace Existing is selected by default, so that the preview you are publishing replaces the existing preview, under that same publish code.



IMPORTANT: Make sure you select the Quantum Fabric environment you want to use.

3. If you want to password-protect the preview, toggle the Permission to Private.
4. Enter a password, and then re-enter it in the Confirm Password text box.
5. You can change the Preview Mode to Debug, to be able to debug the app. Run mode is selected by default.
6. Click Publish.
   Quantum Visualizer proceeds to publish the app, as indicated by the progress bar. Depending on the size of your application and the speed of your internet connection, uploading an application may take some time. Once the application is uploaded to your Quantum account, a publish code is generated as shown here. Also, if you selected the Permission to Private, the password you entered is displayed as well.

   

   NOTE: The publish code is essential for viewing the preview of the application, and can contain numbers and uppercase letters.

7. You can easily share the publish code and password by clicking Share Via Email. A New Message window from your default mail client (for example, Outlook) appears. The code, along with the steps for viewing the preview of the app, is auto-generated in the body of your new email message. Add the email address of all the stakeholders to whom you want to give access to the preview of the application, and then send the email.

Once you have generated a preview of the app, the publish code appears in the status bar located over the Properties Editor.

To create a prototype viewable on the Quantum App for versions released prior to V8 SP4, follow these steps:

1. If you are not currently logged in to your Quantum account, do so now by clicking Login in the top right corner of the Quantum Visualizer window. The Quantum Account sign-in window opens.
2. Enter your email and password credentials for your Quantum account, and then click Continue. Once you are signed in, your account name displays in the top right corner of the Quantum Visualizer window.
3. On the Edit menu, click Preferences.
   
4. In the left pane of the Visualizer Preferences dialog box, click Functional Preview.
5. Select the platforms and channels that you want the Quantum App to support, and then click Apply.
   
6. Do one of the following, depending on whether you want to preview the app via the cloud, or locally by establishing a connection between the device and the computer hosting the app.
• Local. On the Run menu, click Run. Quantum Visualizer builds the preview. To view it, see Preview an App Locally.
• Cloud. On the Publish menu, click App Viewer. The Publish App dialog box displays.
1. Select the channels to which you want to publish, and then click OK.
2. If prompted, sign in to your Quantum account.

The Publish App dialog box displays. If the project does not have an existing preview with a publish code, the dialog box displays only a Create New option.

If the project does have an existing preview with a publish code, the dialog box displays both a Create New option and a Replace Existing option. If you have access to the app's account, Replace Existing is selected by default, so that the preview you are publishing replaces the existing preview, under that same publish code, as illustrated in the example. If you do not have access to the app's account, you can only use the Create New option; the Replace Existing option is grayed out.



3. Under Create New, the default Quantum cloud account name and the Visualizer project name populate the Account and Name fields automatically. From the Account drop-down list, select the account you want to use.

IMPORTANT: Make sure the account you select has the Quantum Fabric environment you want to use.

If you want to change the name of the preview to something other than the Visualizer project name, change the value in the Name text box. If you want, enter a description of the app you are previewing in the Description text box.

4. If you want to password-protect the preview, enter a password, and then re-enter it in the Confirm Password text box.
5. Click Apply.
   Quantum Visualizer proceeds to publish the app, as indicated by the progress bar. Depending on the size of your application and the speed of your internet connection, uploading an application may take some time. Once the application is uploaded to your Quantum account, a publish code is generated as show here. Also, if you selected the Access Settings to Protected, the password you entered is displayed as well.
   From Quantum Visualizer V8 SP3 onwards, a QR code is displayed along with the Publish code. This QR code helps in auto-populating the required data in your device for ease of viewing your application.

   

   NOTE: The publish code is essential for viewing the preview of the application, and can contain numbers and uppercase letters.

6. You can easily share the publish code and password by clicking Share Via Email. A New Message window from your default mail client (for example, Outlook) appears. The code, along with the steps for viewing the preview of the app, is auto-generated in the body of your new email message. Add the email address of all the stakeholders to whom you want to give access to the preview of the application, and then send the email.

Once you have generated a preview of the app, the publish code appears in the status bar located over the Properties Editor.

Preview an App Locally

Runs the Quantum App for a prototype by using the device on which you have Quantum Visualizer installed, to act as the host for displaying the app on your device. You can connect your device by either using a wireless connection or, starting from Quantum Visualizer version 7.3, via a USB connection.

A French version of the Quantum App is available. To view the Quantum App in French, set your device's language to French (and for Apple devices, also set the region to France), and then restart the Quantum App.

• Preview an App by using a USB Connection
• Preview an App by using a Wi-Fi Connection

Preview an App by using a USB connection

When you preview an app locally, use your Quantum Visualizer computer to act as the host for displaying the app on your device by using a USB connection. This procedure assumes that you have already generated a preview on Quantum Visualizer and that both your computer and your mobile device have a USB connection. For more information, see Generate a Preview of the App.

IMPORTANT: USB Tethering for iOS devices on Windows Machine:
Prerequisites - Ensure that the latest version of iTunes is installed on the Windows machine. Before you start viewing the app on your iOS device by using the USB feature on the Quantum App, open iTunes on your Windows machine.

To view the preview of your application locally, follow these steps:

1. Establish a USB connection between the computer that generated the preview (Workstation), and the device.
2. Tap the Quantum App on your device. The application launches.
3. If necessary, provide your Quantum account credentials on the sign-in page, and then tap Sign In.
4. Tap the USB tab on the Quantum App tray to display the USB Preview page.
5. The Quantum App automatically connects to Quantum Visualizer on the computer, and previews the application currently loaded on Quantum Visualizer.

   After you select a Quantum Visualizer workstation, the Quantum App displays a list of previews, listing the most recent preview first.

6. If you want the incremental build changes that take place on Quantum Visualizer to be automatically reflected in the preview on the device, enable Real Time Updates. Additionally, when you enable Real Time Updates, you can opt to enable Silent Updates.
   When enabled, Silent Updates refreshes the preview any time you select Run on Quantum Visualizer, so that the preview reflects the incremental changes made during the last build. If Silent Update is disabled but Real Time Updates is enabled, when you select Run on Quantum Visualizer to initiate an incremental build to incorporate your latest project changes, the Quantum App shows a dialog box. In the dialog box, the Quantum App prompts you indicating that an update is available and asks if you want to refresh the preview. Selecting No keeps the current preview, while selecting Yes refreshes the Quantum App, loading the latest build.

   IMPORTANT: You can enable or disable the Real Time Updates and Silent Updates options in the Settings page on the Quantum App.

   

7. Tap the preview project name that you want to see. This name is identical to the name of the project on Quantum Visualizer.

   Alternately, you can tap the History icon at the bottom of the screen to see a list of previews previously viewed on the device. If you have signed in by using your Quantum credentials, previous preview can be stored on the cloud and can be accessed on any device by using the same cloud credentials.
   
   If the preview is cached locally on the device so that it can be viewed without a wireless or USB connection, the preview's listing includes a Cached status. If the preview has an update available for download, its listing includes an Update status.

   

   NOTE: To email information about the preview to a recipient, click the email icon . Included in the email is the App Viewer ID, and for each platform, the preview's name, short notes, and timestamp.

8. Tap the App Viewer ID of the preview that you want to see.
9. To cache the preview locally on the device so that you can viewed it without a wireless connection, activate the Caching slider.
10. Tap one of the following two options:
    • If an update of the preview is available and you want to view it, tap Update and Launch.
    • If you want to view the version of the preview that the device is currently synced to, tap Launch.

      NOTE: If the Quantum Visualizer version that you are using, is less than V8 SP3, then you are prompted to enter the App name field.

      
      
      

You can cancel the download at anytime.

• The preview build is downloaded to your device. You can view the prototype of the project, and execute any actions attached to the prototype.
• When you are ready to close the preview and return to the home screen of the Quantum App, swipe the device screen with two fingers from left to right.
  

Preview an App by using a Wi-Fi connection

When you preview an app locally, use your Quantum Visualizer computer to act as the host for displaying the app on your device via a wireless connection. This procedure assumes that you have already generated a preview on Quantum Visualizer. For more information, see Generate a Preview of the App.

IMPORTANT: Your computer and your mobile device must be connected to the same wireless network.

To view the preview of your prototype locally:

1. Tap the Quantum App on your device. The application launches.
2. If necessary, provide your Quantum account credentials on the sign-in page, and then tap Sign In. The Quantum App displays its home screen.
3. Tap Wi-Fi on the Quantum App tray to display the WiFi preview page.

   

   From the list of available Visualizer workstations, tap the computer hosting the app that you want to preview.

   Or, tap Scan QR Code and scan the QR code displayed on Quantum Visualizer after generating a preview.
   
   

   NOTE: The default port used for the Quantum Visualizer app is port 9989. If you choose to change the port, it is written to the install location in the file globalPreferences.json.

   After you select a Visualizer workstation, the Quantum App displays a list of previews, listing the most recent preview first.

4. If you want the incremental build changes that takes place on Quantum Visualizer to be automatically reflected on the preview on the device, enable Real Time Updates. Additionally, when you enable Real Time Updates, you can opt to enable Silent Updates.
   When enabled, Silent Updates refreshes the preview any time you select Run on Quantum Visualizer, so that the preview reflects the incremental changes made during the last build. If Silent Update is disabled but Real Time Updates is enabled, when you select Run on Quantum Visualizer to initiate an incremental build to incorporate your latest project changes, the Quantum App shows a dialog box. In the dialog box, the Quantum App prompts you indicating that an update is available and asks if you want to refresh the preview. Selecting No keeps the current preview, while selecting Yes refreshes the Quantum App, loading the latest build.

   IMPORTANT: You can enable or disable the Real Time Updates and Silent Updates options in the Settings page on the Quantum App.

   

5. Tap the preview project name that you want to see. This name is identical to the name of the project on Quantum Visualizer.

   Alternately, you can tap the History icon at the bottom of the screen to see a list of previews previously viewed on the device. If you have signed in by using your Quantum credentials, previous preview can be stored on the cloud and can be accessed on any device by using the same cloud credentials. If the preview is cached locally on the device so that it can be viewed without a wireless connection, the preview's listing includes a Cached status. If the preview has an update available for download, its listing includes an Update status.

   

   NOTE: To email information about the preview to a recipient, click the email icon . Included in the email is the App Viewer ID, and for each platform, the preview's name, short notes, and timestamp.

6. Tap the App Viewer ID of the preview that you want to see.
7. To cache the preview locally on the device so that you can viewed it without a wireless connection, activate the Caching slider.
8. Tap one of the following two options:
   • If an update of the preview is available and you want to view it, tap Update and Launch.
   • If you want to view the version of the preview that the device is currently synced to, tap Launch.

     NOTE: If the Quantum Visualizer version that you are using, is less than V8 SP3, then you are prompted to enter the App name field.

     
     
     

You can cancel the download at anytime.

• The preview build is downloaded to your device. You can view the prototype of the project, and execute any actions attached to the prototype.
• When you are ready to close the preview and return to the home screen of the Quantum App, swipe the device screen with two fingers from left to right.

Preview an App on the Cloud

This procedure assumes that you have already generated a preview on Quantum Visualizer. For more information, see Generate a Preview of the App.

A French version of the Quantum App is available. To view the Quantum App in French, set your device's language to French (and for Apple devices, also set the region to France), and then restart the Quantum App.

From Quantum Visualizer V9 SP2 FP7, you can login to the Quantum App by using Temenos cloud credentials. Existing developers using the Kony cloud as well as new developers using the Temenos cloud can preview apps on the Quantum App.

To view the preview of your app prototype on the cloud:

1. Tap the Quantum App on your device. The application launches.
2. Tap Sign In.
   
   
   
3. If your company's Quantum account uses standard authentication, enter your Quantum credentials, and then tap Sign In.
   
4. Select the Log in with Temenos Account check box.
   
   
   

   NOTE: If you Sign-in via the Temenos cloud, the previous history accessed on the Kony cloud does not appear.

5. If the Cloud Preview screen is not currently displaying, tap the Cloud icon at the bottom of the screen.
   
6. The Quantum Visualizer Cloud Preview displays, from which you can launch a preview in two ways, by either launching by using the App Viewer ID, or opening a previous preview from the History screen:
   • Launch by using the App Viewer ID. If it is not already highlighted, tap the Cloud icon at the bottom of the screen. Next, tap the Enter Code field, type the publish code for the preview you just published, and then tap the Launch button. Or, you can just tap the Scan QR Code button to auto-populate the required details and preview the app.
     While generating the preview of the app on Quantum Visualizer, if you selected the Access Settings to Protected and set up a password, when you tap the Launch button, you are prompted to enter the app password.

     

   • Open a previous preview. Tap the History icon at the bottom of the screen to see a list of previews previously viewed on the device. A previous preview can be stored on the cloud and can be accessed on any device by using the same cloud credentials. If the preview is cached locally on the device it can be viewed without a wireless connection, the Quantum App's listing includes a Cached status. If the application preview has an update available for download, its listing includes an Update status.
     When you open the History page, it initially shows the app previews stored on your cloud account. You can pull to refresh the screen and load the latest app previews stored in your cloud account.
     Tap the App Viewer ID of the Project Name that you want to preview.

   

7. The preview gets downloaded to your device and is displayed. You can now move around on the Quantum Appand run any actions attached to it.
   You can execute different life cycle events of the app. For more information, refer to Execute App Life cycle Events.

   

8. At any time, to create or view notes for a particular form, hold two fingers on the device screen for about two seconds or shake the device. The Quantum App menu displays. Tap either Create Note or View Notes, which displays the Form Notes pane. To dismiss the Form Notes pane, tap X, located near the right edge of the Form Notes title bar. For more information, see Create a Note, View Notes, and Edit or Delete a Note.
9. When you are ready to close the preview and return to the home screen of the Quantum App, swipe the device screen with two fingers from left to right.

View Temenos Forge Components or Applications

Once you launch the Quantum App on your device, you can access Quantum Temenos Forge and view components and applications available in it. You can browse and launch Temenos Forge applications that interest you on the Quantum App.

IMPORTANT: When you access an application from Temenos Forge through an internet browser on a device, if the Quantum Appis installed on the device, the application will open on the Quantum App.

To view Temenos Forge applications on the Quantum App:

1. In the Quantum App, click Temenos Forge . The Temenos Forge page appears with components and applications.
2. Browse through the components and applications.
   
   You can search for a specific component by typing its name or by applying related filters in the search option.
   
   
3. Tap Preview to view the details of the component. The Preview button does not appear for components that do not have their preview available. You can tap the play icon to play the video of the component.
4. To view an application, tap the application. The application page is displayed.
5. Tap Preview. The application opens, and you can verify the application functionality.
   
   

   NOTE: You may need to sign in to Quantum Temenos Forge with your credentials to access the app. For more information, see the corresponding documentation for the app you are using in Temenos Forge .

6. When you are ready to close the preview and return to the home screen of the Quantum App, swipe the device screen with two fingers from left to right.