Dmitry Grenev

VK Data Portal

Internal analytics product for recurring reports, metric tracking, and data-heavy decisions in VK AI.

Report pages, chart behavior, comments, access, presentation files, import/export, and administration form one controlled product system for internal analytics teams.

Status

Release

Role

Product Designer, Design Engineer

Domain

Internal Products, Analytics Tools

Product model

VK Data Portal collects recurring analytics into a product surface: workspaces, report folders, dashboard pages, chart reading, access, and maintenance live in one interface.

The report is built from a feed of analytical blocks, a pagebar with global parameters, a left navigation panel, and a right panel that follows the chart currently in the reading area.

The documentation fixes interface mechanics and user stories: workspaces, alignment, panel behavior, pagebar updates, chart hovers, pinned states, filters, comments, access, targets, trend breaks, import, export, and administration are described as one product system.

Fig. 1.Documentation for interface mechanics and user stories.
1.1

Workspace

The Central Marketing workspace is a working area inside Data Portal.

Folders in the selected workspace group reports for different teams. The user moves between dashboard pages in one workspace, while structure, owners, and access stay in the same product context.

Fig. 2.Central Marketing workspace with department folders and dashboards.

Data Portal is placed inside VK’s internal product environment. The entry point shows where the product opens and where access can be requested: to Data Portal itself or to a specific workspace.

Data Portal entry point with product and workspace access.
Fig. 3.Data Portal entry point with product and workspace access.
1.2

Navigation

The left panel keeps the report information architecture visible while the page stays open.

It switches between internal products, opens Data Portal, shows available workspaces, folders, and dashboard pages, and collapses when the report needs more width for reading.

A workspace has its own data, access model, and roles. Navigation can change width, hide, and open over the feed on narrow screens, so the report keeps its reading area without losing context.

Fig. 4.Left panel for product, workspace, folder, and dashboard navigation.

The right panel is tied to the report block in focus. Tabs switch between comments, legend, and filters, so discussion, line visibility, and filter controls follow the chart or block the user is reading. On narrow screens, only one side panel stays open at a time; hidden panels return through compact action icons.

Right panel states: comments, legend, and filters.
Fig. 5.Right panel states: comments, legend, and filters.

The pagebar contains the report reading parameters: product selector, date picker, and quick period presets. The selected product acts as the main report filter; the date picker defines the range and aggregation by day, week, month, quarter, or year.

When the user scrolls, the pagebar locks to the top. As the next heading or chart enters the reading zone, the selected product, current chart name, comments, legend, and filters update together. The interface also uses scroll snapping to align a chart with the top edge and keep it fully visible when the screen height allows it.

Fig. 6.Report bar with product and period controls.

Visual language

The visual language gives the analytics product a recognizable internal identity while keeping charts, tabular data, access states, and service controls in priority.

2.1

Logo

The logo translates the product metaphor into a compact mark.

It combines three sources: database, portal, and office. The cylindrical form refers to database storage; the two circles carry the portal metaphor as a pair of connected entry points; the gaps in the rings bring in the office language of a binder mechanism.

The result is a technical product mark tied to the everyday infrastructure of internal reporting.

Fig. 8.Logo references: database, portal, and office infrastructure.

Report mechanics

Report mechanics cover how metrics are read, compared, discussed, shared, refreshed, and exported.

The product is part of a regular corporate reporting process: teams need one place to read current values, understand methodology, request access, leave comments, update data, and prepare materials for circulation.

Theme switching uses the same VK Sky token model as the rest of the interface. Light and dark schemes replace color values while chart hierarchy, panel behavior, and reading mechanics stay intact.

Fig. 9.Theme switching across the report interface.
3.1

Chart behavior

The chart and the right panel work as one reading mechanism.

Hovering over a period adds a vertical guide and keeps active only the values for that time unit. The hit area is continuous between periods, so the chart stays stable while the cursor moves across columns.

The same state can be pinned by click. Hovering over a line dims the other lines, highlights its legend in the right panel, and exposes point values on the chart; hovering over a legend repeats the same focus from the panel side.

The legend panel also shows values for the current period and significant-change markers when they exist. If the right panel is hidden or the viewport is narrow, legends can move directly onto the chart; the visible set is still controlled through the legend list.

Fig. 10.Line chart with an interactive legend in the right panel.

Filters are placed in the right panel and can differ from chart to chart: each report block has its own filter list and option set. Applying a filter changes the selector state and adds a visible filter note under the chart title.

The selector supports default, pressed, selected, multi-selected, searchable, and chip-based states. Clicking the filter note on the chart opens the corresponding filter control in the panel.

Fig. 11.Filter scenarios with dropdowns, search, and multiple selection.

Slices let analysts compare chart series under different conditions: by filter, period, or a configured comparison. A new slice is placed on the same chart, so several contexts stay inside one comparison area.

The slice title and icons show what the slice contains. Metric slices can add a second value scale; period slices can add a second time scale; slice lines and legends are visually quieter through transparency.

