Cómo hacer juegos en línea (con imágenes)

Tabla de contenido:

Cómo hacer juegos en línea (con imágenes)
Cómo hacer juegos en línea (con imágenes)

Video: Cómo hacer juegos en línea (con imágenes)

Video: Cómo hacer juegos en línea (con imágenes)
Video: Word 2007 2010 Como insertar marcadores en word 2024, Mayo
Anonim

¿Alguna vez jugaste un juego en línea y pensaste: "Ojalá pudiera hacer uno de estos, tengo algunas ideas geniales"? En el pasado, era necesario haber aprendido a codificar en ActionScript 3, el lenguaje que impulsa a Flash. Sin embargo, gracias a algunos programas de creación de juegos, la experiencia en codificación es un requisito del pasado. Puede crear juegos divertidos y profundos manipulando objetos y lógica, sin siquiera tocar una línea de código.

Pasos

Parte 1 de 4: Diseño del juego

Hacer juegos en línea Paso 1
Hacer juegos en línea Paso 1

Paso 1. Escribe una descripción básica

Incluya características y lo que desea que logre el reproductor. Es bueno tener un esquema básico de lo que quieres hacer con tu juego escrito para que puedas consultarlo mientras trabajas en él.

Consulte esta guía para obtener más detalles sobre cómo escribir un documento de diseño de juegos

Hacer juegos en línea Paso 2
Hacer juegos en línea Paso 2

Paso 2. Dibuja algunos bocetos

Dibuja un diseño básico de cómo quieres que se vean las pantallas. Estos no tienen que ser muy detallados, pero al menos debería tener una idea de dónde se colocarán los distintos elementos en la pantalla. Estos serán increíblemente útiles más adelante cuando comiences a construir la interfaz para tu juego.

Hacer juegos en línea Paso 3
Hacer juegos en línea Paso 3

Paso 3. Elige un método para crear tu juego

Tradicionalmente, necesitaría aprender a codificar en ActionScript 3 para crear juegos Flash. Si bien aún puede hacer eso, hay programas disponibles que pueden hacer que la creación de juegos sea mucho más fácil de aprender y que no requieren experiencia en codificación. Algunas de las opciones más populares para crear juegos incluyen:

  • Stencyl: esta es una herramienta más nueva que te permite crear juegos usando objetos y scripts lógicos. Estos juegos pueden convertirse en proyectos Flash y cargarse en cualquier sitio web que admita juegos Flash.
  • Construct 2: a medida que Flash envejece, ha comenzado a ser reemplazado por otros medios para crear juegos. Una de las formas más nuevas de crear un juego en línea es utilizar HTML5. Normalmente, esto requiere mucho conocimiento de codificación, pero Construct 2 te permite crear juegos usando objetos y secuencias de comandos, al igual que Stencyl.
  • Flash Builder: este es el método tradicional para crear juegos Flash. Esto requiere bastante conocimiento de ActionScript, pero es uno de los lenguajes más fáciles de aprender. Flash Builder cuesta dinero, pero puede utilizar el programa FlashDevelop de código abierto para obtener la mayor parte de la misma funcionalidad.

Parte 2 de 4: Uso de Stencyl

Hacer juegos en línea Paso 4
Hacer juegos en línea Paso 4

Paso 1. Descargue e instale Stencyl

Stencyl es un programa de creación de juegos que no requiere ningún conocimiento de codificación. En su lugar, puedes usar una variedad de herramientas lógicas para manipular objetos en el juego.

Stencyl se puede utilizar de forma gratuita si solo quieres publicar tu juego en línea. La versión gratuita tendrá un logotipo de Stencyl al principio. Si obtiene la versión paga, puede publicarla en otras plataformas

Hacer juegos en línea Paso 5
Hacer juegos en línea Paso 5

Paso 2. Crea tu nuevo juego

Cuando inicie Stencyl, se le mostrará una lista de sus juegos. Habrá varios juegos de ejemplo en la lista que puede ver para ver cómo funcionan. Para comenzar a trabajar en su propio juego, haga clic en el cuadro con la línea de puntos etiquetada "Haga clic aquí para crear un nuevo juego".

Hacer juegos en línea Paso 6
Hacer juegos en línea Paso 6

Paso 3. Seleccione un kit

Hay varios kits que contienen activos y objetos prefabricados que pueden ayudarte a poner en marcha tu juego rápidamente. Seleccione un kit si lo desea, o seleccione "Juego en blanco" si planea hacer el suyo.

Puede descargar kits que otros usuarios hayan creado en línea

Hacer juegos en línea Paso 7
Hacer juegos en línea Paso 7

Paso 4. Ingresa la información de tu juego

Antes de comenzar a crear su juego, deberá ingresar algunos datos.

  • Nombre: este es el nombre de tu juego. Puedes cambiar esto más tarde a lo que quieras.
  • Tamaño de pantalla: este es el tamaño de la pantalla de tu juego y es muy importante, ya que afectará el arte que uses. Dado que las personas probablemente jugarán su juego dentro de su navegador web, el tamaño de la pantalla no tiene que ser muy grande. Prueba Ancho: 640 px Alto: 480 px. Este es un buen tamaño para empezar.
Hacer juegos en línea Paso 8
Hacer juegos en línea Paso 8

Paso 5. Familiarícese con el diseño

Cuando cargues tu nuevo juego por primera vez, se te llevará al Panel de control. Aquí es donde puedes ver todas las escenas de tu juego y acceder a los recursos. También puedes cambiar la configuración de tu juego desde aquí. Pasará la mayor parte del tiempo trabajando en el Panel de control.

  • Escenas: esta es la ventana principal del Tablero y muestra el juego real y todos los activos. Tu juego será una colección de escenas.
  • Recursos: esta es la lista de todos los objetos y activos de tu juego. incluye actores, fondos, fuentes, escenas, lógica, sonidos y conjuntos de mosaicos. Los recursos están organizados en un árbol en el lado izquierdo de la pantalla.
  • Configuración: las opciones Juego y Configuración te permiten ajustar cómo funciona la mecánica de tu juego, incluidos los controles, la gravedad, las colisiones, las pantallas de carga y más.
Hacer juegos en línea Paso 9
Hacer juegos en línea Paso 9

Paso 6. Personaliza un actor

Un actor es cualquier objeto que se mueve o con el que se puede interactuar en el juego (jugador, enemigo, puertas, etc.). Necesitarás crear un actor para cada objeto de tu juego. Para crear un actor, haga clic en la opción "Tipos de actor" en el menú Recursos. Seleccione el actor que desee de la lista (la lista está determinada por el kit que eligió).

  • Asignar al actor a un grupo (jugador, enemigo). Esto ayudará a determinar las propiedades de colisión del actor. Seleccione su actor para abrir el Editor de actores. Haga clic en la pestaña Propiedades y luego elija el grupo apropiado en el menú desplegable.
  • Agregue comportamientos (saltar, pisotear, caminar). Los comportamientos son los que le permiten a su actor realizar acciones. Haga clic en la pestaña Comportamientos y luego en el botón "+ Agregar comportamiento" en la esquina inferior izquierda. Seleccione un comportamiento (como "Caminar") de la lista y luego haga clic en "Elegir".
  • Configura los controles. Si estás creando un personaje de jugador, probablemente querrás permitir que el jugador lo mueva. Cuando agregue el comportamiento de Caminar, será llevado a la pantalla de atributos de Caminar. Puede usar los menús desplegables para elegir qué teclas moverán al actor hacia la izquierda y hacia la derecha. También puede asignar animaciones si el kit que está utilizando contiene alguna.
  • Puede agregar varios comportamientos para personalizar lo que puede hacer un actor.
Hacer juegos en línea Paso 10
Hacer juegos en línea Paso 10

Paso 7. Crea una escena

