viernes, 22 de marzo de 2019

Plantilla elegida

En este post, voy a explicar que plantilla he elegido y porque he elegido esta plantilla para diseñar mi aplicación Web.

https://colorlib.com/wp/template/login-form-v3/

https://github.com/falconmasters/popup-animado

https://demos.creative-tim.com/light-bootstrap-dashboard-pro/examples/tables/regular.html#



Bien, para empezar, he escogido la plantilla "Bootstrap 4 Admin Dashboard Template", la cuál he encontrado en el siguiente enlace.

Entre todas las que he estado viendo, he considerado que está es la que más se ajusta al diseño que yo quería plantear desde un principio, sobre todo por la colocación que tienen los elementos y cómo están repartidos por toda la pantalla, por lo que creo que me ahorrará una gran cantidad de tiempo para versiones posteriores en las que implemente código de la propia aplicación.

Otra que quizá también me llamase la atención, de nuevo, por su similitud con respecto a mi idea de la aplicación, es "Bubbly - Admin Template", que se puede encontrar en el siguiente enlace.
Quizá, por su relación con la anterior en el menú de la izquierda, donde te aparecen todas las opciones disponibles.

¿Que cambios he hecho?


  1. Adaptar la plantilla básica a mi gusto:
    1. Modificar el menú de la parte izquierda, poniendo las distintas opciones que se plantean.
      1. Cambiar nombres
      2. Cambiar iconos
      3. Cambiar enlaces
    2. Crear página de salida para el botón "Salir", con enlace de vuelta. Por ahora sin funcionalidades.
    3. Modificar la cabecera de la página principal.
      1. Eliminar foto
      2. Cambiar opciones del menú desplegable
    4. Crear página para editar el perfil. Por ahora sin funcionalidades.
    5. Cambiar y adaptar la disposición general de la pantalla principal, para que muestre como va a ser la página de la aplicación. Destacando:
      1. División en dos columnas de 8 - 4 respectivamente
      2. En la primera columna, representamos los torneos activos y los finalizados
      3. En la segunda columna, he añadido un calendario, para poder organizar torneos o eventos futuros y una sección de avisos y notificaciones


jueves, 21 de marzo de 2019

¡AHÍ ESTUVE YO!



Cómo has hecho la foto resultante en que sales en la escuela con el personaje famoso. Cuenta los problemas y los trucos:

Lo primero que he hecho ha sido buscar las 3 fotos que he usado y editar cada una de ellas para adecuarlas para la foto final.
-La foto de la escuela, la he recortado un poco porque era quizá demasiado grande.
-La foto de IronMan, la he editado para quitar todo el fondo y quedarme sólo con la figura.
-La foto mía, al igual que la anterior, la he editado para eliminar todo el fondo. En este caso ha sido más complicado que en el anterior (en el que me bastó con usar la varita), ya que ahora, a parte de usar la herramienta de la varita para eliminar los colores más característicos, tuve que hacer uso del lazo, para recortar mi figura de manera correcta, sin eliminar partes de mi cuerpo.

Muestra las fotos por separado antes de juntarlas. Si les has quitado el fondo, con fondo, luego sin fondo, etc. Es decir, el proceso:



Si metes algún efecto posterior, cómo lo has hecho:
En mi caso no he introducido ningún efecto extra, lo único que he hecho hasido añadir un cuadro de texto que contenga mi nombre.

martes, 19 de marzo de 2019

Paleta de colores

1. La paleta de colores que he elegido se basa en:

1.1-Izquierda:
RGB: 153 94 54
HEX: 995E36
1.2-Centro-Izquieda:
RGB: 130 78 45
HEX: 824E2D
1.3-Central:
RGB: 153 84 46
HEX: 99542E
1.4-Centro-Derecha:
RGB: 130 74 45
HEX: 824A2D
1.5-Derecha:
RGB: 97 54 35
HEX: 613623


2. Comenta qué alternativas tienes (monocromo, etc.), cuál seleccionas y por qué.  ¿Por qué has seleccionado estos colores, al margen de la gama?

Existen distintas alternativas como monocromo, análogos, tríada, complementarios, complementarios compuestos, tonos o personalizazdos.

En mi caso he elegido una gama de colores personalizados, aunque se podrian considerar monocromos, ya que he escogido el marrón como fondo plano, simulando un tablero.
Esto nos permitirá resaltar mejor los resultados mostrados en la pantalla.

3. FOTOS
3.1. Fondo:
3.2. Logo:
Esto son algunas ideas de como va a ir la página web, aunque no son decisiones definitivas, ya que iré probando la combinación de distintos estilos para ver cuál es el que más favorece a la idea propuesta.