Skip to content

Commit

Permalink
Update product descriptions and images
Browse files Browse the repository at this point in the history
  • Loading branch information
@yashovardhan
yashovardhan committed Nov 8, 2024
1 parent 282f1b5 commit a035df4
Show file tree
Hide file tree
Showing 45 changed files with 512 additions and 710 deletions.
21 changes: 12 additions & 9 deletions docs/features/mpc.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,8 @@ title: Multi-Party Computation
description: "Multi-Party Computation | Documentation - Web3Auth"
---

import KeyManagement from "@site/static/images/key-management.png";
import KeyManagementDark from "@site/static/images/key-management-dark.png";
import KeyManagementLight from "@site/static/images/key-management-light.png";
import { mpccorekit } from "@site/src/components/SDKReferenceCards";

Multi-Party Computation (MPC) forms the backbone of Web3Auth's advanced wallet infrastructure,
Expand Down Expand Up @@ -64,16 +65,18 @@ Web3Auth's MPC is implemented in two main forms:
signature generations instead of key reconstructions, maintaining the integrity of the
distributed private key.

{" "}

<img
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
src={KeyManagement}
alt="Showing How Web3Auth Key Generation works"
/>
<picture>
<source srcset={KeyManagementLight} media="(prefers-color-scheme: light)" />
<source srcset={KeyManagementDark} media="(prefers-color-scheme: dark)" />
<img
src={KeyManagementLight}
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
alt="This diagram describes the relationship between the Web3Auth SDK and integrating application"
/>
</picture>

Both methods adhere to the core concept of threshold-based security but differ in their approach to
key management and signature generation.
wallet management and signature generation.

## Web3Auth Wallet Management Infrastructure

Expand Down
104 changes: 11 additions & 93 deletions docs/how-web3auth-works.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,8 @@ image: "images/docs-meta-cards/documentation-card.png"
description: "How Web3Auth Works? | Documentation - Web3Auth"
---

import TkeyIntroduction from "@site/src/common/docs/_tkey-intro.mdx";
import Web3AuthWorking from "@site/static/guides/web3auth-pnp-working.png";
import KeyManagement from "@site/static/images/key-management.png";
import PnPCoreKitFlow from "@site/static/images/pnp-core-kit-flow.png";
import SFAInfra from "@site/static/images/sfa-infra.png";
import PnPCoreKitFlowDark from "@site/static/images/pnp-core-kit-flow-dark.png";
import PnPCoreKitFlowLight from "@site/static/images/pnp-core-kit-flow-light.png";

Web3Auth operates as a wallet infrastructure, providing enhanced flexibility and security for
decentralized applications (dApps) and blockchain wallets. Throughout this documentation, we'll
Expand All @@ -25,94 +22,15 @@ The diagram below describes the relationship between the Web3Auth SDKs and integ
It also depicts the difference between the products Web3Auth offers, to enable a developer-friendly
integration of this infrastructure.

<img
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
src={PnPCoreKitFlow}
alt="This diagram describes the relationship between the Web3Auth SDK and integrating application"
/>

### Plug and Play SDKs

A Web3Auth Plug and Play integration process is designed to be developer-friendly, requiring only
the initialization of the Web3Auth SDKs and the set up of necessary configurations. Once integrated
into your application, the SDK facilitates the embedding of the login function. This allows
developers to utilize the SDK to authenticate users by invoking the connect function, which can be
activated via a login button or any user-triggered event.

Once the user starts the process:

1. User is redirected to our portal (`auth.web3auth.io`)
2. Our portal, `auth.web3auth.io`, then handles the initial process of login
3. The user is redirected to the login/OAuth provider and carries out the authentication process
concerning their auth provider
4. The user is redirected back to our portal, which then handles the reconstruction of the user’s
key
5. Finally, once the user is successfully authenticated, they are redirected back to the
application, with a derived key specific to the application/wallet

##### Here's a diagram showing this process:

<img
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
src={Web3AuthWorking}
alt="Web3Auth working"
/>

### Core Kit SDKs

The Core Kit SDKs serve as the backbone of the Web3Auth Plug n Play (PnP) SDKs. They form the
essence of the Web3Auth infrastructure and allow for direct usage within decentralized applications
(dApps) to foster deeper integration. They are further divided into two types of SDKs:

1. Single Factor Auth SDKs
2. Multi-Factor SDKs, like tKey SDK

#### Single Factor Auth SDKs

These SDKs allow for the integration of a single factor of authentication, such as social login,
into your dApp. They are designed to be simple to use and can be integrated into your dApp with
minimal effort, allowing you to directly use the Web3Auth Network for Wallet Management. This is one
of the most common use cases of Web3Auth, however, it is semi-custodial in nature, since the key is
custodial to the Auth Provider and the Web3Auth Network.

<img
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
src={SFAInfra}
alt="Single Factor Auth SDK Infrastructure"
/>

#### Multi-Factor Auth SDKs

An integral part of this infrastructure is the tKey SDK, the foundational SDK utilized for the
implementation of Web3Auth PnP and Core-Kit.

<TkeyIntroduction />

### MPC SDKs

With the Web3Auth infrastructure, your key is divided into multiple parts and stored across your
devices and our Auth Network. This ensures that your key is always available and never stored in a
single place. While in the traditional Web3Auth SDK, your key was dynamically reconstructed in the
front end using shamir secret sharing.

