Kony Visualizer

Installation Guide - Mac

Release 2.5

Document Relevance and Accuracy

This document is considered relevant to the Release stated on this title page and the document version stated on the Revision History page.

Remember to always view and download the latest document version relevant to the software release you are using.

© 2014 by Kony, Inc. All rights reserved 1 of 41

Visualizer Installation Guide - MacVersion2.5

Copyright © 2014 Kony, Inc.

All rights reserved.

July, 2015

This document contains information proprietary to Kony, Inc., is bound by the Kony license

agreements andmay not be used except in the context of understanding the use andmethods of Kony

Inc, software without prior, express, written permission. Kony, Empowering Everywhere, Kony

MobileFabric, KonyModeler,and Kony Visualizer are trademarks of Kony, Inc. Microsoft, theMicrosoft

logo, Internet Explorer, Windows, andWindowsVista are registered trademarks of Microsoft

Corporation. Apple, the Apple logo, iTunes, iPhone, iPad, OS X, Objective-C, Safari, Apple Pay,

AppleWatch and Xcode are trademarks or registered trademarks of Apple, Inc. Google, the Google

logo, Android, and the Android logo are registered trademarks of Google, Inc. Chrome is a trademark

of Google, Inc. BlackBerry, PlayBook, Research inMotion, and RIM are registered trademarks of

BlackBerry. All other terms, trademarks, or servicemarksmentioned in this document have been

capitalized and are to be considered the property of their respective owners.

© 2014 by Kony, Inc. All rights reserved 2 of 41

Revision History

Date Document Version Description of Modifications/Release

07/14/2015 2.5 Updated for 2.5 release.

12/13/2014 2.0 Updated for 2.0 release.

Visualizer Installation Guide - MacVersion2.5

© 2014 by Kony, Inc. All rights reserved 3 of 41

Table of Contents

1. Preface 6

1.1 Purpose 6

1.2 Intended Audience 7

1.3 Formatting Conventions 7

1.4 Reference Documents 8

1.5 Contact Us 8

2. Prerequisites 9

2.1 Software Requirements 9

2.2 Hardware Requirements 9

2.3 Setup Kony Account 9

3. Installing Kony Visualizer 16

4. Configuring Visualizer to Use a Proxy Server 22

4.1 Basic Proxy 22

4.2 NTLM Proxy 23

4.3 Custom NTLM Proxy 25

Visualizer Installation Guide - MacVersion2.5

© 2014 by Kony, Inc. All rights reserved 4 of 41

5. Launching Kony Visualizer 28

6. Installing Kony Visualizer App Preview 30

6.1 Android 30

6.2 iPhone 33

6.3 Windows 8.1 35

7. Uninstalling Kony Visualizer 39

Visualizer Installation Guide - MacVersion2.5

© 2014 by Kony, Inc. All rights reserved 5 of 41

1.  Preface Visualizer Installation Guide - MacVersion2.5

1. Preface

Kony Visualizer enables you to create highly interactive designs for mobile and tablet devices. It

contains a large number of built-in designing elements that help in creating your application designs

specific to a device and its operating system. ThisWYSIWYG tool provides an instant preview of your

design, thereby, helping youmake necessary changes to the design quickly.

Manipulating a widget’s look and feel, changing its skin, ensuring a property is available for a specific

platform or assigning an action event is easily achieved without requiring you to write even a single line

of code!

Your team can reuse the user-defined designing elements and skins by importing and exporting them.

And not only the designing elements and skins, but the complete project can be shared easily. You can

upload the project directly to your cloud and allow your team to download the project. This helps in

saving lot of effort in designing duplicates, and inmaintaining consistent look and feel across the

projects.

One of the unique features of Kony Visualizer is its ability to provide a functional preview of your

design. Similar to how an end-user would view the User Interface (UI) of an application, you can

generate a functional preview that allows your team to view application UI and execute any action

events attached.

Seamless integration with Kony Studio allows you to export (or import) your designs effortlessly.

The product is available on both theWindows andMacintosh platforms. You could easily build your

design on one platform, and preview or modify the same design on the other platform.

1.1 Purpose

This document explains the process of installing Kony Visualizer on your Macintosh computer using an

installer program.

© 2014 by Kony, Inc. All rights reserved 6 of 41

1.  Preface Visualizer Installation Guide - MacVersion2.5

1.2 Intended Audience

This document is written for the web and the application designers who install Kony Visualizer to

design and wireframemobile applications, prior to exporting the designs to Kony Studio.