La escena es lo que ve el jugador cuando juega. Es el fondo, así como los objetos y actores visibles. Para crear una nueva escena, haga clic en la opción Escenas en el árbol de Recursos y luego haga clic en el cuadro de guiones. Dale un nombre a tu nueva escena para continuar.

  • Fondo: su escena se dimensionará automáticamente, por lo que no necesita preocuparse por eso en este momento. Puede optar por utilizar un color como fondo, sobre el que se colocarán mosaicos. Puede elegir entre un color sólido o un degradado. Haga clic en "Crear" cuando haya terminado. Esto abrirá el Diseñador de escenas.
  • Colocar mosaicos: el juego de mosaicos incluido en su kit se cargará en el lado derecho de la ventana. Haga clic en la herramienta Lápiz en el menú de la izquierda y luego haga clic en el mosaico que desea usar. Luego puede colocar el mosaico en su escena. Haga clic y arrastre con el mouse para colocar varios mosaicos.
  • Colocación de actores: haga clic en la pestaña Actores que se encuentra sobre su conjunto de mosaicos para cambiar a los actores disponibles. Debes haberlos creado previamente para que aparezcan en esta lista. Haga clic en el actor que desea colocar y luego haga clic en el lugar de la escena en el que desea que aparezca. Si mantienes presionada la tecla Mayús, el actor se ajustará a la cuadrícula.
  • Agregar gravedad: haz clic en la pestaña "Física" en la parte superior de la ventana y luego ingresa un valor en el campo "Gravedad (vertical)". Ingresar 85 simulará la gravedad del mundo real.
Hacer juegos en línea Paso 11
Hacer juegos en línea Paso 11

Paso 8. Prueba el juego

Una vez que hayas creado una escena y hayas colocado a algunos actores, puedes probar el juego. Haz clic en el botón "Probar juego" en la parte superior de la pantalla para jugar lo que tienes hasta ahora. Puedes usar las teclas que estableciste al crear tus actores para controlar tu personaje jugador.

Encuentre cualquier aspecto que no funcione e intente solucionarlo. Por ejemplo, ¿los enemigos se están comportando correctamente? ¿Puedes derrotar a tus enemigos? ¿Hay plataformas inalcanzables o abismos que no se pueden cruzar? Regrese al área relevante de su editor de juegos para solucionar cualquiera de los problemas que encuentre. Esto puede llevar un poco de tiempo, pero el resultado final será un juego mucho más divertido y jugable

Hacer juegos en línea Paso 12
Hacer juegos en línea Paso 12

Paso 9. Agregue más

Ahora que tienes una primera escena funcional y jugable, es hora de comenzar a construir todo el juego. Agregue más niveles y desafíos, y siga probando sus adiciones para asegurarse de que sean divertidas y funcionen correctamente.

Hacer juegos en línea Paso 13
Hacer juegos en línea Paso 13

Paso 10. Sitio Bloquea tu juego

Si va a cargar el juego en un sitio que aloja juegos Flash o cargarlo en su propio sitio, probablemente desee habilitar el "Bloqueo del sitio". Esto evitará que se juegue su juego si no está en la lista de sitios permitidos.

  • Abre "Configuración del juego" en el árbol de "Recursos". Seleccione la sección "Cargador". Ingrese los sitios que desea permitir en el campo "Bloqueo del sitio", separados por una coma sin espacios. Por ejemplo, newgrounds.com, kongregate.com.
  • Mientras esté en esta pantalla, ingrese su página de inicio en el campo "Su página de inicio", si tiene una. Esto permitirá que los jugadores que juegan su juego se vinculen a su sitio.
Hacer juegos en línea Paso 14
Hacer juegos en línea Paso 14

Paso 11. Exporta el juego como Flash

Una vez que esté satisfecho con su juego, puede exportarlo al formato Flash. Esto te permitirá cargar el juego en un sitio que aloje juegos Flash o en tu propio sitio web. Hacer clic Publicar seleccione Web y luego haga clic en Flash. Guarde el archivo en una ubicación fácil de encontrar en su computadora.

Hacer juegos en línea Paso 15
Hacer juegos en línea Paso 15

Paso 12. Publica el juego

