NUEVO: Helius adquiere Light Protocol
experiencia de usuario de web3
Blog/Desarrollo

UX segura y sin fricción: el stack tecnológico que incorpora a millones de usuarios a Solana

Infraestructura de walletsPrivy en XPrivy en LinkedIn
Ingeniero principal de Solana, PrivyDanny B. en XDanny B. en LinkedIn
6 min de lectura

Una guía para desarrolladores sobre cómo usar Privy y Helius para ofrecer wallets integradas, transacciones sin gas e incorporación sin fricción.

Hoy, la mayoría de las aplicaciones de criptomonedas orientadas al consumidor dependen de wallets externas. Esto obliga a los usuarios a gestionar frases semilla, pasar por múltiples redirecciones y aprobar manualmente cada transacción.

Para el usuario común que no conoce blockchain, esto es demasiado. Las frases semilla, las comisiones de gas y las ventanas emergentes de las wallets no solo generan fricción: también provocan abandonos. Como resultado, las aplicaciones con productos excelentes pierden usuarios antes de que siquiera comiencen.

No tiene por qué ser así.

En esta guía, aprenderás a crear experiencias onchain fluidas para Solana con Privy y Helius. Podrás ofrecer transacciones sin gas, wallets integradas y operaciones instantáneas con una latencia de < 20 ms.

Veremos cómo:

  • Crear wallets integradas de autocustodia con inicios de sesión sencillos (correo electrónico, redes sociales, SMS) y, al mismo tiempo, admitir wallets externas como Phantom, Solflare, Backpack y más, todo desde el SDK de Privy
  • Habilitar transacciones sin gas patrocinando las comisiones mediante wallets seguras
  • Integrar rampas de entrada fiat como MoonPay o Coinbase Pay en tu UI
  • Transferir liquidez de forma nativa a Solana sin fricción
  • Crear aplicaciones móviles con una UX onchain fluida que se sienta como Web2

Veamos qué se necesita para incorporar a los próximos millones de usuarios mediante tu aplicación de Solana.

La incorporación a las criptomonedas en la práctica: ejemplos de DeFi y aplicaciones de consumo

Una incorporación fluida no es solo algo conveniente; multiplica el crecimiento. Las aplicaciones que aprovechan las wallets integradas pueden lograr una retención mensual de usuarios superior al 40 %, especialmente cuando se dirigen a personas nuevas en el mundo de las criptomonedas.

Para la mayoría de los consumidores, conceptos propios de las criptomonedas como el gas, el deslizamiento, las comisiones de prioridad y las propinas son desconocidos y abrumadores.

Para retener a los usuarios, las aplicaciones deben facilitar la incorporación. Esto significa permitir que interactúen con stablecoins como USDC o cubran las comisiones de gas mediante transacciones patrocinadas.

El objetivo es simple: permitir que los usuarios firmen, intercambien y hagan staking sin tener que aprender cómo funcionan las criptomonedas.

Pump.fun — Plataforma de lanzamiento de tokens

Pump.fun es una de las plataformas de trading de mayor crecimiento en Solana. Combina wallets integradas con transacciones sin gas para ofrecer operaciones instantáneas con un solo toque, sin ventanas emergentes, aprobaciones ni cambios de wallet.

La experiencia Advanced se creó inicialmente para traders de alta frecuencia, pero demostró ser tan eficaz que se habilitó para todos los usuarios.

Hoy, cualquiera puede lanzar un token y comenzar a operar desde un dispositivo móvil en segundos. Algunos usuarios incluso han procesado millones de dólares mediante wallets impulsadas por Privy, sin salir de la aplicación móvil.

Jupiter — Agregador de DEX

La experiencia Quick Account de Jupiter demuestra el potencial del trading fluido. Cada usuario, ya sea que inicie sesión mediante Phantom, Solflare, Backpack o incluso solo con su correo electrónico o X, interactúa con la infraestructura de wallets integradas de Privy detrás de escena.

Esta configuración permite ejecutar operaciones instantáneas sin tener que firmar transacciones y ofrece siempre una ruta de ejecución sin fricción al mejor precio.

Cuando estén listos, los usuarios pueden exportar sus claves a wallets externas. Así conservan el control total y evitan quedar atados a un proveedor.

Moonwalk — Aplicación móvil para ganar caminando

