Skip to main content

VisualSign Protocol

VisualSign transforms raw blockchain transactions into human-readable visualizations. Instead of showing users hexadecimal strings or complex data structures, VisualSign presents clear, understandable information about what a transaction will do.

Core Concept​

Simple Transfer​

Raw Transaction:
0xf86c808504a817c800825208943535353535...

        ↓ VisualSign Parser ↓

Visual Representation:
┌─────────────────────────────┐
│ Ethereum Transfer           │
├─────────────────────────────┤
│ To: 0x3535...3535          │
│ Amount: 1.0 ETH            │
│ Gas: 21000 @ 20 gwei       │
└─────────────────────────────┘

Complex DeFi Interaction​

VisualSign's true power shows when parsing complex DeFi transactions. Here's a real Uniswap transaction with multiple nested operations:

Raw Transaction (1236 characters of hex):
0x02f904cf0181b78477359400847c17b3e383045307943fc91a3afd70395cd496c647d5a6cc9d4b2b7fad80b904a424856bc3...

        ↓ VisualSign Parser ↓

Visual Representation:
┌─ Universal Router
│  Title: Uniswap Universal Router Execute
│  Detail: 4 commands
│
├─ 1. Permit2 Permit
│     Allow router to spend tokens
│     Token: 0x72b658...e417
│     Expires: 2025-12-15
│
├─ 2. V2 Swap Exact In
│     Swap 46.52 tokens for >=0.00276 WETH
│     Path: Token → WETH (1 hop)
│
├─ 3. Pay Portion
│     Pay 0.25% fee to protocol
│
└─ 4. Unwrap WETH
      Convert >=0.00275 WETH to ETH
      Send to: 0x8419e7...6cF

This visualization transforms an incomprehensible hex string into a clear sequence of operations that users can understand and verify before signing.

Visualization Philosophy​

VisualSign follows these principles for creating transaction visualizations:

1. Progressive Disclosure​

Show the most important information first, with details available on demand.

{
  "Type": "preview_layout",
  "PreviewLayout": {
    "Condensed": {
      "Fields": [/* Essential info */]
    },
    "Expanded": {
      "Fields": [/* All details */]
    }
  }
}

2. Context-Aware Display​

Different transaction types get different visualizations:

  • Transfers: Emphasize amount and recipient
  • Swaps: Show token pairs and rates
  • Contract Calls: Display method and parameters
  • NFT Operations: Include metadata and previews

3. Risk Highlighting​

Critical information is prominently displayed:

  • Large value transfers
  • First-time recipients
  • Contract interactions
  • Irreversible operations

Architecture​

┌────────────────────────────────────────────┐
│              Chain Modules                 │
├────────┬────────┬────────┬────────┬───────┤
│Ethereum│ Solana │  Sui   │Bitcoin │  ...  │
└────────┴────────┴────────┴────────┴───────┘
         │         │         │         │
         └─────────┴─────────┴─────────┘
                       │
              ┌────────────────┐
              │  Core Parser   │
              └────────────────┘
                       │
              ┌────────────────┐
              │ Visualization  │
              │    Engine      │
              └────────────────┘
                       │
              ┌────────────────┐
              │  VisualSign    │
              │     JSON       │
              └────────────────┘

Supported Chains​

Each blockchain has unique transaction structures requiring specialized parsing:

Ethereum​

  • Native transfers: ETH movements
  • ERC-20 tokens: Token transfers and approvals
  • Smart contracts: Method calls with decoded parameters
  • DeFi protocols: Swaps, liquidity, lending

Solana​

  • Programs: System, Token, Associated Token programs
  • Instructions: Multiple instructions per transaction
  • Accounts: Signers, writable, readable accounts
  • Compute units: Resource consumption

Bitcoin​

  • UTXOs: Inputs and outputs
  • Scripts: P2PKH, P2SH, SegWit
  • Fee calculation: Satoshis per byte

Sui​

  • Objects: Owned and shared objects
  • Move calls: Module and function identification
  • Gas objects: Payment for execution

Next Steps​