With the new Web3Auth MPC (Multi-Party Computation) architecture, it is **never reconstructed**.
Instead, these partial keys are stored across different locations, and your device is used to make
partial signatures for your message/ transaction. These are finally returned to the front end where
using TSS (Threshold Signature Scheme), these signatures are combined to make a final signature. You
can use this finally signed message/transaction to make a transaction on the blockchain.

The Threshold Signature Scheme (TSS) is a cryptographic primitive for distributed key generation and
signing. The use of TSS in Web3Auth's Auth network is a new paradigm that can provide numerous
benefits, especially in terms of security.

<img
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
src={KeyManagement}
alt="Showing How Web3Auth Key Generation works"
/>

As you can notice in this diagram above, the final output for the right side TSS architecture are
the signatures that can be used to make transactions on the blockchain.
<picture>
<source srcset={PnPCoreKitFlowLight} media="(prefers-color-scheme: light)" />
<source srcset={PnPCoreKitFlowDark} media="(prefers-color-scheme: dark)" />
<img
src={PnPCoreKitFlowLight}
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
alt="This diagram describes the relationship between the Web3Auth SDK and integrating application"
/>
</picture>

## Web3Auth Wallet Management Infrastructure

Expand Down
17 changes: 11 additions & 6 deletions docs/infrastructure/infrastructure.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@ description: "Web3Auth Wallet Management Infrastructure | Documentation - Web3Au
---

import Web3AuthAuthNetwork from "@site/static/images/auth-network.png";
import OverviewArchitecture from "@site/static/images/key-management.png";
import KeyManagementDark from "@site/static/images/key-management-dark.png";
import KeyManagementLight from "@site/static/images/key-management-light.png";
import NodeArchitecture from "@site/static/images/node-architecture.png";
import ShareSplitting from "@site/static/images/share-splitting.png";
import ReactPlayer from "react-player/youtube";
Expand Down Expand Up @@ -71,11 +72,15 @@ security. It is dependent on the integrating application.
a separate device, download, or base on user input with sufficient entropy. This could include a
password, security questions, or a hardware device, among other options.

<img
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
src={OverviewArchitecture}
alt="Showing How Web3Auth Key Generation works"
/>
<picture>
<source srcset={KeyManagementLight} media="(prefers-color-scheme: light)" />
<source srcset={KeyManagementDark} media="(prefers-color-scheme: dark)" />
<img
src={KeyManagementLight}
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
alt="This diagram describes the relationship between the Web3Auth SDK and integrating application"
/>
</picture>

## Web3Auth Infrastructure

Expand Down
17 changes: 11 additions & 6 deletions docs/infrastructure/mpc-architecture.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ description: "MPC Architecture - Web3Auth Wallet Infrastructure | Documentation
import ExpandingSharesFlow from "@site/static/images/expanding-shares-tss-flow.png";
import KeyInitialisationFlow from "@site/static/images/key-initialisation-tss-flow.png";
import KeyUsageFlow from "@site/static/images/key-usage-tss-flow.png";
import TKeyMPCFlow from "@site/static/images/tkey-mpc-flow.png";
import TkeyMpcFlowDark from "@site/static/images/tkey-mpc-flow-dark.png";
import TkeyMpcFlowLight from "@site/static/images/tkey-mpc-flow-light.png";

This document provides an in-depth exploration of the technical architecture of the MPC-based SDKs,
this includes the tKey MPC SDK and CoreKit MPC SDK (a rundown of our SDKs
Expand Down Expand Up @@ -71,11 +72,15 @@ transactions.

### TSS Key

<img
style={{ display: "block", margin: "20px auto" }}
src={TKeyMPCFlow}
alt="Web3Auth Wallet Management"
/>
<picture>
<source srcset={TkeyMpcFlowLight} media="(prefers-color-scheme: light)" />
<source srcset={TkeyMpcFlowDark} media="(prefers-color-scheme: dark)" />
<img
src={TkeyMpcFlowLight}
style={{ display: "block", maxHeight: "600px", margin: "20px auto" }}
alt="This diagram describes the relationship between the Web3Auth SDK and integrating application"
/>
</picture>

The user's setup starts by distributedly key generating (DKG) a 2 out of 3 (2/3) sharing,
$f_0(x) = a_0 + a_1x$, with three shares: $f_0(1), f_0(z_1), f_0(z_2)$ where
Expand Down
2 changes: 0 additions & 2 deletions docs/infrastructure/nodes-and-dkg.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,6 @@ title: Nodes and DKG
description: "DKG Nodes in Wallet Management | Documentation - Web3Auth"
---

import Image1 from "@site/static/images/key-management.png";

The Web3Auth Auth Network Nodes run a Distributed Key Generation protocol amongst themselves to
assign, store and return secrets/keys to users. In general within Auth Network, nodes manage a share
retrieved via conventional OAuth flows.
Expand Down
3 changes: 2 additions & 1 deletion docs/infrastructure/sss-architecture.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,8 @@ documentation, for simplicity, focuses on a 2/3 setup.

## Components

The accompanying image illustrates the typical flow of key management within the SSS Infrastructure.
The accompanying image illustrates the typical flow of wallet management within the SSS
Infrastructure.

<img
alt="SSS Flow and Components"
Expand Down
Loading

0 comments on commit a035df4

Please sign in to comment.