Inicio

Prototipo de Keynote

Diseña una app simple

Prototipo de Keynote

En Keynote, crea un prototipo de tu app.

Tiempo estimado para completar este tutorial:

40 minutos

Crea tu prototipo de Keynote.

Usa la diapositiva en blanco proporcionada en la sección Prototipo de Keynote de la presentación del proyecto para crear tu prototipo. Duplica la diapositiva si es necesario.

Explora las herramientas de Keynote.

Obtén información sobre las siguientes funcionalidades de Keynote que tal vez quieras usar en tu app. En cada sección, se usa la app Afirmaciones como ejemplo.

Agrega elementos.

Agrega texto, líneas y figuras.

Paso 1

Para agregar texto, líneas o figuras, toca Formas y elige un elemento.

Paso 2

Toca Multimedia para agregar imágenes, audio, dibujos o video.

Paso 3

Para cambiar el tamaño de una figura o imagen, arrastra las esquinas azules hasta la ubicación deseada.

Paso 4

Toca dos veces una figura para agregar texto.

Paso 5

Agrega todos los elementos para tu app y dimensiona su tamaño correctamente.

Considera los títulos, las imágenes y los botones.

Agrega color.

Edita el color y la transparencia de los elementos de tu prototipo.

Paso 1

Muestra el navegador de diapositivas.

Paso 2

Para cambiar el fondo, selecciona la diapositiva y toca Formato .

Paso 3

Toca Fondo y elige un color, un degradado o una imagen.

Paso 4

Toca Dinámico para agregar un fondo en movimiento.

Paso 5

Cambia el color de una figura.

Toca la figura o varias figuras, toca Formato y luego toca Relleno.

Paso 6

Usa el regulador de opacidad para ajustar la transparencia de un elemento.

Selecciona el elemento, toca Formato y desliza el regulador de opacidad hasta la transparencia deseada.

Paso 7

Usa los controles proporcionados para editar el estilo de texto.

Toca para seleccionar el texto, toca Formato y luego toca Texto.

Paso 8

Continúa editando el diseño de tu prototipo hasta que te sientas orgulloso de él.

Haz que los elementos sean interactivos.

Agrega enlaces entre diapositivas para que el prototipo de tu app sea interactivo.

Paso 1

Decide si tu app necesita transiciones o interactividad.

Consejo

Para que tu prototipo sea interactivo, usa varias diapositivas para agregar o cambiar elementos.

Paso 2

Para agregar una diapositiva, toca la diapositiva y luego toca Duplicar.

Paso 3

Para crear un enlace, selecciona el elemento y luego selecciona Enlace.

Paso 4

Decide dónde debe ir el enlace. Puedes crear un enlace a una diapositiva, una página web, un correo electrónico o un número de teléfono.

Consejo

Para que tu prototipo se comporte como una app, permite la navegación solo a través de enlaces.

Paso 5

Para seleccionar un tipo de presentación, toca el nombre de la presentación, toca Opciones de presentación y luego toca Tipo de presentación.

Paso 6

Toca Solo enlaces.

Paso 7

Continúa haciendo diapositivas y enlaces hasta que la app esté completa. Toca Reproducir y prueba los enlaces a medida que los agregas.

Paso 8

Toca Reproducir y sigue todos los caminos posibles a través de la app. ¿Hay algún callejón sin salida? Si es así, agrega un enlace para asegurarte de que el usuario nunca se quede atascado.

Agrega animaciones.

Usa animaciones para agregar, mejorar o eliminar elementos.

Paso 1

Para agregar una animación, toca el elemento que quieres animar y selecciona Animar.

Paso 2

Explora las diferentes opciones de animación.

Con Agregar entrada se agrega el elemento a la pantalla.

Con Agregar acción se realiza una acción.

Con Agregar salida se elimina el elemento de la pantalla.

Paso 3

Prueba las diferentes animaciones del menú para ver qué encaja.

Toca Atrás cuando termines.

Paso 4

Toca la animación, ajusta la configuración a tu gusto y luego toca Listo.

Consejo

Si usas el tipo de presentación Solo enlaces, las animaciones solo se reproducirán de forma consecutiva después de una transición.

Paso 5

Toca Orden de creación para editar la configuración de la creación.

Paso 6

En la primera animación, toca Después de la transición.

Paso 7

En todas las demás animaciones, toca Después de la creación.

Paso 8

Toca Vista previa para probar tus animaciones. Continúa editando hasta que la app se vea y funcione correctamente.

A continuación: