Skip to main content

Enterprise Visual Management

1. Overview of Enterprise Visual Management

Enterprise visual management refers to the setting and management of enterprise pages, color schemes, etc., to comply with the company's brand visual standards and strengthen corporate culture and brand awareness internally.

2. Steps for Enterprise Visual Management

2.1 LOGO and Appearance

Select "LOGO and Appearance" in Enterprise Visual, where you can choose the default platform theme and color scheme, upload a favicon, modify the login page LOGO and background image, and hide the vendor LOGO and text.

Note:

  • The login icon in the configuration requires a forced refresh, other changes take effect immediately;

  • The license must include "L1008 Login Page Customization" to modify it by yourself.

image.png

LOGO configuration example:

image.png

LOGO configuration method: upload a custom image to change the icon, or check whether to display/control visibility.

image.png

2.2 Dashboard Theme

In the dashboard theme section, you can centrally manage dashboard theme resources, including 6 built-in themes and themes downloaded from the app market. Built-in themes only support preview, app market themes support preview and deletion. Deleting a theme does not affect pages that have already applied it.

image.png

2.3 Color Scheme

In "Management Center - Enterprise Configuration - Enterprise Visual - Color Scheme", you can manage color schemes.

  • System built-in color schemes: can be hidden (shown) or set as default;

  • Custom color schemes: can be hidden (shown), set as default, edit, migrate, or delete.

image.png

How to customize a color scheme: Click the "New" button in the upper right corner, enter the color scheme name, and enter the color HEX value below. Press Enter to finish. Repeat this operation multiple times to enter multiple colors. After completion, click OK to save the custom color scheme.

2.4 Enterprise Fonts

In "Enterprise Fonts", you can see the fonts in the company domain. You can upload files (otf or ttf format) to add fonts, and you can also rename and delete existing font styles.

image.png

2.5 Enterprise Icons

In "Enterprise Icons", you can edit, delete, or hide existing enterprise icons.

image.png

You can also click "New" to upload a new enterprise icon. After completion, click Save. For specific icon drawing, see the Enterprise Icon Drawing Specification below.

image.png

2.6 Component Templates

In "Component Templates", you can view and manage self-built templates added to dashboards and component templates downloaded from the app market. For more detailed operations, see Component Templates.

For self-built templates:

  • Single template: supports renaming, preview, delete, move to default group;

  • Group: supports renaming, delete, add template;

  • Others: supports adding groups.

image.png

For app market templates: supports "preview" and "delete group" for component templates.

image.png

If the relevant component template is not downloaded, click "Cloud Market" in the top navigation bar to download and add it.

image.png

3. Enterprise Icon Drawing Specification

Enterprise icon drawing specification refers to the rules that must be followed when using enterprise icons (enterprise icons) on the platform.

3.1 Enterprise Icon Drawing Process

3.1.1 Set Icon Size

It is recommended to set the icon size to 48 * 48px, with the main content controlled within 44 * 44px, leaving a 2px bleed line;

3.1.2 Draw the Icon

When drawing icons, layers must be created in the design software, which can be divided into 1-3 layers and named "primary", "secondary", and "tertiary" to define paths that can be recolored. The icon style can be linear, filled, or a combination of both. Please keep the style, thickness, rounded corners, and perspective consistent for the entire set of icons;

3.1.3 Save as SVG Format

Save the file as SVG format and name the file properly.

3.2 Enterprise Icon Drawing Rules

  • Closure: The graphic needs to be closed, and there should be no unclosed graphics;

  • Nodes: Minimize the use of nodes, simplify the graphic, and remove unnecessary nodes;

  • Merge: If there are two or more graphics, or graphics with boolean relationships, please merge the graphics;

  • Fill: The completed graphic needs to be filled with the relevant color, preferably solid color. Gradients are not supported yet;

  • Size: Draw the graphic within the specified border, try to fill the drawing area, and adjust the actual icon size flexibly;

  • Outline: Outline the stroke and convert it into a closed graphic.