Embedded Files
¿Qué es lo que queremos reflejar en esta sección? Pues dar una explicación del proceso de desarrollo de nuestro proyecto.
Con esto, buscamos dar una ídea de varias cosas:
Como es el proceso previo a la creación de una página web.
Las herramientas que aprendimos y empleamos para conseguir llevar a cabo las tareas encomendadas.
Es decir, reflejar y dar a conocer todo el trabajo que hay detrás de la creación de una página web.
Proceso creativo
Proceso creativo
Ninguno de nosotros había realizado antes una página web, así que era un mundo del todo desconocido.
Nuestra profesora nos explicó y nos dió unas pautas de cómo llevarlo a cabo:
En primer lugar, y antes de comenzar a desarrollar nada, era necesario que hablásemos y nos pusiésemos de acuerdo sobre el diseño de la página, las secciones que queríamos incluír dentro de ella, decidir cómo queríamos mostrar el contenido de cada una de ellas...
Una vez tuvimos más o menos claro lo anterior, nos organizamos en diferentes equipos para reflejar el verdadero trabajo de los desarrolladores informáticos.
Existe la equivocada idea estereotipada de que el trabajo del informático es solitaria y no puede estar más equivocada. Nos dividimos en equipos para realizar cada uno una parte del trabajo y periódicamente hacíamos puestas en común para estar al tanto del trabajo de cada uno.
Así, los diferentes equipos se encargaron de:
Creación del logo y redes sociales.
Búsqueda de perfiles de mujeres para ser entrevistadas así como el contacto con ellas.
Búsqueda de la mejor herramienta para crear nuestra página web y creación de la plantilla con las diferentes secciones.
Creación de las preguntas a realizar a nuestras entrevistadas.
De esta forma, durante la primera semana estuvimos trabajando en paralelo estos 4 grupos buscando mujeres, pensando las preguntas, diseñando nuestro logo y creando el formato de nuestra página web.
Una vez elegimos a nuestras posibles entrevistadas, contactamos con ellas a través del correo electrónico o de la plataforma Linkedin para ver si estaban dispuestas a colaborar con nosotros y cuando tuvimos respuesta satisfactoria, concertamos un día/hora para realizar la entrevista empleando una videollamada.
A partir de ahí y durante varias semanas fuimos alternando el trabajo de desarrollo de la web con la realización de las entrevistas.
Cada vez que teníamos una entrevista hecha, procedíamos a completar la sección de la web referente a la misma, introduciendo información, fotos, vídeos, enlaces, audios,...
Explicación de las tareas realizadas
Explicación de las tareas realizadas
Y ahí fue cuando nos dimos cuenta de lo duro y complicado que es el desarrollo y diseño web pues cualquier cosa, por sencilla que parezca necesita ser pensada, diseñada e implementada y hay que cuidar infinidad de detalles para conseguir un trabajo de calidad.
A continuación, vamos a desglosar paso a paso todas las etapas del proceso de creación de nuestra página web que esperamos sirvan de apoyo y guía para trabajos con características similares.
Herramientas colaborativas
Herramientas colaborativas
Para poder desarrollar nuestro trabajo, al estar repartidos en varios equipos, estuvimos usando durante todo el proceso de desarrollo de nuestra web diferentes herramientas de trabajo colaborativo como son: Google Docs y Google Drive.
De esta forma teníamos un acceso común a todo el contenido necesario pudiendo acceder desde cualquier dispositivo y cualquier lugar incluso de forma simultánea.
En Google Drive guardamos todo el material necesario para la página web: fotos, vídeos, audios, fichas...
En Google Docs creamos varios documentos con las pautas de trabajo a realizar/pendientes, las preguntas para nuestras referentes, información sobre las mismas...
Creación de identidad de marca
Creación de identidad de marca
Simultáneamente, realizamos el proceso de creación de identidad de marca, es decir: pensar el nombre del equipo, crear un logo para representarnos, elegir los colores de nuestra página para que siguiese el patrón del logo, crear las páginas de nuestras redes sociales.
Para ello empleamos la herramienta SketchBook, con la que creamos nuestro logo, así como, los encabezados de las subpáginas de la web. Muchos de los dibujos son hechos con una tableta gráfica, que nos facilitó mucho el trabajo de edición de imágenes.
Búsqueda de perfiles
Búsqueda de perfiles
Otra de las tareas que realizamos al principio fue la búsqueda de perfiles de mujeres que trabajasen o investigasen en sectores de ámbito STEM para poder preguntarles si estarían interesadas en ser entrevistados por nosotros.
Mediante búsqueda de noticias por Internet, lectura de artículos en periódicos y blogs, búsqueda de perfiles relevantes por Linkedin, fuimos consiguiendo el nombre y contacto de ellas.
Luego, a través de nuestra cuenta de correo de Gmail o Linkedin, contactamos con ellas para explicarles de qué iba el concurso de Wisibilízalas y ver si estaban interesadas en participar así que cuando tuvimos respuesta positiva, les envíamos las preguntas y fijamos día y hora para la realización de la misma.
Elección de las preguntas
Elección de las preguntas
El equipo encargado de pensar las preguntas, estuvimos, en primer lugar, "cotilleando" la web de Wisibilízalas para ver las preguntas realizadas por las anteriores ediciones, lo cual nos sirvió de ayuda para inspirarnos y pensar la dinámica de las preguntas.
Luego, una vez pensadas, las organizamos por categorías y las plasmamos en un documento compartido para luego exponerlas a los compañeros y recibir el feedback por parte de todo el equipo. De esta forma, una vez consensuadas por todos, tuvimos las preguntas listas para compartirlas con nuestras futuras entrevistadas.
Diseño de la página web
Diseño de la página web
El equipo encargado de pensar y realizar el diseño base de la página web estuvimos primero buscando y probando diferentes herramientas gratuitas para diseño web.
En un primer lugar quisimos probar con Wix, pero nos encontramos con el problema de que no permitía la edición simultánea con varios editores al mismo tiempo. Por lo tanto, nos impedía el trabajo durante las horas de clase puesto que íbamos a tener que estar varias personas al mismo tiempo introduciendo contenidos.
También probamos con Weebly, pero teníamos el mismo problema.
Así que al final, elegimos Google Sites, que además permitía integrar de una forma muy rápida y sencilla todo el contenido de vídeos de nuestro canal de Youtube, así como el contenido del Google Drive donde almacenamos los audios de las entrevistas, las fichas, ...
Realización de las entrevistas
Realización de las entrevistas
Las entrevistas las realizamos mediante videollamada debido a que la situación actual de pandemia COVID-19 no nos permitía realizar las entrevistas en formato presencial.
El programa que elegimos para realizar la entrevista fue Zoom, porque nos permitía realizar las entrevistas sin obligar a descargarse ningún software específico ni tampoco a crear ninguna cuenta de usuario. Solamente con un navegador ya podíamos realizar la entrevista.
En un caso empleamos Google Meet porque nuestra entrevistada lo prefería, siendo solamente necesario tener una cuenta de Gmail, que tanto ella como nosotros teníamos, así que no hubo ningún problema.
Para capturar la pantalla con la grabación, empleamos el programa iTopRecorder, que nos permitía grabar la pantalla y nuestra cámara web al mismo tiempo, sin límite de tiempo, siendo muy sencillo de manejar. La única pega, por ponerle, es la marca de agua que introduce en la grabación en su edición libre de pago que fue la que nosotros usamos.
Además, también grabamos simultáneamente la entrevista con una cámara de vídeo para tener otro ángulo de visión (y como copia de seguridad por si la grabación de la pantalla fallaba o se producía algún error durante la misma).
Edición de vídeo
Edición de vídeo
Lógicamente, tuvimos que editar los vídeos de las entrevistas para eliminar toda la parte que no servía (principio antes de comenzar la entrevista como tal, parte del final cuando la entrevista terminaba y la profesora nos daba el feedback de lo que habíamos hecho, cortes debido a interrupciones en la entrevista por perdida de la conexión de Internet,...).
Para ello empleamos la herramienta Kdenlive que es un programa de edición de vídeo gratuito, multiplataforma y de código abierto.
Edición de sonido
Edición de sonido
De la misma forma que antes, tuvimos también que editar los audios que extraímos de las grabaciones hechas con la cámara de vídeo.
Para ello empleamos la herramienta Audacity, que es un software de edición de audio y grabación de sonido digital multiplataforma, gratuito y muy sencillo e intutivo de usar.
Diseño de los juegos
Diseño de los juegos
Para crear los juegos empleados en la semana del 11 de febrero, Día Internacional de la Mujer y la Niña en la Ciencia, utilizamos Genially, una plataforma gratuita en la que puedes crear juegos u otros contenidos visuales interactivos a partir de plantillas que puedes editar.
De hecho, nos basamos en plantillas ya realizadas y ofrecidas de forma gratuita, y sobre ellas realizar nuestros juegos, tal y como explicamos en la sección de la web, que puedes visitar aquí.
Widget redes sociales
Widget redes sociales
Dentro de nuestra sección de difusión en medios, quisimos incrustar widget que permitiesen consultar nuestras publicaciones en las redes sociales (instagram, facebook, twitter y linkedin) sin tener que acudir a las mismas.
Para el caso de Instagram y Facebook usamos la página Snapwidget que permite incrustar widget de Facebook, Instagram, Twitter o Youtube eligiendo entre diferentes opciones. Basta con seleccionar la deseada, cambiar los parámetros deseados e insertar el código javascript generado dentro de nuestra página web.
Para el caso de Twitter usamos la propia funcionalidad que ofrece la red social. Y con Linkedin realizamos lo mismo, usando lo que ellos llaman Insignias.
Page updated
Report abuse