Tarjetas Digitales Personalizables

"Awesome Profile Cards" es una aplicación diseñada para la creación de tarjetas digitales personalizables y virtuales que se pueden compartir fácilmente. Se trata de una aplicación amigable y de uso sencillo que también contribuye al cuidado del medio ambiente. Esto se debe a que la creación de tarjetas digitales ofrece varias ventajas:

• Reducción del consumo de papel: En un momento en el que estamos cada vez más conscientes del impacto ambiental, esta aplicación permite ahorrar papel, ya que no es necesario imprimir las tarjetas.

• Menor costo: A diferencia de las tarjetas de visita tradicionales, que implican gastos de impresión, diseño y otros costos, las tarjetas digitales eliminan estos gastos.

• Actualizaciones fáciles: Las tarjetas virtuales son muy simples de actualizar. Si tienes un nuevo producto o un logro que quieras compartir, puedes hacerlo de manera rápida y sencilla. Cualquier persona que tenga acceso a tu tarjeta virtual en línea verá automáticamente los cambios que realices.

• Facilidad de compartir: Puedes compartir tus tarjetas de visita digitales a través de correo electrónico, GitHub, Facebook, Twitter, LinkedIn y muchas otras plataformas. Esto te brinda múltiples opciones para compartir tu información de contacto de manera eficiente y conveniente.

Descripción del Proyecto

Esta aplicación se compone de dos páginas distintas:

1. Página de Inicio o Landing Page: En esta página, extendemos una invitación al usuario a crear su propia tarjeta virtual.

   2. Página de Creación de Tarjeta: En esta sección, encontramos las siguientes áreas:
   • Sección "Diseñar": Aquí, el usuario puede seleccionar la paleta de colores que desea - utilizar para personalizar su tarjeta.
   • Sección "Rellenar": En esta parte, el usuario debe completar varios campos con sus datos personales, como su nombre completo, cargo, dirección de correo electrónico, número de teléfono, enlaces a su perfil de LinkedIn y GitHub, y una fotografía.
   • Sección "Compartir": Esta sección permite al usuario crear su tarjeta y proporciona el enlace que se utilizará para compartir la tarjeta en las redes sociales y otros medios.

Cómo Funciona:

1. Inicio:

Cuando la página se carga, el usuario será redirigido a la página de inicio, donde verá la "landing page". Para comenzar el proceso de creación de su tarjeta, debe hacer clic en el botón "Comenzar".

2. Creación de Tarjeta:

   • Haga clic en la sección "Diseña". Aquí, podrá elegir una paleta de colores que se aplicará a su tarjeta. En la parte derecha de la página, verá una vista previa de su tarjeta con los colores que seleccione.

   • A continuación, haga clic en la sección "Rellena". En esta área, debe completar todos los campos con sus datos personales, como su nombre completo, cargo, dirección de correo electrónico, número de teléfono, enlaces a sus perfiles de LinkedIn y GitHub. Además, debe cargar una foto que se utilizará en su tarjeta.

   • Luego, haga clic en la sección "Comparte". Aquí encontrará un botón etiquetado como "Crear tarjeta". Al hacer clic en este botón, su tarjeta se generará automáticamente. Simultáneamente, se creará un enlace que podrá compartir en Twitter haciendo clic en el botón "Compartir en Twitter".

Como puede ver, crear su tarjeta es un proceso fácil y rápido. No pierda más tiempo, vaya y pruebe la aplicación, ¡y al mismo tiempo, contribuya al cuidado del medio ambiente!

Herramientas usadas

1. Visual Studio Code - Editor de código.
2. Javascript - Lenguaje de programación para incorporar interactividad.
3. HTML Lenguaje de marcado para la estructura.
4. SASS - Para añadir estilos.
5. Git - Para el control de versiones.
6. Github - Como repositorio remoto.
7. Github Pages - Para su publicación.
8. Adalab web started kit - Es una plantilla de proyecto con funcionalidades preinstaladas y preconfiguradas, que nos facilita la automatización de tareas, ya que incluye un motor de plantillas HTML, el preprocesador SASS y un servidor local y muchas cosas más, que nos ayudan a trabajar más cómodamente, debido a la automatización de tareas.

Equipo de desarrollo