Currently, I am designing a product called SpaceONE. SpaceONE is a multi-cloud management platform. I joined the SpaceONE team as a product designer two years ago as one of two designers in a team of over 20 engineers. I support design across every aspect of our business, being responsible for UX and UI design and establishing a design system-called ‘Mirinae Design System’.
I am responsible for the design of the desktop, tablet, and mobile (responsive design).
Introduction
Multi-cloud is when an organization uses cloud providers from more than two cloud providers. (Examples of cloud providers: AWS (Amazon), Azure (Microsoft), GCP (Google), Oracle, IBM, …)
M U L T I - C L O U D
Reduces unplanned downtime or outages since it reduces the risk of a single point of failure.
Have more flexibility and avoid one cloud provider lock-in
Why should organizations use multi-cloud?
What is multi-cloud ?
Problem:
Most cloud providers have different features, varying tools, SLAs, and APIs for management, so the more cloud providers they use, the more complex the task of managing cloud providers becomes.
Most IT teams lack the time and resources to manage each cloud provider separately.
By using a multi-cloud platform that I am designing, organizations can:
Ensure high availability to prevent website outages
Develop strong data protection
Acquire competitive pricing between cloud providers
Have constant access to network performance improvements
Take advantage of the best combination of pricing and performance across different providers.
Why use a multi-cloud strategy?
Customize dashboards and widgets for the best overview
Because of product strategy, it is essential to show visually comprehensive information for their multi-cloud situations. The solution for this was a dashboard design. Dashboards let users see their most important information at a glance and also give them the ability to observe what's happening in real time in relation to historical data.
prevent website outages → incident checking dashboards
best pricing → cost checking dashboards
The dashboard design has a high emphasis on this product, and I am the designer who created three of the four dashboards.
Challenge
Each of the different dashboards provided straightforward information. However, as more users used it, they began to want only the information they desired.
We decided on a unified design for all widgets, so users can make a dashboard with any widget that they care about most. Also, enable dashboards to create, customize and share.
Each dashboard had visually distinct hierarchies and priorities. There was no sense of cohesion or collaboration in the user interface or experience.
O V E R V I E W
Context
Provide lack of a cohesive collaborative look and experience
Problem
Goal
Our goal is to deliver the ideal dashboard for multi-clouds management, and we provide an exact list of information through customization.
The team used agile development to prioritize moving quickly and launching new services. Once the engineers finished their development, I created a dashboard with widgets. As a result, four distinct dashboards were developed.
Competitive analysis
I conducted a competitive analysis to study how other products handle similar problems. I picked four competitive products to compare the onboarding flows to learn how to effectively deliver the message in the product.
In order to understand what makes an effective dashboard, I looked through customized dashboards on well-known platforms. The following is a list of their key success factors:
Identical widget size (or height) to have a well-organized dashboard
Graph colors are clear to view and compare
Widgets have clear and easy data designs to view
Smooth flow to customize
R E S E A R C H
To better understand our potential users, I began interviewing six engineers to learn how they got started with the competitive product’s dashboard. I asked them to walk me through the experience when they first used it and created a new dashboard.
Interview
User flow
In order to visualize and make more tangible the individual steps that a user makes during the customization of dashboards.
S T R U C T U R E
Information architecture
Based on the insights gained from the initial competitor analysis, and interviews with potential users, I defined the sitemap.
collected all possible widgets
Samsung is our main customer. After they tried the prototype, I received hundreds of comments via Figma or online meetings over the period of three weeks. By doing this, we could capture how actual users were using our customized dashboard and what value they took from it.
Prototyping & usability-testing
Three main feedbacks
P R O T O T Y P E
Pain points
Visually disorganized.
Lack of customization.
a widget with a well-organized
customizable mode
be able to use the dashboard to print reports
filter settings need to be simple to use
Design and Needs of users
L E A R N F R O M R E S E A R C H
I checked all widgets to ensure they looked consistent and delivered accurate information.
Unite widget layouts
D E S I G N D E C I S I O N S # 1
Define layout rules
I produced just one variable-sized component. In this way, engineers can easily develop and maintain consistency in the design.
Create a color palette
To make it simple for users to compare, we ordered the colors by clear contrast and arranged them to follow one another.
Design process 1
Design process 2
Flow of customization mode
D E S I G N D E C I S I O N S # 2
Flow of customize mode
Simple steps to add new widget
Customization mode filters
O U T C O M E
Through Google Analytics
C O N C L U S I O N
We discovered through Google Analytics that consumers stay in our product 20% longer to check on their projects after opening the customized dashboard.
I had many positive feedback about the usability of the customization mode and ease of visual design from Samsung, KB, and many other customers.
Home dashboard is a feature that’s always seen by users as it is the first page. However, data from the Google Analytics tool reveals that most of our readers spend a relatively brief amount of time on this page. So we decided to make a workspace home page and place the custom dashboards that I worked on.
Next level
I'm in charge of UX writing.
Products should talk consistently, just as they should act and look consistently. We speak with one voice and vary our tone depending on the situational context.