logoMain

Facets.cloud

Internal Developer Platform
for every team

fc-banner

PROJECT OVERVIEW

About

Facets.cloud is an internal developer platform that allows developers to interact independently with their organization’s cloud applications.

Their product platform enables the developers to self-serve environments, releases, databases and anything else they need to run the apps.

Objectives

The Facets.cloud B2B product needed a redesign as they wanted to expand their reach by catering the global market. In addition to that, some new designs were created on introduction of new modules.

An efficient design was to be created which would include resuable design components and would provide consistent user experience throughout the product.

Old Designs

The old design of the product had many issues like

fc-env0
fc-environment-overview 1
fc-dashboard
fc-cluster

DESIGN PROCESS

Discover

Define

Design

1

DISCOVER

We conducted a stakeholder workshop to understand the brand, its product. Based on their inputs, we derived certain brand attributes that gives an idea that how the brand should be perceived by users.

Also, clients gave us a product walk-through which gave us a better understanding of the product its functionalities. Further, we started exploring the product and formulated various visual components like header, navigation bar, forms, data tables, cards, lists, etc.

2

DEFINE

After formulating elements, we started to define the visual language of the product.

On selecting the moodboard, we created respective color palette and decided the iconography style for the visual design.

Based on these details, we created initial screens to get an idea of visual components and then shared with the stakeholders to get their feedback.

3

DESIGN

After getting feedback from stakeholders, we started creating visual design components like form inputs, buttons, tags, data tables, etc.

Based on these components, we started with the visual designs of the various modules of the product.

Typography

Inter

ABCDEFGHIJKLMNOPQRSTUVWXYZ
ABCDEFGHIJKLMNOPQRSTUVWXYZ
1234567890
Light
Aa
Regular
Aa
Medium
Aa
Semi Bold
Aa
Bold
Aa

Colors

facets.color-pallet

Iconography

Initial Key Screens

fc-environments
fc-create-env-details

Components

FC-Login

Environment Releases

Release page to view statistics and history of the environment releases. Now, you can easily schedule your releases or manually release the environment too.

Empty State

We have created empty states at various stages like empty blueprints, empty release, no search results, etc. Here’s one of them showing that environment isn’t launched yet.

fc-no-releases

Application Overview

Application Overview page which gives summary of your cloud application. Get information on Application Graphs, KPIs like RAM & CPU Usage, Dependencies, etc.

fc-app-overview

Blueprint Environments

Check out all the environments created inside any blueprint. You can also pause the production and check out the applications created inside the blueprint.

fc-environments-1

Drift Detection by comparison

Drift detection page to detect the manual overrides done inside different environments of the blueprint.

fc-application-diff-comparison

Hear it from our client

Our Recent Projects