Moonwalk ofrece una incorporación móvil sin fricción al permitir que los usuarios se registren con su correo electrónico, redes sociales o SMS, como en cualquier otra aplicación de consumo Web2.

Detrás de escena, cada registro crea automáticamente una wallet integrada y totalmente funcional mediante Privy. Los usuarios no tienen que preocuparse por frases semilla, extensiones de wallet ni configuraciones específicas de criptomonedas.

En cambio, solo comienzan a caminar y ganar, sin siquiera darse cuenta de que están onchain.

Cómo crear una UX onchain fluida: financiamiento nativo de cuentas

Crear wallets integradas detrás de escena es solo el comienzo. Para ofrecer una experiencia de aplicación verdaderamente fluida, los desarrolladores también deben resolver el financiamiento de cuentas y la liquidez entre cadenas, dos de las causas más comunes de abandono.

Rampas de entrada integradas

Las mejores aplicaciones de consumo eliminan la fricción en cada paso, incluido el momento en que un usuario necesita depositar fondos en su wallet.

Al integrar rampas de entrada fiat directamente en la experiencia de la aplicación, los usuarios pueden comprar SOL o USDC sin salir de la interfaz.

El SDK de Privy facilita la integración de proveedores de rampas de entrada como MoonPay y Coinbase Pay. Así, los usuarios pueden comprar activos de Solana de forma nativa con solo unos clics.

Puentes nativos

Otro avance clave son los puentes de liquidez nativos. Si la wallet de Solana de un usuario no tiene fondos suficientes, los desarrolladores pueden configurar sus wallets de Privy para transferir saldos desde una cadena EVM como Ethereum, Base o Polygon.

Esto convierte tu aplicación en un destino de liquidez: atrae activos desde donde ya se encuentran tus usuarios y los lleva directamente a tu experiencia de Solana. Sin cambiar de aplicación. Sin copiar direcciones de wallet. Solo una transferencia de valor fluida entre cadenas.

Cómo configurar transacciones sin gas con Privy y Helius

Además del financiamiento de cuentas y los puentes entre cadenas, las wallets de Privy ofrecen una gestión segura de claves y están diseñadas específicamente para configuraciones de pagadores de comisiones, a diferencia de los pares de claves tradicionales.

1. Crea una wallet administrada

Para configurar transacciones sin gas para tus usuarios, necesitarás crear una wallet administrada que actúe como “pagador de comisiones”.

Esta wallet cubrirá las comisiones de gas en nombre de tus usuarios y les ofrecerá una experiencia fluida y sin costo.

Una vez que habilites las wallets administradas en tu panel de Privy, podrás crear una de forma programática en el servidor mediante el SDK de Privy para Node.js.

Uso del SDK de Privy para NodeJS:

Código
import { PrivyClient } from '@privy-io/server-sdk';

// Initialize the Privy client
const privy = new PrivyClient({
  apiKey: process.env.PRIVY_API_KEY
});

// Create a new Solana managed wallet
async function createFeePayerWallet() {
  const { id, address, chainType } = await privy.walletApi.create({
    chainType: 'solana',
    policyIds: ['optional_policy_id'],
    idempotencyKey: 'unique_request_identifier'
  });

  console.log(`Created fee payer wallet with ID: ${id}`);
  console.log(`Wallet address: ${address}`);

  return { id, address };
}

// Make sure to fund this wallet with SOL to cover transaction fees

El ID y la dirección de la wallet se usarán en los pasos siguientes para patrocinar transacciones.

2. Implementa transacciones patrocinadas

Una vez que hayas configurado y financiado la wallet administrada, podrás comenzar a habilitar transacciones sin gas para los usuarios.

Cuando un usuario se autentica, Privy crea una wallet integrada vinculada a sus credenciales de inicio de sesión. Los usuarios firman las transacciones como siempre, pero, en lugar de enviarlas a la blockchain, la transacción se envía a tu backend. Allí, tu wallet administrada la firma y la envía por ellos.

Esta configuración permite ofrecer una experiencia de usuario fluida, mientras los usuarios mantienen el control total de sus claves.

Implementación del lado del cliente (React con el SDK de Privy)

Código
import { useSolanaWallets } from '@privy-io/react-auth/solana';
import {
  TransactionMessage,
  PublicKey,
  VersionedTransaction,
  Connection
} from '@solana/web3.js';