1.3 Formatting Conventions

The following are the formatting conventions used throughout the document:

Conventions Explanation

Monospace n User input text, system prompts and responses

n File Path

n Commands

n Program Code

n File Names

Italic n Emphasis

n Names of Books and Documents

n New Terminology

© 2014 by Kony, Inc. All rights reserved 7 of 41

1.  Preface Visualizer Installation Guide - MacVersion2.5

Conventions Explanation

Bold n Windows

n Menus

n Buttons

n Icons

n Fields

n Tabs

n Folders

URL Active link to a URL.

Note Provides helpful hints or additional information.

Important Highlights actions or information that might cause problems to systems or data.

1.4 Reference Documents

1. Kony Visualizer User Guide

1.5 Contact Us

Wewelcome your feedback on our documentation.Write to us at techpubs@kony.com. For technical

questions, suggestions, comments, or to report problems on Kony's product line, contact

productsupport@kony.com.

© 2014 by Kony, Inc. All rights reserved 8 of 41

2.  Prerequisites Visualizer Installation Guide - MacVersion2.5

2. Prerequisites

The following are the prerequisites for installing and running Kony Visualizer:

2.1 Software Requirements

Operating System

Mac OS X 10.9

2.2 Hardware Requirements

Component Requirement

Processor x86-64 CPU (64-bit Macs, with an Intel Core i3, Intel Core i5,

Intel Core i7, or Xeon processor.)

Memory 2GB

Internal

Storage

50GB

Network Ethernet Port

2.3 Setup Kony Account

Before using Kony Visualizer, you need to set up an account with Kony. There are two ways of

creating a Kony account.

l Self-Registration: Visit Konywebsite and create a new account.

l Receive an Invitation: Receive an invitation to register with Kony from an existing Kony

Visualizer account user.

© 2014 by Kony, Inc. All rights reserved 9 of 41

2.  Prerequisites Visualizer Installation Guide - MacVersion2.5

2.3.1 Self-Registration

To self-registration, follow these steps:

1. Visit http://www.kony.com.

2. From the top navigation pane, click Login.

3. In the Sign in page, click Create a free account. You will be redirected to Create your Kony

Cloud Account page.

© 2014 by Kony, Inc. All rights reserved 10 of 41

2.  Prerequisites Visualizer Installation Guide - MacVersion2.5

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

You will see a confirmationmessage, informing that your request for registration is accepted.

5. You will receive an email fromKony Accounts. Open themail and click Activate My Kony

Account.

© 2014 by Kony, Inc. All rights reserved 11 of 41

2.  Prerequisites Visualizer Installation Guide - MacVersion2.5

6. You are redirected to Konywebpage: Activate Your Account. Provide the required details and

click Activate account.

© 2014 by Kony, Inc. All rights reserved 12 of 41

2.  Prerequisites Visualizer Installation Guide - MacVersion2.5

© 2014 by Kony, Inc. All rights reserved 13 of 41

2.  Prerequisites Visualizer Installation Guide - MacVersion2.5

Your account is activated, and you are redirected to the dashboard of KonyCloud.

2.3.2 Receive an invitation

When the owner of an account (or amember who has the necessary permissions to invite users),

sends an invitation frommanage.kony.com, all the invitees receive an email asking them to register to

Kony Visualizer.

To register with Kony after receiving an invitation, follow these steps:

1. Open the email you have received from the Kony Accounts, and click Accept Invitation.

© 2014 by Kony, Inc. All rights reserved 14 of 41

2.  Prerequisites Visualizer Installation Guide - MacVersion2.5

2. You are redirected to KonyWebpage: Accept Invitation. Provide the required details and click

Accept invitation.

Your account is activated, and you are redirected to the dashboard of KonyCloud.

© 2014 by Kony, Inc. All rights reserved 15 of 41

3.  Installing Kony Visualizer Visualizer Installation Guide - MacVersion2.5

3. Installing Kony Visualizer

To install Kony Visualizer on your Mac computer, follow these steps:

Important: Youmust have administrative rights on your computer to install Kony Visualizer.

1. Visit http://manage.kony.com.

2. Type your Kony account login credentials, and click Sign in.

TheManage Cloud page appears.

© 2014 by Kony, Inc. All rights reserved 16 of 41

3.  Installing Kony Visualizer Visualizer Installation Guide - MacVersion2.5

3. Click the Kony Visualizer <version> for Mac to download the installer.

The installer is downloaded to your computer.