Fig. 12.Adding and removing a comparison slice on a chart.
3.2

Interpretation

The interface makes metric interpretation explicit. Goals, trend breaks, significant changes, deltas, and missing data are shown at chart level, so an analyst reads the value together with the context that affects the conclusion.

A target is attached to a specific chart and filter state. It becomes a dashed line and a chart-level icon; hovering over the icon highlights the target, dims the regular lines, and opens a tooltip with the target text.

A configured delta or comparison state stays next to the metric. Statistical and data-quality markers show where the change is statistically significant, where data is incomplete, or where methodology affects the reading.

Fig. 13.Metric target shown as a dashed line on the chart.

Trend breaks mark a break in metric continuity: methodology, data structure, sample, or calculation rules may have changed. Administrators create a trend break from the chart menu and write the tooltip text that explains the reason.

On the chart, the affected interval becomes a dotted segment. Hovering over it highlights the segment with its boundary points, highlights the related legend item, and shows the explanation; the trend break also resets statistical significance for that interval.

Fig. 14.Trend break state on a chart.

Statistically significant changes replace regular line-chart points with directional arrows. On bar charts, the same signal appears inside the column under the value.

Statistically significant changes marked on chart points.
Fig. 15.Statistically significant changes marked on chart points.

Delta shows the difference between the current metric and a selected baseline, goal, or custom comparison. The comparison stays next to the metric in the same chart context.

Delta state for comparing metric change.
Fig. 16.Delta settings for metric comparison.

If a period has no values or the sample is insufficient, the line breaks to preserve the reading logic. A warning indicator marks charts with gaps and explains the issue on hover.

Chart gaps caused by missing metric data.
Fig. 17.Chart gaps caused by missing metric data.
3.3

Collaboration and access

Reports work as collaborative objects with discussion, owners, and permissions. Comments, access management, role changes, and access requests stay inside the report flow so ownership and permission questions stay tied to a dashboard or report page.

Comments, access management, role changes, and access requests stay inside the reporting flow, so questions, ownership, and permissions remain attached to the dashboard or report page.

The comments panel lets teams discuss report metrics in the same view where the metric is read. It includes empty, single, multiple, full, and short comment states, keeps the selected week visible, and follows a WYSIWYG model for editing.

Administrators can edit or remove comments. Risky actions use confirmation dialogs: deleting a comment, or leaving an empty full-comment input after editing.

Comment panel states for a report.
Fig. 18.Comment panel states for a report.

Report access is managed through a modal with users, roles, and available actions. The list shows employees who already have access; search finds people in the corporate directory, the role selector shows available permissions, and removing all roles removes the person from the access list.

Access management modal with users and roles.
Fig. 19.Access management modal with users and roles.

When a dashboard or report page is closed, the interface gives a clear request path. Access can be requested from the product entry point, from the workspace selector, or from a closed page inside the workspace, with a request form shown for each attempt.

Fig. 20.Access request flow for a dashboard or report page.
3.4

Administration

A recurring report has to remain serviceable in use: presentations need updates, metadata has to be edited, data has to be refreshed, exports have to match the current context, and mailing recipients have to remain manageable.

Presentation files have two sides of use: readers download the current PDF for a selected month and see when it was updated; administrators upload, replace, or delete the files behind that download.

The admin area contains product information, upload logs, missing metrics, data rows, and report mailing recipients.

Fig. 21.Presentation upload and download for a selected report.

The admin modal gathers service actions for regular reports: edit product information, monitor upload completeness, filter missing metrics, inspect data logs, freeze or delete rows, and manage report mailing recipients.

Fig. 22.Admin area for maintaining recurring reports.

Data operations

Data operations support the report after it has been created: administrators update descriptions, refresh data, export selected materials, and keep documentation connected to the interface logic.

4.1

Operations

An administrator can rename a chart, update its description, import CSV data, and export the selected chart or the entire report in a prepared layout.

Editing chart information covers the title, subtitle, and help text of a report block. The interface supports different combinations of these fields and keeps the layout stable when optional text is absent.

Fig. 23.Admin editing a chart title and description.

CSV import gives administrators a fallback path for refreshing report data when automatic updates are not enough or are no longer current. The import dialog lets an administrator choose the product, upload a file, and see the resulting state after upload.

Fig. 24.CSV import for updating chart data in a report.

Export supports XLSX and PDF for the whole page or for a single chart. The export follows the current report context, including selected product, period, and filters.

The PDF output renders charts as images and removes unnecessary interface controls, leaving a clean report file for sharing or further analysis.

Fig. 25.Export settings for format, date range, chart, and full report.

Result

5.1

Result

The result is a maintained product for recurring analytics.

Workspaces define ownership and access, navigation keeps reports readable, chart mechanics explain what happens to metrics, and administrative tools keep data, presentations, exports, and documentation current.

For internal analytics teams this creates one place for the reporting cycle: read the metric, understand the context, discuss it, request access, update data, export materials, and keep the report maintainable.

2026