concurso hecho en 3d - adobe spark...en esta sección, vamos a aprender a usar adobe spark para...
TRANSCRIPT
4. Spark
[ 2 ]
ÍNDICE
Introducción � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � 3
Introducción a Adobe Spark � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � 4
Adobe Spark Gráficos � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � 4
Adobe Spark Página Web � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � 11
Adobe Spark Video � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � 17
Más información � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � 22
[ 3 ]
IntroducciónEn un mundo cada vez más mediado por entornos digitales, es necesario incorporar nuevos saberes y destrezas que permitan desenvolverse en la sociedad� Es por esto que se han ela-borado una serie de recursos educativos, destinados a los/as docentes y los/as estudiantes de las escuelas secundarias técnicas de la República Argentina, que puedan servir como insumos para acompañar la enseñanza y el aprendizaje�Estos recursos fueron realizados en el marco del concurso Hecho en 3D, producto de una iniciativa del Ministerio de Educación, Cultura, Ciencia y Tecnología de la Nación, en conjunto con INET, EDUCAR SE y la colaboración de Adobe� Allí encontrarán una aproximación inicial a las herramientas digitales Adobe Illustrator, Adobe Photoshop, Adobe Spark y Cura� Es-tas animan a pensar de manera creativa y a comunicar de forma expresiva haciendo uso de saberes digitales, convirtiendo ideas en proyectos innovadores�Los recursos se encuentran disponibles en dos formatos: guías y videotutoriales� Se espera que los participantes puedan trabajar de manera independiente o bien, complementaria con cada uno de los recursos� En la guía a continuación, encontrarán las principales herramientas de Adobe Spark, una pla-taforma de diseño que permite crear contenido utilizando imágenes, textos, videos e íconos�Los temas que aquí se incluyen son: cómo crear gráficos, videos o páginas web utilizando esta herramienta�Deseamos que el material sirva como un insumo para acompañar las propuestas pedagógicas elaboradas por los/las docentes en el marco del Concurso Hecho en 3D� Creemos que la aplicación de dichos recursos no son una propuesta pedagógica en sí misma sino que co-bran sentido al incluirlos en las actividades, con el afán de promover escenarios educativos innovadores y alternativos�
[ 4 ]
Introducción a Adobe SparkAdobe Spark es una plataforma de diseño que permite poner en práctica tu imaginación� Consiste en una herramienta digital que brinda la posibilidad de crear historias en un gráfico, una web interactiva o un video de manera sencilla e intuitiva. (Ver figura 1)
Adobe Spark GráficosEn esta sección, vamos a aprender a usar Adobe Spark para crear gráficos de una manera rápida y sencilla� Para ello, nos dirigimos a la página de Spark https://spark�adobe�com y hacemos click en el botón iniciar sesión en la esquina superior derecha. (Ver figura 2)
Figura 1
Figura 2
[ 5 ]
Podremos iniciar sesión con cualquiera de estas opciones: Google, Facebook, email, Adobe ID o si tenemos una cuenta de la escuela, podremos iniciar sesión de esa manera que automáticamente nos da la versión Premium� Una vez iniciada la sesión, hacemos click en el botón . (Ver figura 4)
Crear una infografíaPara crear un gráfico nuevo, podemos hacer click en gráfico en donde nos aparecerán varias plantillas para elegir, o bien seleccionar el botón comenzar desde cero/gráfico. (Ver figura 5)�
A continuación, elegiremos un tamaño para nuestro gráfico� Podemos seleccionar entre varias opciones de diseño: redes sociales, impresión, perfil de redes sociales, formatos estándar o personalizar el tamaño según nuestras necesidades específicas. (Ver figura 6)
Figura 3
Figura 4
Figura 5
Al hacerlo, nos llevará a la siguiente pantalla. (Ver figura 3)
[ 6 ]
Figura 6
Figura 7
Figura 8
Figura 9
Agregar fotos, texto y efectosA modo de ejemplo, elegiremos un formato poster para armar una infografía� Una vez selec-cionada la medida, tendremos que elegir las fotos� Para esto, podemos utilizar el buscador o subir nuestras propias imágenes. (Ver figura 7)
Una vez seleccionadas las fotos, hacemos click en siguiente y obtendremos nuestro diseño� (Ver figura 8)
Para editar nuestro texto, hacemos doble click sobre él. (Ver figura 9)
[ 7 ]
Si quisiéramos modificar una foto hacemos click sobre ella y nos aparecerá un menú donde tenemos opciones para escalar, rotar, espejar o directamente reemplazar nuestra imagen por otra. (Ver figura 11)
Si seleccionamos la opción Filtros podremos mejorar nuestra imagen con contraste, brillo, saturación y demás controles. También podremos aplicar algunos filtros predefinidos. Por último, tenemos una opción de desenfoque� Si quisiéramos colocar un color en lugar de una imagen, lo hacemos desde el botón Relleno de color. (Ver figura 12)
Figura 10
Figura 11
También podemos arrastrarlo y moverlo� En la barra derecha, nos aparecerán las opciones para modificarlo. Podemos cambiar el tipo de letra, la alienación, el tamaño, el espaciado de letras o de líneas, la opacidad, el color, agregarle una forma o utilizar efectos como sombras o calados� Por último, tendremos sugerencias para cambiar nuestro estilo de texto�En el menú superior derecho, encontramos el botón añadir, el cual nos permite agregar un texto, una foto, un ícono o un logo personal (para esta última opción debemos tener una cuenta Premium). (Ver figura 10)
[ 8 ]
Si quisiéramos cambiar los colores de nuestro diseño, vamos a la opción Colores.Nos aparecerá una gran cantidad de paletas de colores que nos cambiará la letra, los marcos y fondos. Podremos seleccionar distintas combinaciones de colores o invertirlos. (Ver figura 14)
También podemos cambiar una imagen de lugar haciendo click sobre ella y arrastrándola hacia el destino, o modificar el tamaño de la celda arrastrando los manejadores hasta obte-ner el tamaño deseado� Para volver al menú original, hacemos click fuera de nuestro trabajo� Dentro de la opción Diseño tenemos diferentes temas que van cambiando los colores, el tipo de letra y la forma de presentar los elementos. (Ver figura 13)
Figura� 13
Fig� 12
[ 9 ]
Figura 14
Fig�ura 15
Figura 16
La última opción que nos queda es Cambiar Tamaño que nos va a permitir adaptar nues-tro diseño a diferentes tamaños, según cómo deseamos imprimirlo o dónde lo vamos a publicar, como por ejemplo Instagram, Facebook, Twitter (Ver figura 16)
La siguiente opción del menú es Composición donde podremos elegir el tamaño del borde o celda y luego seleccionar entre distintas opciones de grillas para la disposición de los ele-mentos. (Ver figura 15)
[ 10 ]
Figura 17
Descargar como PDF o compartir onlineEn la barra superior encontraremos más opciones: deshacer y rehacer para realizar las modificaciones que deseemos; descargar para descargar nuestro diseño como un archivo de imagen o un pdf; y por último, compartir, la cual nos permite compartir nuestro trabajo en Facebook, Twitter, en el aula, por correo electrónico o generar un link para incrustarlo en una página web. (Ver figura 17)
[ 11 ]
Figura 18
Podremos iniciar sesión con cualquiera de estas opciones� Google, Facebook, email, Adobe o si tenemos una cuenta de la escuela, podremos iniciar sesión de esa manera que automáticamente nos da la versión Premium� Una vez iniciada la sesión, hacemos click en el botón . (Ver figura 19)
Crear una página webPara crear una nueva página web, podemos hacer click en página web, en donde nos apa-recerán varias plantillas para elegir, o bien seleccionar el botón comenzar desde cero /página web. (Ver figura 20)�
Figura 19
Figura 20
Adobe Spark Página WebEn esta sección, vamos a aprender a usar Adobe Spark para crear una página web de una manera rápida y sencilla� Para ello, iremos a la página de Spark https://spark�adobe�com y hacemos click en el botón iniciar sesión en la esquina superior derecha (insertar Figura 2). Al hacerlo, nos llevará a la siguiente pantalla: (figura 18) (Ver figura 18)�
[ 12 ]
A modo de ejemplo, crearemos un sitio web desde cero. Al principio, tendremos nuestra pá-gina vacía� En el margen superior derecho, encontramos la opción temas, la cual nos ofrece diferentes opciones de colores y fondos. (Ver figura 21)
Agregar elementos a la página webUna vez elegido un tema, escribimos un título y un subtítulo� Para colocar una imagen de fondo hacemos click en el botón � (Ver figura 21)
Podemos subir una foto desde nuestra computadora, buscar fotos gratuitas (por ejemplo: www.pexels.com), usar fotos de Adobe Stock, etc� En la barra de herramientas inferior, nos aparecerán varias opciones que nos permitirán comenzar a agregar contenido a nuestra historia (Ver figura 22)�
Figura 21
Figura 21
Figura 22
[ 13 ]
Luego, podemos agregar un texto� Al igual que antes, se desplegará un submenú que nos permitirá modificar tamaño, destacado, viñetas, estilos de caracter, hipervínculo y alineación (Ver figura 24)�
Para agregar botones, elegimos la opción botón. Colocamos el nombre que llevará el botón, por ejemplo ¨Más información¨ y la dirección de destino, es decir, a dónde nos va a dirigir� Luego, podremos determinar la alineación (Ver figura 25)�
Figura 23
Figura 24
Allí encontraremos opciones para añadir una foto simple, un texto, un botón, un video, una cuadrícula de fotos, un glideshow y un diseño dividido. En el caso de elegir una foto simple, podemos ponerle un subtítulo� Si clickeamos sobre la foto, tendremos opciones de visualiza-ción como rellenar pantalla, ventana, etc� También podremos sustituírla por otra o eliminarla� (Ver figura 23)�
[ 14 ]
Para incluir videos que sean visibles desde nuestro sitio web, debemos colocar la URL del video subido previamente a Youtube, Vimeo o Spark. (Ver figura 26)�
La opción cuadrícula de fotos permite buscar imágenes gratuitas y elegir varias en simul-táneo. podemos reordenarlas, reemplazarlas y también cambiar el tamaño (Ver figura 27)�
Figura 25
Figura 26
Figura 27
[ 15 ]
Podríamos poner otra foto, agregar un pequeño subtítulo y luego tal vez, otro botón o video� Podemos arrastrar la caja al lado derecho o al medio� En este caso, se agrandará el tamaño de la imagen (Ver figura 29)�
Por último, tenemos la opción de hacer un diseño dividido� Esta opción, nos permitirá colocar una imagen de un lado y fotos, video, texto o botones del otro (Ver figura 30)�
Figura 28
Figura 29
Figura 30
La siguiente opción es glideshow, la cual nos permite elegir una foto para utilizar de fondo� Una vez guardada la imagen, nos aparecerá un rectángulo gris claro donde podemos añadir más información (Ver figura 28)�
[ 16 ]
En la barra superior encontramos otras opciones� La primera es ajustes, la cual permite reemplazar el logo de Spark por nuestro propio logo� Para eso, deberíamos contar con una cuenta Premium (Ver figura 31)�
El siguiente botón es el de Vista Previa que nos da una previsualización de cómo está que-dando nuestra página terminada� El botón Actual es una excelente opción para poder hacer diferentes tipos de presentaciones de diapositivas simplemente con los botones arriba y abajo� El botón compartir, nos permite compartir el link de nuestro sitio web o bien imprimirlo en formato PDF�
Publicar y compartirSi hacemos click en publicar y compartir podremos darle un título, una categoría� elegir el autor y los créditos de las fotos utilizadas� Creamos el enlace y obtenemos una URL que podremos compartir en Twitter, Facebook, en el aula, por correo electrónico o incrustarlo donde queramos (Ver figura 32)�
Figura 31
Figura 32
[ 17 ]
Figura 33
Podremos iniciar sesión con cualquiera de estas opciones: Google, Facebook, email, Adobe ID o si tenemos una cuenta de la escuela, podremos iniciar sesión de esa manera que automá-ticamente, nos permite acceder a la versión Premium� Una vez iniciada la sesión, hacemos click en el botón � (Ver figura 34)
Crear un videoPara crear un video nuevo, podemos hacer click en video, en donde nos aparecerán varias plantillas para elegir, o bien seleccionar el botón comenzar desde cero/video� (Ver figura 35)�
Figura 34
Figura 3
Adobe Spark VideoEn esta sección, vamos a aprender a usar Adobe Spark para crear un video de una manera rápida y sencilla� Para ello, iremos a la página de Spark https://spark�adobe�com y hacemos click en el botón iniciar sesión en la esquina superior derecha. Al hacerlo, nos llevará a la siguiente pantalla: (Ver igura 33)�
[ 18 ]
En primer lugar vamos a tener que ingresar un título que más adelante podremos cambiar si es necesario (Ver figura 36)�
Al hacer click en siguiente, nos aparecerán diferentes plantillas entre las cuales podemos elegir� Una vez seleccionada una plantilla, en la parte inferior, veremos las instrucciones que nos van a organizar la planificación del video. (Ver figura 37)�
Si hubiéramos elegido la opción empezar desde cero, tendríamos estas cajas vacías (Ver
figura 38)�
Agregar fotos, videos y textoPara comenzar a crear nuestro video, lo primero que debemos hacer es elegir la forma en que se mostrará� En el lado derecho tenemos algunas opciones de diseño como pantalla completa, pantalla dividida, pie de ilustración y título con texto�
Figura 36
Figura 37
Figura 38
[ 19 ]
Entre las opciones de edición, las primeras que encontramos son Acercar o Alejar� También podemos volver a recortar el video, continuar el clip en la siguiente diapositiva o controlar el sonido, que podría ser volumen normal, suave (que nos permitiría hablar sobre la pista de música) o en silencio (Ver figura 41)�
Una vez subido el video, se habilitará la opción para editarlo desde un control deslizante� � Podemos decidir cuánto tiempo queremos incluir (hasta 30 segundos) y moverlo para elegir qué parte poner (Ver figura 40)�
Figura 39
Figura 40
Figura 41
El diseño de pantalla completa es el valor predeterminado� Si hacemos click en el botón tendremos las opciones para agregar texto o un ícono, Haciendo click en la esquina superior izquierda tendremos las opciones para colocar un video o una foto. (Ver figura 39)�
[ 20 ]
Si pulsamos Play podremos previsualizar el video� También podremos mover el texto donde queramos haciendo doble click sobre el mismo y arrastrándolo hacia el lugar de destino� � Si seleccionamos el diseño de pantalla dividida, tomará el video y lo pondrá en una mitad permitiéndonos poner un texto en la otra mitad (Ver figura 42)�
Si elegimos la opción Pie de Ilustración va a tomar ese texto y lo pondrá como subtítulo, al optar por la opción Título y texto, nos permitirá agregar un título mas pequeño. (Ver figura 43)�
Con respecto a la música, Spark automáticamente escoge una música para el video� Pode-mos cambiarla desde el menú ubicado arriba a la derecha� Podemos elegir entre algunos de los temas gratuitos que ofrece Spark o bien añadir nuestra propia música� Desde este menú también podremos encender o apagar el sonido y subir o bajar el volumen. (Ver figura 44)�
Figura 42
Figura 43
Figura 44
[ 21 ]
Descargar como MP4 o compartir onlineEn el menú principal nos aparecerán 3 opciones� Vista previa que nos permitirá ver cómo nos quedó terminado el video� Compartir, que nos permitirá compartir el video, darle un nombre, una categoría y la opción de poner o no autor� Luego, crearemos el enlace y obtendremos una url que podremos compartir en Twitter y Facebook, en el aula, por correo electrónico o incrustarlo donde queramos. dentro de un sitio web. Por último, con la opción descargar podremos descargar una copia en formato mp4 (Ver figura 47)�
El botón Redimensionar nos permite elegir entre 2 tamaños de publicación de nuestro video: Pantalla panorámica y cuadrado� Por último, en el menú principal tenemos la opción de Vista previa que nos permite previsualizar cómo nos quedó todo el video editado (Ver figura 46)�
Figura 45
Figura 46
Figura 47
El botón Tema nos permite elegir cómo serán las transiciones y los colores de fondo� Si man-tenemos el cursor sobre cada uno, podemos tener una previsualización. (Ver figura 45)�
[ 22 ]
Más informaciónPara conocer otras herramientas y materiales realizados en el marco del concurso Hecho en 3D, podés dirigirte al banco de recursos disponible en: https://h3d.educar.gob.ar/concurso-hecho-en-3d/seccion/4/concurso-hecho-en-3d