Una vez que tenga su archivo Flash (. SWF), puede cargarlo en el host de su elección. Hay una variedad de sitios en línea que albergan juegos Flash, y algunos incluso pueden permitirle ganar dinero con los ingresos publicitarios con su juego. También puedes subir tu juego a tu propio sitio web, pero querrás asegurarte de tener el ancho de banda para atender a los jugadores si el juego se vuelve popular.

  • Consulte esta guía para cargar su juego en su propio sitio web.
  • Si desea cargar su juego en un sitio como Newgrounds o Kongregate, deberá crear una cuenta y luego pasar por el proceso de carga del sitio. Los términos y condiciones variarán de un sitio a otro.
  • Si desea publicar su juego en Stencyl Arcade, puede hacerlo desde el Programa Stencyl. Hacer clic Publicar seleccione Stencyl y luego haga clic en Arcade. El juego se cargará automáticamente, así que asegúrese de estar satisfecho con el nombre antes de hacer esto. Stencyl Arcade tiene un límite de tamaño de archivo de 8 MB.

Parte 3 de 4: Uso de Construct 2

Hacer juegos en línea Paso 16
Hacer juegos en línea Paso 16

Paso 1. Descargue e instale Construct 2

Este programa te permite crear juegos HTML5 con muy poca codificación. Tendrá que asignar algunas variables, pero todo esto se hace a través de menús sin necesidad de codificación real.

Construct 2 es gratuito, aunque algunas funciones son limitadas a menos que actualice. La versión gratuita no se puede publicar en ninguna otra plataforma que no sea HTML5

Hacer juegos en línea Paso 17
Hacer juegos en línea Paso 17

Paso 2. Cree un nuevo proyecto

Cuando inicie Construct 2 por primera vez, será recibido con un menú de bienvenida. Haga clic en el enlace "Nuevo proyecto" para comenzar un nuevo juego. También hay un par de ejemplos incluidos que puede usar para ver cómo se crean los juegos básicos.

Al crear un nuevo proyecto, se le dará una lista de plantillas. Para su primer proyecto, probablemente querrá comenzar con un proyecto vacío. Esto le permitirá familiarizarse con los conceptos básicos sin que las plantillas se interpongan en su camino

Hacer juegos en línea Paso 18
Hacer juegos en línea Paso 18

Paso 3. Ajuste la configuración de su proyecto

En el marco izquierdo de la ventana del proyecto, verá una serie de elementos en el marco Propiedades. Puede usar esto para configurar el tamaño de su pantalla e ingresar la información de su juego y compañía.

Hacer juegos en línea Paso 19
Hacer juegos en línea Paso 19

Paso 4. Inserte un fondo

Haz doble clic en el diseño. Seleccione "Fondo en mosaico" en la sección General. Haga clic en su diseño para colocar el fondo. Esto abrirá el editor de fondo. Deberá crear el suyo propio con un software de edición de imágenes o descargar texturas de una variedad de ubicaciones en línea.

  • Establezca el fondo al tamaño del diseño. Haga esto seleccionando el objeto de fondo y cambiando el tamaño en el marco de Propiedades.
  • Cambie el nombre de la capa y ciérrela. Querrá bloquear la capa para evitar moverla accidentalmente mientras coloca otros objetos. Haga clic en la pestaña "Capas" en el lado derecho de la pantalla. Seleccione la capa y haga clic en el icono de lápiz. Nombra la capa "Fondo" y luego haz clic en el botón "Candado" para bloquear el fondo.
Hacer juegos en línea Paso 20
Hacer juegos en línea Paso 20

Paso 5. Crea una nueva capa

En la pestaña Capas, haga clic en el botón "+" para crear una nueva capa. Cambie el nombre a "Principal". Esta será la capa en la que residen la mayoría de los objetos de tu juego. Asegúrese de que la capa principal esté seleccionada antes de continuar.

Hacer juegos en línea Paso 21
Hacer juegos en línea Paso 21

Paso 6. Agrega entradas para tu juego

En Construct 2, sus entradas deberán agregarse como objetos a su juego. Son invisibles y permitirán el uso del teclado y el mouse durante todo el proyecto.

Haga doble clic en su diseño y seleccione "Mouse" en la sección Entrada. Haga lo mismo para insertar el objeto "Teclado"

Hacer juegos en línea Paso 22
Hacer juegos en línea Paso 22

