A real time data analytical dashboards

Designing integrated AI based
end to end platform

Vunet allows a comprehensive bird’s eye view of the IT operations to derive real time business and operational insights on the platform with ITSM tools.

Brief

Provide a holistic view of the end to end user journey.
Help in turning organisations from reactive to proactive.
Capability to adapt and personalise the workflows for an organisation.
Provide real time business insights & analytics
Fast and quick remediation process.

Discover

The team facilitated workshops with stakeholders and end-users to gather insights around current understanding, usage & expectations

Understanding

Interviewing key stakeholders to gather insights about business goals

Research

This phase typically includes both user research and market research

Insights

Drawing insights from all the data collected during the research phase

Wireframing

Visualizing the basic structure of future pages and how they fit together

UI Design

Creating a system of components, patterns, and styles for UI design

Testing

Verifying that every function of an app is working exactly as required

Product Discovery

Understanding brief

Understand the product as they had already an MVP released.

Success KPI Metrics

Gathered more ideas that leaded solving in the form of requirements.

User Groups

Which user group spends how much time on the VuSmart Maps platform.

We covered the watching behavior of every user group this product intends to cater

L0 / L1 User

Persona + Experience map

First responders Monitoring Incident handling Analysis

User story: L0 / L1 users are techops team members who are trained to do 24x7 eyeball monitoring for the application infrastructure. They monitor dashboards and raise incidents when issues occur.

Experience map

Monitor Dashboard

Monitor & report success and failure rates

Check metrics

Slice & dice transaction metrics to find % decline rates

Share the analysis

Escalate to L2, L3 teams with the visualizations

A few users face difficulty in using the Dashboard as there is not enough contextual data on the dashboard and the UI is cluttered and not organised. They usually login to the platform only when there is an alert.

The users have to enter the exact values and tags in order to access data, select category/type and have to identify if the issue is external or internal, hence exceeding more than the recommended 3 clicks to do the root cause analysis

Goals

To make sure that the application is always up and running.

To alert the L2 / L3 users about the incident efficiently and quickly.

To gather insights about the health of an app quickly and in an efficient way

Opportunities to look for...

Feels frustrated as the dashboard’s response time is slow

Has to remember specific keywords in order to search any data metric.

Has to go through multiple steps to identify the problem.

Doesn’t find the platform user friendly

L2/L3 User

Persona + Experience map

First respondents Proactive Ambitious Hard working

User story: L0 / L1 users are techops team members who are trained to do 24 x7 eyeball monitoring for the application infrastructure. They look at the storyboards/ visualization and gather insights about the status of the application. If they find any problem, they reach out to L1 / L2 teams and notify them about the problem via mail/ call.

Experience map

Check app Dashboard

Load the specific app dashboard based on the alerts raised

Corrective Measures

Identify the root cause of the issue - Internal or External

Remediation

Connect internally and involve concerned teams to work on the issue

Goals

To identify root cause of an issue and take corrective actions.

To check on alerts from monitoring products.

To provide different datasets to Support Head.

To create various reports for Support head and CIO/CTO.

Pain Points

Feels frustrated as the dashboard’s response time is slow

Does not regularly monitor as he finds plaform difficult to use.

Only uses the platform if any alert is raised by L0 / L1 team.

Opportunities to look for...

Provide quick and easy access to operational storyboards.

Contextual alerts with lot of relevant data.

A ticketing system within Vunet for smoother internal communication.

Provide quick and easy access: To download reports

Approach

A revolutionary idea of having a single language streaming platform. An opportunity to increase user base and subscriptions by:

Navigation Hierarchy

Improved visual hierarchy of the components and better visibility of data to ensure a much more efficient workflow.

Optimization

Optimizing and understanding user behavior and increasing task effectiveness & Efficiency.

Contextual Design

Improved UX by giving users the ability to have personalization/customization built into the core of the product that can significantly improve their workflow.

Insights

Using historical data to predict future outcomes and thereby assisting users to take decisions and perform tasks that are more efficient and beneficial to the user.

DEFINE

Our primary focus was to design the Dashboard. We defined multiple problem statements to solve through design, by understanding our different user personas, journey maps, empathy maps, competitor analysis, information architecture and task flows. Taking into consideration all the above points, our aim was optimized the current structure and designed a system that worked intuitively for all the users

Once the approach was set and finalized, we started with mapping out the IA which shows flow across the platforms and their connectivity.

Based on the user stories & prerequisites, Lollypop design studio introduced exceptional & distinctive features in the dashboard.

WIREFRAMES

Once we had the IA finalized after iterations, we started with wireframes, Below are the high fidelity of wireframes which were created and later pushed to Visual design stage. Keeping in mind all the above points, we need to ensure that the pain points and the opportunity of each perona was addressed. We ensured a very smooth and simple onboarding process, followed by a very intuitive, dynamic and visually rich dashboard.

TYPOGRAPHY

We chose Heebo for simple, clear and bold letters. Our team focused on the proportions, the spacing, the overall look and feel. It didn’t have a lot of fussy details or mannerisms. The open, circular forms gave it a “friendly” appearance, especially in the lowercase and also number focused.

Heading H1

40px Regular, Line Height 48px

Heading H2

31px Regular, Line Height 42px

Heading H3

28px Regular, Line Height 40px

Heading H4

20px Regular, Line Height 30px

Heading H5,P

16px Regular, Line Height 24px

Heading H6

13px Regular, Line Height 20px

Heading H7

10px Regular, Line Height 14px

A real time data driven dashboards

An AI enabled analytical tool

Vunet allows a comprehensive bird's eye view of the IT operations to derive real time business and operational insights on the platform with ITSM tools.

Regular

Medium

Bold

Heebo is a Hebrew and Latin typeface family, which extends Christian Roberton's Roboto Latin to Hebrew. The Hebrew was drawn by Oded Ezer and the font files were mastered by Meir Sadan.

COLOURS

aha wished to bring in a new-wave of orange in entertainment for the Telugu-speaking audience, across the world

An AI based end to end platform

UI Design

We evaluated our designs internally with proven practices to measure their effectiveness in regards to credibility and usability. The resultant was a cohesive experience ecosystem around that felt curated, usable and useful for users.

The value add we brought in was with an intuitive and interactive regionalized experience, faster way of exploring content and easy to use interface that gave a feeling of personalised experience and interface across Mobile, Web and Television.