4. Navigate to the location where you downloaded the installer fileKonyVisualizerSetup-

<version>.exe, and double-click it.

The installer extracts the required files. The Kony Visualizer window appears.

© 2014 by Kony, Inc. All rights reserved 17 of 41

3.  Installing Kony Visualizer Visualizer Installation Guide - MacVersion2.5

5. Click Next.

The Select Installation Folder pane appears

6. To select a folder on the drive where you want to install Kony Visualizer, click Choose. To reset

the default installation folder, click Restore Default Folder.

© 2014 by Kony, Inc. All rights reserved 18 of 41

3.  Installing Kony Visualizer Visualizer Installation Guide - MacVersion2.5

7. Click Next. The Select Workspace Folder pane appears.

8. To select a folder on the drive to be used as Kony Visualizer workspace, click Choose. To reset

the default Kony Visualizer workspace, click Restore Default Folder.

Note: Workspace folder holds all your Kony Visualizer projects.

9. Click Next. The License Agreement pane appears.

10. Read the License Agreement carefully. If you accept the terms of the agreement, click the I

Accept the terms of the License Agreement option, and then click Install.

© 2014 by Kony, Inc. All rights reserved 19 of 41

3.  Installing Kony Visualizer Visualizer Installation Guide - MacVersion2.5

The Installing Kony Visualizer page appears, and the installation begins.

After completing the installation, Install Complete window appears

© 2014 by Kony, Inc. All rights reserved 20 of 41

3.  Installing Kony Visualizer Visualizer Installation Guide - MacVersion2.5

11. Click Done to complete the installation, and launch Kony Visualizer.

© 2014 by Kony, Inc. All rights reserved 21 of 41

4.  Configuring Visualizer to Use a Proxy Server Visualizer Installation Guide - MacVersion2.5

4. Configuring Visualizer to Use a Proxy Server

Note: If your computer is not behind a proxy server, you can skip this section andmove onto the

next section: Launching Kony Visualizer.

When your system is a part of an internal network and connects to the internet using a proxy server,

you need tomodify the Visualizer configuration settings to bypass proxy server and access internet.

You can use one of the followingmethods to configure Visualizer to use a proxy server:

l Basic Proxy: Provides steps to configure your basic proxy settings to allow Kony Visualizer

access the Internet.

l NTLMProxy: Provides steps to configure your proxy settings to allow Kony Visualizer access

internet.

l CustomNTLMProxy: Provides steps to customize and configure proxy settings to allow Kony

Visualizer access internet.

4.1 Basic Proxy

For enabling Visualizer use a Basic proxy, follow these steps:

1. Navigate to the Kony Visualizer installation folder > Config folder (ex.

/Users/PC1/KonyVisualizer/Config).

2. Open the proxy_config.js file.

3. Edit the following details. between the comments "USER EDITIABLE SECTION START" and

"USER EDITIABLE SECTION END":

//To enable proxy, change the following value to true.

var ENABLE_PROXY = false;

//Provide null value.

© 2014 by Kony, Inc. All rights reserved 22 of 41

4.  Configuring Visualizer to Use a Proxy Server Visualizer Installation Guide - MacVersion2.5

var NTLM_DOMAIN = 'kvisualizer.com';

//Provide Basic server port number.

var PROXY_PORT = 8080;

//Provide your Username.

var PROXY_USER = 'vizuser';

//Provide your password.

var PROXY_PWD = 'Welcome@1';

//Change the value to PTYPE.BASIC_PROXY.

var PROXY_TYPE = PTYPE.NTLM_PROXY;

4. Save the Proxy_config.js file.

4.2 NTLM Proxy

To configure Visualizer to use an NTLM proxy, follow these steps:

1. Navigate to the Kony Visualizer installation folder > Config folder (ex.

/Users/PC1/KonyVisualizer/Config).

2. Open the proxy_config.js file.

3. Edit the following details between the comments : "USER EDITABLE SECTION START" and

"USER EDITABLE SECTION END":

//USER EDITABLE SECTION START

/*

In case of NTLM custom config only PROXY_TYPE and CNTLM_PORT

ProxyConfig paramaters are required. Rest can be left undefined.

Custom CNTLM config can also be generated by using cntlmconf.sh on

© 2014 by Kony, Inc. All rights reserved 23 of 41

4.  Configuring Visualizer to Use a Proxy Server Visualizer Installation Guide - MacVersion2.5

mac

e.g.

./cntlmconf.sh -u NTLMUSER -d DOMAIN -s PROXY-IP:PROXY-PORT

*/

//To enable proxy, change the following value to true.

var ENABLE_PROXY = false;

//Provide Proxy IP address.

var PROXY_IP = 'XXX.XXX.XXX.XXX';

//Provide NTLM Domain address.

var NTLM_DOMAIN = XXXXXXX.com';

//Provide NTLM server port number.

var PROXY_PORT = 8080;

//Provide your Username. Note: Do not provide the domain name in

the username. For example, if your username is user@domain.com,

then enter the username as user.

var PROXY_USER = 'XXXXXX';

//Provide your password.

var PROXY_PWD = 'XXXXXX';

//If the type of proxy used is basic, replace NTLM_PROXY with

BASIC_PROXY.

var PROXY_TYPE = PTYPE.NTLM_PROXY;

//USER EDITABLE SECTION END

4. Save the proxy_config.js file.

© 2014 by Kony, Inc. All rights reserved 24 of 41

4.  Configuring Visualizer to Use a Proxy Server Visualizer Installation Guide - MacVersion2.5

4.3 Custom NTLM Proxy

Note: For someNTLM v1 and v2 configurations, the default generated cntlm.conf file may not

work. In such cases, you need to customize your proxy settings.

To configure Visualizer to use a custom NTLM proxy, follow these steps:

1. Navigate to the Kony Visualizer installation folder > Config folder (ex.

/Users/PC1/KonyVisualizer/Config).

2. Open the proxy_config.js file.

3. Edit the following details between the USER EDITABLE SECTION START and USER

EDITABLE SECTION END:

//USER EDITABLE SECTION START

/*

In case of NTLM custom config only PROXY_TYPE and CNTLM_PORT

ProxyConfig paramaters are required. Rest can be left undefined.

Custom CNTLM config can also be generated by using cntlmconf.sh on

mac

e.g.

./cntlmconf.sh -u NTLMUSER -d DOMAIN -s PROXY-IP:PROXY-PORT

*/

//To enable proxy, change the following value to true.

var ENABLE_PROXY = false;

//Type Proxy IP address.

var PROXY_IP = 'XXX.XXX.XXX.XXX';

//Type NTLM Domain name.

var NTLM_DOMAIN = 'XXXXXXX.com';

© 2014 by Kony, Inc. All rights reserved 25 of 41

4.  Configuring Visualizer to Use a Proxy Server Visualizer Installation Guide - MacVersion2.5

//Type NTLM server port number.

var PROXY_PORT = 8080;

//Type your Username. Note: If your user name is user@domain.com,

then enter the username as useronly. Domain name is not required.

var PROXY_USER = 'XXXXXX';

//Type your password.

var PROXY_PWD = 'XXXXXX';

//If the type of proxy used is basic, replace NTLM_PROXY with

BASIC_PROXY.

var PROXY_TYPE = PTYPE.NTLM_PROXY;

//Change the value to false

var GENERATE_NTLM_CONF = false;

//USER EDITABLE SECTION END

4. Save and close the proxy_config.js file.

5. Navigate to the Kony Visualizer installation folder > nw folder> nw-win folder (ex.

/Users/PC1/KonyVisualizer/nw/nw_Mac).

6. Open the cntlm.conf file.

7. Modify the following parameters:

Username my_proxy_user;

Domain my_proxy_domain.com;

Proxy my_proxy_server:8080;

8. Save and close the cntlm.conf file.

© 2014 by Kony, Inc. All rights reserved 26 of 41

4.  Configuring Visualizer to Use a Proxy Server Visualizer Installation Guide - MacVersion2.5

9. To generate the profile, follow these steps:

a. Open a Command Prompt window in the current folder.

b. Execute cntlm.exe -c cntlm.conf -I -M http://kony.com.

c. Type your NTLM password, if requested, to generate a profile.

d. Copy the generated profile.

10. Reopen th ecntlm.conf file.

11. Append the profile details (copied from step 9). A portion of the cntlm.conf file after appending

the parameters is shown below:

Username my_proxy_user

Domain my_proxy_domain.com

Proxy my_proxy_server:8080

NoProxy localhost, 127.0.0.*, 10.*, 192.168.*

Gateway no

Listen 3128

Auth NTLMv2

PassNTLMv2 XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

12. Save the cntlm.conf file.

13. Move the cntlm.conf file to User Profile folder/user name/Kony Visualizer/vizdata (for example,

/Users/PC1/Kony Visualizer/vizdata).