Paso 7. Agregue objetos

Es hora de comenzar a agregar algunos objetos de juego a su diseño. Haz doble clic en el diseño y selecciona "Sprite" en la sección General. Utilice la mira para elegir dónde desea colocar el objeto. Se abrirá el editor de imágenes, permitiéndote cargar un objeto existente o crear uno nuevo.

Cuando selecciona los sprites en su diseño, las propiedades del sprite se cargarán en el marco izquierdo. Cambia el nombre del objeto para que puedas identificarlo y hacer referencia a él más fácilmente

Hacer juegos en línea Paso 23
Hacer juegos en línea Paso 23

Paso 8. Agregue comportamientos a sus objetos

Para agregar un comportamiento, haga clic en el objeto al que desea agregar un comportamiento completo para seleccionarlo. Haga clic en el enlace "Agregar / editar" en la sección Comportamientos del marco Propiedades. Aparecerá una lista de comportamientos disponibles.

Los comportamientos son piezas de lógica preconfiguradas que le permiten agregar rápidamente funcionalidad a sus objetos. Puede elegir entre una amplia variedad de comportamientos predefinidos que pueden realizar una amplia gama de funciones. Por ejemplo, para hacer que el piso sea sólido, déle el comportamiento "Sólido". Para mover al jugador-personaje en ocho direcciones, dale el comportamiento de "movimiento en 8 direcciones"

Hacer juegos en línea Paso 24
Hacer juegos en línea Paso 24

Paso 9. Cambiar las propiedades del comportamiento

Puede editar comportamientos existentes para personalizar la forma en que funcionan sus objetos. Puede cambiar los valores para cambiar la velocidad, la dirección y otras propiedades.

Hacer juegos en línea Paso 25
Hacer juegos en línea Paso 25

Paso 10. Comprenda cómo funcionan los eventos

Los eventos son una lista de condiciones y son las que impulsan el juego. Si se cumplen las condiciones, ocurre el evento. Si no se cumplen las condiciones, el evento no ocurre. La hoja de eventos se ejecuta típicamente alrededor de 60 veces por segundo. Cada vez que se ejecuta se denomina "tic".

Hacer juegos en línea Paso 26
Hacer juegos en línea Paso 26

Paso 11. Cree un evento

Haga doble clic en la hoja de eventos en blanco. Aparecerá una lista de objetos disponibles. Seleccione el objeto para el que desea crear un evento o puede crear un evento del sistema.

  • Seleccione cuándo ocurre la acción. Después de seleccionar el objeto, se le pedirá que seleccione cuándo debe ocurrir el evento. Esto puede basarse en otros eventos o en determinados momentos. "Cada tick" es siempre.
  • Agrega una acción. Se le pedirá que seleccione uno de sus objetos. Elija de una lista de acciones. Por ejemplo, si estás haciendo un juego de disparos de arriba hacia abajo y quieres que el personaje del jugador siempre esté mirando al mouse, deberías crear una acción de "Establecer ángulo hacia la posición" en cada tick establecido en el objeto Player. Cuando se le solicite las coordenadas, ingrese "Mouse. X" para X y "Mouse. Y" para Y. Esto mantendrá la nave del jugador siempre apuntando hacia el cursor.
Hacer juegos en línea Paso 27
Hacer juegos en línea Paso 27

Paso 12. Agregue más eventos y comportamientos

Éstos son la columna vertebral de su juego. Agregar y modificar comportamientos y eventos te ayudará a crear un juego único y divertido que la gente estará deseando jugar. Experimente con diferentes eventos para intentar obtener el juego exacto que desea.

Hacer juegos en línea Paso 28
Hacer juegos en línea Paso 28

Paso 13. Agregue algunas variables

