Smart Card

The Smart Card component in Sintel BI allows users to present textual information alongside numerical data in a clear, engaging format. It is a flexible, visually appealing tool that enables you to highlight key figures and insights from your data.

This guide will walk you through the features, setup, and practical examples of how to use the Smart Card component effectively.

1. Adding the Smart Card

To add a Smart Card to your dashboard:

Drag and drop the Smart Card component onto your desired location in the dashboard.

Resize it to suit the space and design requirements.

2. Configuring the Smart Card

Once added, you can configure the following options from the properties panel on the right:

– Text Settings

Title: Add a title that summarises the purpose of the card (e.g., “Total Revenue”).

Subtitle: Provide an optional subtitle for additional context (e.g., “Q1 2024”).

Description: Add more detailed text if needed (e.g., “This card shows the total revenue generated in Q1”).

Icon: Choose an icon that represents the data visually (e.g., a money symbol for financial figures).

Title Alignment: Choose whether the title is left, centre, or right aligned.

– Link Settings

Link: You can make the Smart Card clickable by adding a URL. When a link is added, a small clickable icon will appear next to the title.

Link Description: Add a description for the link, providing users with context.

Open in New Tab: Select whether the link should open in a new tab or in the current tab.

– Security Settings

Visibility: You can configure who can see the Smart Card:

• • Public: Anyone can view the Smart Card.
  • Private: Restrict the card’s visibility and share it only with specific groups or users.

– Look and Feel Settings

Elevated Border: Add or remove an elevated border for visual emphasis.

Background Colour: Choose a background colour to make your card stand out.

Mobile Visibility: Select whether the Smart Card is visible on mobile devices.

Assigning Data to the Smart Card

Once you’ve configured the card’s appearance, you can assign data to it. Here’s how:

1. Select a Data Source: Choose the relevant data source for the Smart Card.
2. Select Text: You can use @ to insert dynamic data from numerical columns into the card’s text. For example, if you want to display total sales, use @sales in the description or title.
3. Custom Code (Optional): If you’d like to add custom HTML you can s insert custom code.

3. Examples of Using the Smart Card

Here are some examples of how you might use the Smart Card in different scenarios:

– Sales Performance Overview

Display key sales metrics for a specific time period.

• Title: “Total Sales”
• Subtitle: “Q3 2024”
• Description: “The total sales for this quarter have reached @TotalSales.”
• Icon: ? chart-line-up (light)
• Data: @TotalSales pulls in data from the “Sales” column.

Use Case: This is perfect for executive dashboards, where key figures need to be highlighted quickly.

– Visitor Insights

Present your monthly  traffic figures.

• Title: “Visitors”
• Subtitle: “October 2024”
• Description: “We had a total of @Visitors website visits this month.”
• Icon: ? globe (light)
• Link: Add a link to the detailed analytics report.

Use Case: This card could be used by marketing teams to track the effectiveness of campaigns and measure user engagement.

– Financial Performance Indicator

Show key financial figures like profit or revenue.

• Title: “Total Revenue”
• Subtitle: “Year-To-Date”
• Description: “The revenue so far is @Revenue.”
• Icon: ? money-bill (light)

– Project Progress Report

Track the progress of a key project in your organisation.

• Title: “Project ABC Progress”
• Subtitle: “October 2024”
• Description: “The project is currently @Completion% complete.”
• Icon: ? calendar (light)

 

Was this article helpful?

0 out of 5 stars

5 Stars		0%
4 Stars		0%
3 Stars		0%
2 Stars		0%
1 Stars		0%

5 Submit

How can we improve this article?

Please submit the reason for your vote so that we can improve the article.

Name

Email

Submit