© 2014 by Kony, Inc. All rights reserved 27 of 41

5.  Launching Kony Visualizer Visualizer Installation Guide - MacVersion2.5

5. Launching Kony Visualizer

To launch Kony Visualizer, follow these steps:

1. Double-click the Kony Visualizer shortcut on the desktop to open the login screen of Kony

Visualizer.

Note: You can also navigate to the folder where Kony Visualizer is installed and double-

click Kony Visualizer to launch it.

2. Enter your Kony login credentials, and then click Let's Go.

3. If this is the first time you are launching the Kony Visualizer, all the features of Kony Visualizer

are disabled until you create your first project.

© 2014 by Kony, Inc. All rights reserved 28 of 41

5.  Launching Kony Visualizer Visualizer Installation Guide - MacVersion2.5

4. Click Project > New Project to create a new Kony Visualizer project.

© 2014 by Kony, Inc. All rights reserved 29 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

6. Installing Kony Visualizer App Preview

Kony Visualizer App Preview allows you to view the complete prototype designed in Kony Visualizer

on your mobile or tablet device.

You can download the Kony Visualizer App Preview on your

l Android devices fromGoogle Play Store.

l iOS devices fromApple Store.

l Windows devices fromWindowsStore.

6.1 Android

To install Kony Visualizer App Preview, follow these steps:

1. Tap Applications, and then tapGoogle Play.

2. Search for Kony Visualizer.

Search results display Kony Visualizer app installer for bothmobile and tablet.

© 2014 by Kony, Inc. All rights reserved 30 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

3. From the search results, tap Kony Visualizer.

4. Tap Install. Type your login credentials, if requested.

5. After completing the installation, navigate to Internet Downloads folder.

© 2014 by Kony, Inc. All rights reserved 31 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

6. Tap the Kony Functional Preview.apk.

7. Tap Install.

8. After installing, you will receive the Application Completedmessage. Tap Done.

© 2014 by Kony, Inc. All rights reserved 32 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

9. Tap Applications, and then tap Visualizer Functional Preview to open it.

Note: Follow the same process for installing Kony Visualizer App Preview on your Android

tablet.

6.2 iPhone

To install Kony Visualizer App Preview, following these steps:

1. Tap App Store.

2. Search for Kony Visualizer.

© 2014 by Kony, Inc. All rights reserved 33 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

3. From the search result, tap Kony Visualizer.

4. Tap Install. Type your login credentials, if requested.

The app is download and installed in your mobile device.

© 2014 by Kony, Inc. All rights reserved 34 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

5. Tap the Kony Visualizer App Preview app icon to open it.

Note: Follow the same process for installing Kony Visualizer App Preview on your iPad.

6.3 Windows 8.1

To install Kony Visualizer App Preview, following these steps:

© 2014 by Kony, Inc. All rights reserved 35 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

1. Tap Store and search for Kony Visualizer.

2. From the search result, tap Kony Visualizer.

© 2014 by Kony, Inc. All rights reserved 36 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

3. Tap Install.

The app is download and installed in your mobile device.

© 2014 by Kony, Inc. All rights reserved 37 of 41

6.  Installing Kony Visualizer App Preview Visualizer Installation Guide - MacVersion2.5

4. Tap the Kony Visualizer App Preview app icon to open it.

Note: Follow the same process for installing Kony Visualizer App Preview on your Windows

tablet.

© 2014 by Kony, Inc. All rights reserved 38 of 41

7.  Uninstalling Kony Visualizer Visualizer Installation Guide - MacVersion2.5

7. Uninstalling Kony Visualizer

To uninstall Kony Visualizer, follow these steps:

1. Navigate to Applications > Kony Visualizer, and double-click Uninstall. The Uninstall Kony

Visualizer pane appears.

2. Click Uninstall.

The Uninstall confirmation window appears.

© 2014 by Kony, Inc. All rights reserved 39 of 41

7.  Uninstalling Kony Visualizer Visualizer Installation Guide - MacVersion2.5

3. Click YES.

The Uninstall Complete pane appears.

4. Click Done to close the Uninstall Kony Visualizer window.

© 2014 by Kony, Inc. All rights reserved 40 of 41

7.  Uninstalling Kony Visualizer Visualizer Installation Guide - MacVersion2.5

Note: The Uninstaller cannot remove the files or folders that were not installed or copied by

the installer. These include files or folders created as you use Kony Visualizer (for example,

log files). You need tomanually delete them.

© 2014 by Kony, Inc. All rights reserved 41 of 41