01 Qué es y para qué sirve
Avatar App Kit es un proyecto en Next.js que levanta en localhost un pequeño estudio conectado a la API de Higgsfield. No es un servicio en la nube de nadie: tú pones la clave y pagas tus créditos, y el código es tuyo para modificarlo.
Sirve para dos cosas. Como herramienta, para generar contenido visual rápido para redes, pruebas de producto o maquetas de campaña. Como kit de partida, para construir tu propia app de generación de imágenes sobre una base que ya resuelve lo tedioso: precios antes de generar, modelos disponibles por cuenta, reintentos y descargas.
Teleport
Una foto tuya y un lugar descrito en texto. Devuelve 1, 2 o 4 imágenes verticales en ese escenario.
Try-on
Tu foto y la foto de una prenda. Devuelve una imagen tuya con esa ropa puesta.
Duo
Tu foto y la de otra persona. Devuelve a los dos en la misma imagen.
Vídeo
Cualquier receta puede terminar en vídeo: primero genera la imagen y después la anima. La app muestra el precio combinado antes de empezar.
02 Instalación paso a paso
git clone https://github.com/Hainrixz/avater-appkit
cd avater-appkit
npm install
npm run dev-
1
Abre la app
Entra en http://localhost:3000 desde el navegador.
-
2
Consigue tu clave
En cloud.higgsfield.ai crea una clave de API. Tiene formato identificador y secreto separados por dos puntos.
-
3
Pégala en la app
Se guarda en una cookie httpOnly de tu navegador durante 30 días y solo viaja a tu servidor local, que la reenvía a Higgsfield. Comprobarla no gasta créditos.
-
4
Elige foto o vídeo y una receta
Sube tus imágenes, describe lo que quieres y revisa el precio que aparece en el botón antes de generar.
-
5
Descarga a tiempo
Los resultados caducan en unos 7 días. Usa el botón de descarga de la app.
Quiero instalar Avatar App Kit (repositorio Hainrixz/avater-appkit) en mi ordenador.
1. Comprueba que tengo git y Node 20 o superior; si falta algo, dime cómo instalarlo en mi sistema y espera.
2. Clona el repositorio en [CARPETA], instala dependencias y arranca el servidor de desarrollo.
3. Dime la dirección que tengo que abrir y dónde consigo la clave de Higgsfield.
No crees el archivo .env.local ni escribas ninguna clave: la pegaré yo en la app.03 Cómo sacarle partido
- ✓Usa fotos nítidas, con buena luz y la cara de frente; evita gafas de sol y filtros.
- ✓Describe el lugar con detalles concretos: hora del día, tipo de luz, ambiente.
- ✓Genera primero en modo foto y anima solo la imagen que te guste: es más barato que generar vídeos a ciegas.
- ✓Revisa qué modelos aparecen en gris: tu cuenta no tiene acceso a ellos y la app te dice por qué.
- ✓Si un resultado no pasa el filtro de seguridad, Higgsfield devuelve los créditos automáticamente.
| Caso de uso | Receta | Ejemplo |
|---|---|---|
| Contenido para redes de una marca personal | Teleport | El fundador en distintas ciudades para una campaña de viajes |
| Tienda de moda pequeña | Try-on | Ver una prenda puesta antes de hacer una sesión de fotos |
| Maquetas de campaña | Duo + vídeo | Simular una colaboración entre dos personas antes de grabarla |
04 Límites que debes conocer
- ✓No hay forma de consultar el saldo de créditos: si te quedas sin ellos, lo sabrás al intentar generar.
- ✓No usa webhooks, porque localhost no es accesible desde internet; la app consulta el estado periódicamente.
- ✓Algunos modelos solo están disponibles en ciertos planes de Higgsfield.
- ✓No está pensada para exponerla en internet tal cual: cualquier visitante podría gastar tus créditos.
05 Adaptarla a tu marca o a otro proveedor
Tres archivos concentran casi todos los cambios: app/globals.css para colores y tipografía, lib/recipes.ts para recetas, textos y modelos, y public/demo/ para las imágenes de ejemplo. Toda la comunicación con Higgsfield pasa por la interfaz Provider de lib/provider/, así que cambiar de API consiste en escribir otra implementación de esa interfaz.
Antes de publicar cambios, ejecuta npm run typecheck y npm run check:models, que valida las peticiones de cada modelo sin red ni créditos.
Estoy en el proyecto Avatar App Kit. Quiero añadir una receta llamada [NOMBRE] que reciba [QUÉ FOTOS] y genere [QUÉ RESULTADO].
1. Lee lib/recipes.ts y explícame cómo se declara una receta.
2. Propón el cambio mínimo, indicando si hace falta tocar algún componente (por ejemplo, si necesito un tercer hueco de imagen).
3. Aplica los cambios, ejecuta npm run typecheck y npm run check:models y dime el resultado.
No cambies el modelo de otras recetas ni el manejo de la clave.Preguntas frecuentes
El código es libre con licencia MIT. Las generaciones se pagan con los créditos de tu cuenta de Higgsfield, y la app te muestra el precio estimado antes de cada una.
La clave solo pasa de tu navegador a tu servidor local y de ahí a Higgsfield. Las fotos se suben a Higgsfield para generar, como en cualquier uso de su API, así que aplica su política de privacidad.
Cada persona puede clonar el repositorio y usar su propia clave. Compartir una instancia con tu clave implica que todos gastan tus créditos.
No para usarla, pero sí es muy útil para instalarla sin saber programar y, sobre todo, para modificarla: recetas, diseño o proveedor.
Sobre el autor
Equipo editorial de appyweb
Marketing, SEO y desarrollo con IA
Especialistas de appyweb en SEO, publicidad, desarrollo web y automatización con IA.