async function sendGaslessTransaction(instructions) {
  // Get user's embedded wallet
  const { wallets } = useSolanaWallets();
  const embeddedWallet = wallets.find(wallet =>
    wallet.walletClientType === 'privy'
  );

  if (!embeddedWallet) {
    throw new Error('No embedded wallet found');
  }

  // Connect to Solana via Helius for better performance
  const connection = new Connection('https://mainnet.helius-rpc.com/?api-key=YOUR_HELIUS_API_KEY');
  const { blockhash } = await connection.getLatestBlockhash();

  // Set your managed wallet as fee payer
  const feePayerAddress = 'YOUR_PRIVY_SERVER_WALLET_ADDRESS';

  // Build transaction with managed wallet as payer
  const message = new TransactionMessage({
    payerKey: new PublicKey(feePayerAddress),
    recentBlockhash: blockhash,
    instructions
  }).compileToV0Message();

  const transaction = new VersionedTransaction(message);

  // Have user sign the transaction
  const provider = await embeddedWallet.getProvider();
  const serializedMessage = Buffer.from(
    transaction.message.serialize()
  ).toString('base64');

  const { signature } = await provider.request({
    method: 'signMessage',
    params: { message: serializedMessage }
  });

  // Add user signature
  const userSignature = Buffer.from(signature, 'base64');
  transaction.addSignature(
    new PublicKey(embeddedWallet.address),
    userSignature
  );

  // Send to your backend for fee payer signature
  const serializedTx = Buffer.from(
    transaction.serialize()
  ).toString('base64');

  const response = await fetch('/api/sponsor-transaction', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ transaction: serializedTx })
  });

  const { transactionHash } = await response.json();
  return transactionHash;
}

Por último, la transacción parcialmente firmada se envía desde el cliente a tu backend. Allí, se verifica, la wallet administrada la firma y se transmite a la red de Solana.

Implementación del backend (ruta de API de Next.js)

Código
// pages/api/sponsor-transaction.js
import { VersionedTransaction } from '@solana/web3.js';
import { PrivyClient } from '@privy-io/server-sdk';

// Initialize Privy SDK
const privy = new PrivyClient({
  apiKey: process.env.PRIVY_API_KEY
});
// For App Router (Next.js 13+)
export async function POST(request) {
  try {
    const { transaction: serializedTx } = await request.json();

    // Deserialize the transaction to verify it (optional)
    const txBuffer = Buffer.from(serializedTx, 'base64');
    const transaction = VersionedTransaction.deserialize(txBuffer);

    // Verify the transaction (check fee payer, validate against policies)
    // ...verification logic here...

    // Sign AND send with your Privy managed wallet in one step
    const serverWalletId = process.env.PRIVY_SERVER_WALLET_ID;
    const { hash } = await privy.walletApi.solana.signAndSendTransaction({
      walletId: serverWalletId,
      caip2: 'solana:EtWTRABZaYq6iMfeYKouRu166VU2xqa1', // Mainnet
      transaction: serializedTx,
      rpcUrl: 'https://mainnet.helius-rpc.com/?api-key=YOUR_HELIUS_API_KEY',
      options: {
        maxRetries: 5,
        skipPreflight: true
      }
    });

    return Response.json({
      transactionHash: hash,
      message: 'Transaction sent successfully'
    }, { status: 200 });
  } catch (error) {
    console.error('Error processing transaction:', error);
    return Response.json({
      error: 'Failed to process transaction',
      details: error.message
    }, { status: 500 });
  }
}

Al combinar las wallets seguras de Privy con la infraestructura optimizada para transacciones de Helius, puedes ofrecer a tus usuarios una experiencia fluida y sin gas, sin sacrificar confiabilidad ni flexibilidad.

El stack más flexible para crear experiencias de aplicación fluidas

El SDK modular de Privy, junto con los nodos RPC de alto rendimiento de Helius, ofrece a los desarrolladores una base potente y flexible para crear aplicaciones de Solana de primer nivel.

Ya sea que comiences con una API de wallet de bajo nivel y uses tu propio stack de autenticación, o que utilices Privy para la autenticación y otras funciones avanzadas como la autenticación multifactor (MFA), las rampas de entrada integradas o los puentes nativos, el stack de Privy se adapta a las necesidades de tu producto.

Recursos adicionales

Suscríbete a Helius

Mantente al día con las novedades del desarrollo en Solana y recibe actualizaciones cuando publiquemos