--- title: Experience Center slug: en/experience-center description: Learn how to effortlessly create and configure an Experience Center (EC) in CITSmart with this comprehensive document. From registering and importing to changing and deleting, it covers all essential steps. Gain insights into the EC interface, including p docTags: createdAt: 2021-10-27T17:22:11.000Z --- Creation is the process of designing and providing the Experience Centers (EC) in **CITSmart**. This document presents the interface features that **enable the registration, change, deletion, import, and export of EC**. ## Before getting started - [x] To create an experience center, it is necessary to have permission in the access profile. :::hint{type="info"} πŸ–Š ***Note*****: **Some widgets depend on information entered in other features, for example, knowledge, surveys, services, notifications, and others. Therefore, it is necessary to structure this information for possible use within the EC. ::: ## Procedure 1. To access the Experience Center functionality, access the menu `Experience Center > Experience Center Configuration > New`. ### Information 2\. In the "**Information**" tab, complete the fields available; ![](https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/n3GL5u7MkAsCdUXqVyUhS_creat-experience-center.png "Information Experience Center CITSmart") 1. *********Change*** – the icon of Experience Center; 2. *********Title*** – that will be presented for the user of Experience Center; 3. *********Status*** – of the Experience Center (β€œActive” or β€œInactive”); 4. *********Type*** - it's possible to view the options *Main* showing the Experience Center created to be primary, and *Link* showing the ones that were created to be linked to some primary EC; 5. *********Description*** – text that will follow with the title for the presentation of the Experience Center to the user. ### Permissions 3\. On the "**Permissions**" tab, define the groups that will be able to view the Experience Center; ![](https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/PAUQz6Io9p6M3jfouBJcM_permission-experience-center.png "Permission Experience Center CITSmart") ### Construction 4\. On the "**Construction**" tab, it is possible to visually customize the Experience Center, besides the possibility create sections and adding Widgets, links, and linking other Experience Centers: ### Visual Customization 5\. By using these tools, you can customize the Experience Center view - *********Change logo*** – This allows changing the EC logo. Recommended size: - *********Change header*** – This allows changing the EC header image. Recommended size: - *********Reset structure*** – This allows setting the whole structure as if it were the first access, removing all changes; - *********Grid style*** – This allows changing how to visualize the Experience Center, - *********Fixed Width*** – Keeps the EC fixed at the center of the screen; - *****Full Width*** – Leaves the EC completely distributed in the size of your browser; - *********Logo size*** – This allows increasing the logo size up to 100% of its original size. - *********Theme color*** – This allows changing the color of the drop-down menu (using colors in code, e.g.: **#777**) - *********Menu icon*** – This allows changing the color of menu sections, links, and icons (using colors in code, e.g.: **#777**) :::hint{type="warning"} ⚠️ ***Attention*****! ** The "**Reset Structure**" button is irreversible after saving the change, if you **have not saved**, just press the back button and nothing will be changed. ::: ### Design Area In the design area, you can build the content that will be published in the Experience Center. 1. Set the type of navigation (with or without menu); 2. Create sections for the navigation tree (only for navigation with menus); 3. Add a menu item, at end of the section, by clicking on "**+**"; 4. Configure the menu content, by clicking on the key icon; 5. Select the type of content (Widget, link, or Experience Center); *********Type*****:**** Widget** 1. Select the size for the content area, by clicking on "**+**" and choosing an option; :::BlockQuote **100%, 50% x 50%, 33,3% x 33,3% x 33,3%, 33,3% x 65,6%, 65,6% x 33,3% e 25% x 25% x 25% x 25%.** ::: 2\. Select the Widget, by clicking on "**=+**" and choosing an option; 3\. Click on "**Save**". - After selecting a layout, it is possible to choose **CITSmart** functions as Widgets (See Widgets table); :::hint{type="info"} πŸ–Š ***Note*****:** - Do you want to set this page as home when you first open the experience center? - It has the function of making this menu the main page of your Experience Center. - Inherit Experience Center Groups - allows to select which groups will be allowed to this menu, the groups that are available for management are the groups that have permission on the "**Permissions**" tab; ::: Widget "**My Services**" It is possible to select in Widget the type "**My Services**", in which is possible to inform the services that will be available in the Experience Center that is being configured. To include the services to be used in the Experience Center: 1. Access "**Construction**" in the Experience Center; 2. Choose to add widgets and select the "**My Services**" widget option; 3. The system will open the Services selection option; 4. Select the services that will be part of the Experience Center which is being configured; 5. Save the configuration made in the widget. At any time, you can edit and delete a service. :::hint{type="info"} πŸ–Š ***Note*****: **If the **parameter 293** - Enable access permission for user groups in the portal - Values: "**Y**" or "**N**" Default: "**N**", is set to Yes, the Service added to the Experience Center must have access permission for the public informed in the Experience Center. In addition, the system will only return Services that the logged user has access to. ::: *********Type*****:**** Link** 1. When selecting the item link, enter a URL to direct the user when they click on the menu item; 2. Click on "**Save**". *********Type*****:**** Experience Center** 1. Allows linking another Experience Center (***Type*****:** Link) to the main one. Click on the search field and the registered EC will be listed, select one. It is also possible to type the name to find it. 2. Click on "**Save**". ### Positioning of Elements and Widgets *********Fixed Header********* ![](https://api.archbee.com/api/optimize/pu5VMc-2TW3GQX4ly5Xp7/D4OxKK7XatAoaipu4jydA_header-experience-center.png "Header Experience Center CITSmart") 1. *********Menu*** – with it you can access other Experience Centers to which you have permission; 2. *********Logo*** – selected by the user for a better EC customization; 3. *********Search bar*** - perform a universal search that will return Knowledge and Activities that the user can select; 4. *********Profile options*** – allows you to change the language, edit the profile, logout, and access the system. *********Experience Center with navigation********* This structure allows the creation of an Experience Center with a left navigation menu tree. *********Experience Center without navigation********* This structure allows the creation of an experience center using only widgets. *********Widgets Available********* | **Name** | **Type** | **Objective** | | ----------------- | ----------------------- | ------------------------------------------------------------------------ | | News | General | Displays knowledge of type "News”. | | Notification | General | Displays Systems notifications. | | Searches | General | Allows to view active campaigns | | Youtube | General | Allows to incorporate videos from Youtube | | Image | General | Enters image | | Slide Show | General | Displays slide show of type carrossel. | | Divider | General | Inserts horizontal line on-page. | | Spacer | General | Inserts space between one widget and another. | | Text | General | Inserts a text with several formats. | | List | General | Inserts the list of links. | | Menu | General | Allows viewing the menu of **CITSmart**. | | | | | | Knowledge center | Knowledge | Generates a button that directs to the Knowledge Center | | Knowledge | Knowledge | Allows to insert existing documents into the knowledge base | | Favorites | Knowledge | Allows to list all documents classified as favorites in the User's Guide | | Indicated | Knowledge | Allows to list all documents listed in the User's Guide | | Liked | Knowledge | Allows to list all documents liked in the User's Guide | | | | | | My services | Requests | Allows to open a ticket through the Experience Center | | My tickets | Requests | Allows to view the list of tickets opened by the user logged | | | | | | Simple | Simple Agile Management | Allows to view the workspaces of the functionality Simple | | | | | | Smart Chat | Communication | Allows to enter a logo for this submenu | | Call | Communication | Allows to enter the logo for this submenu | | | | | | My Worksplaces | Smart Decision | Allows to search for reports within the Smart Decisions | | | | | | Experience Center | Experience Center | Allows entering another Experience Center | ### Configure home page :::hint{type="info"} **Note: **It is possible to configure the redirected page using `Parameter 451 - Redirect page after saving Ticket in the Experience Center` The default configuration is: */pages/experienceCenter/experienceCenter.load#/* ::: ## What to do next In the upper area, click on "**Preview**" to view the created Experiment Center. After finishing the EC, publish it so that your organization can take full advantage of it. Click on "**Export**" to download the JSON format Experience Center.