Hay dos tipos de variables en Construct 2: variables de instancia y variables globales. Estos le permiten establecer valores personalizados para sus objetos y juego, como salud, límites de tiempo, puntajes y más.

  • Variables de instancia: las variables de instancia son variables asignadas a objetos individuales. Se utilizan para cosas como la salud del enemigo y del jugador. Puede agregar variables de instancia después de seleccionar un objeto haciendo clic en el enlace "Agregar / editar" en la sección Variables del marco Propiedades. Asigne a la variable un nombre al que se pueda hacer referencia en un evento, así como un valor inicial.
  • Variables globales: las variables globales son variables asignadas a todo el juego. Se utilizan para cosas como la puntuación del jugador. Para crear una variable global, abra la hoja Evento y haga clic con el botón derecho en un espacio en blanco. Haga clic en "Agregar variable global", asígnele un nombre al que se pueda hacer referencia en un evento y luego ingrese un valor inicial.
Hacer juegos en línea Paso 29
Hacer juegos en línea Paso 29

Paso 14. Cree una interfaz

Al crear una interfaz, generalmente es mejor hacerlo en una nueva capa. Esto se debe a que la interfaz rara vez se mueve o cambia, por lo que es bueno tenerla en una capa bloqueada. En el cuadro Propiedades de la nueva capa, establezca "Parallax" en 0. Esto evitará que la capa se desplace cuando lo haga la pantalla.

Utilice cuadros de texto y variables para crear su interfaz. Puede configurar sus cuadros de texto para mostrar la salud restante, la puntuación, la munición o cualquier otra cosa que el jugador necesite ver de forma regular

Hacer juegos en línea Paso 30
Hacer juegos en línea Paso 30

Paso 15. Prueba y revisa tu juego

Ahora que tiene algunos objetos en la pantalla con eventos y comportamientos, puede comenzar a probar y agregar contenido. Haz clic en el botón "Jugar" en la parte superior de la pantalla para crear y probar el juego. Toma nota de cualquier cosa que no haya funcionado e intenta arreglarlo para que tu juego sea jugable y divertido.

Hacer juegos en línea Paso 31
Hacer juegos en línea Paso 31

Paso 16. Exporta el juego

Si está satisfecho con su juego, puede exportarlo para que cualquiera pueda cargarlo en un sitio web y jugarlo. Para exportar el juego, haz clic en el Expediente menú y seleccione Exportar. Guarde el proyecto en una ubicación que pueda localizar fácilmente.

Hacer juegos en línea Paso 32
Hacer juegos en línea Paso 32

Paso 17. Publica el juego

Hay varios sitios que le permiten cargar juegos HTML5 para que otros jueguen. También puede agregar el juego a su propio sitio web. Consulte esta guía para obtener detalles sobre cómo cargar el juego en su propio sitio web.

Parte 4 de 4: Codificación desde cero

Paso 1. Descargue un IDE de programación (entorno de desarrollo integrado) que admita HTML como Game Maker Studio

Algunos están disponibles de forma gratuita, aunque muchos de los mejores IDE cuestan cientos de dólares.

Paso 2. Aprenda a usar el IDE

Aprender a programar en su entorno es increíblemente importante. Memorizar la mayor parte del código común y aprender a implementar las cosas correctamente puede llevar semanas o incluso meses. ¡Sea paciente y todo valdrá la pena!

Paso 3. Cree su juego una vez que crea que está listo

Hacer un documento de diseño o anotar algunas ideas es un gran comienzo. La programación de un juego puede llevar meses o, si realmente quieres lograr un éxito, incluso uno o dos años.

Paso 4. Prueba el juego

Asegúrate de intentar hacer cosas locas o inesperadas y eliminar tantos errores como puedas. También trata de determinar si la jugabilidad es como la querías o si necesitas regresar y hacer cambios.

Paso 5. ¡Publícalo

Publique su juego en línea en un sitio web como Kongregate. Debes estar preparado para las críticas constructivas y es posible que desees actualizar tu juego para satisfacer los deseos de tu base de jugadores.

Consejos

  • Si está más interesado en aprender el código detrás de los juegos Flash, puede usar el código Flash Builder y ActionScript 3 para crear juegos personalizados. Esto llevará más tiempo, pero podría resultar en una experiencia más única. Consulte esta guía para obtener detalles sobre la programación en Actions Script 3.
  • Dale crédito a las fuentes de las que tomaste ideas o contenido, y a todos los que ayudaron a crear el juego.

Recomendado: