Proyecto Formulario

Reanudando el desarrollo del formulario frontend, este nuevo formulario se presenta con amarillo y negro como colores de fondo, y azul para el botón del formulario, usando HTML5 y CSS3. Se puede apreciar que se trata de un diseño web sencillo, sin demasiados elementos, pero potente gracias a la combinación de colores de fondo.

 

Barra de Herramientas Circular

Este proyecto consiste en una barra de herramientas circular ubicada en la esquina superior izquierda con una serie de iconos para acceder a las funciones de una plataforma web, pero estratégicamente ubicados para optimizar el espacio. La barra de herramientas se diseñó en rojo, lo que la hace destacar entre los iconos.

 

Proyecto Web Nocturna

El proyecto se creó con HTML5 y CSS3. Se utilizó un vídeo como fondo del proyecto en lugar de una imagen de fondo tradicional. El vídeo muestra el movimiento de la niebla en la oscuridad. Para la tipografía, se utilizaron diferentes familias de fuentes para el encabezado y el subencabezado. Se aplicó separación de caracteres al primer encabezado. El segundo encabezado se diseñó en negrita y cursiva con un tamaño de 10 px, a diferencia del encabezado, que es de 14 px. Se aplicó el color blanco para resaltar y contrastar con el color negro generado por el vídeo. En el centro, se colocaron iconos de redes sociales con fondo negro y azul para combinar y contrastar adecuadamente con el color de fondo proporcionado por el vídeo. Al pasar el cursor sobre cada icono, se muestra un efecto de desplazamiento que cambia el fondo y el color de cada red social.

 

Formulario Web

El proyecto se desarrolló con HTML5 y CSS3. Se utilizó una imagen de fondo con un paisaje azul tranquilo. El formulario se resalta con un borde 3D con el sombreado adecuado y se divide en dos partes: una para acceder a una plataforma web y otra para dar la bienvenida y solicitar al usuario que se registre si aún no lo está. Los colores amarillo y blanco se utilizaron para contrastar adecuadamente con el negro y el azul cristal del formulario y la imagen de fondo, respectivamente.

 

Proyecto Galería

El proyecto se desarrolló con HTML5 y CSS3. Representa lo que se ve al acceder a un sitio de comercio electrónico. Los títulos de cada opción se muestran de forma destacada en la parte superior. (Estos enlaces presentan al usuario las opciones que realmente le interesan). En el centro, se agrupan seis imágenes que actúan como enlaces o portales a las diferentes páginas del sitio web. Cada imagen está construida con un color que contrasta con el negro, lo que le da a la plataforma una sensación atractiva y atractiva para las compras en línea. Cabe destacar que se utilizó separación de caracteres para los títulos, utilizando mayúsculas y un amarillo brillante para contrastar adecuadamente con los demás elementos del proyecto Galería.

 

Proyecto Tarjeta de Presentación

Volviendo a las tarjetas de presentación, combinamos algunas de las opciones presentadas en proyectos web anteriores. Se utiliza un fondo negro para contrastar con las dos caras de la tarjeta. Se aplica un radio de borde simple a los bordes de la mitad superior de la tarjeta, y un borde ligeramente más curvo a la mitad inferior. La mitad de la tarjeta presenta una imagen de fondo de un bosque, resaltando el verde. La mitad inferior es de color amarillo brillante con un mensaje separado por caracteres. A continuación se muestra una ubicación geográfica, y debajo hay un botón que, al pasar el cursor sobre ella, activa el evento MouseHover, girando la tarjeta un 50 % para ver la otra cara. En el centro se muestra la imagen circular de una computadora portátil.

 

Proyecto Mi Card3

 

Este proyecto consiste en una tarjeta de presentación completa para un desarrollador web que describe su trayectoria como profesional, presenta brevemente su experiencia y proporciona información de contacto. Se utilizaron HTML y CSS, junto con colores vibrantes para un contraste atractivo.

                       Segunda Cara del Proyecto

    Tercer Cara del Proyecto

 

Proyecto Calculadora

 El proyecto se ha desarrollado en términos de desarrollo front-end y diseño web. Se creó con HTML5 y CSS3. En cuanto al desarrollo back-end, se construirá con PHP, siguiendo el ciclo de desarrollo de sistemas de información. Por lo tanto, proporcionaré más detalles sobre las siguientes etapas de construcción a medida que avance el proyecto de la calculadora digital. Para crear una apariencia intuitiva, se utilizaron los colores verde, blanco y azul.

Proyecto: Debit Card

Este proyecto consistió en la representación digital de una tarjeta de débito bancaria. Opté por el color negro para lograr un mayor impacto visual. Para las letras de mi nombre, usé el amarillo, un tono intenso que combina a la perfección con el negro. Los bordes son gruesos y blancos, y resaltan a la perfección con el color de fondo elegido: azul marino. Para este proyecto, se utilizaron HTML y CSS, como es habitual, pero también una animación que simula el movimiento de la tarjeta sin intervención alguna, a diferencia de proyectos anteriores.

 

Proyecto Mi Entrada

Este proyecto consistió en un formulario que contrasto el color naranja con el color purpura de una imagen, ademas de emplear el color rojo para las letras, y el color azul para los bordes de los campos de texto así como para el botón pero en un tono azul aun mas fuerte. El formulario se ubica en fondo de la pantalla para mayor comodidad visual del usuario, y el empleo de los colores del formulario se maneja estratégicamente en combinación con el color de fondo negro. Se calcularon los pixeles para determinar los bordes de los campos  de texto así como en el botón y se establecieron en 30px en cada caso. Se empleo HTML y CSS para el desarrollo de la interfaz visual.

Tarjeta de Presentación Doble

 

Este Proyecto consiste en mostrar dos tarjetas de presentación simultáneamente, en estado paralelo a la otra como un espejo, de una sola cara, en la que al activar el evento HOVER, se cambia ligeramente la presentación a través de la opacidad, mostrando las redes sociales y el rol de cada profesional con un footer, por medio de la animación y una transición que dura 5 segundos.