INSTITUTO TECNOLÓGICO SUPERIOR TECSUP
ADMINISTRACIÓN DE REDES Y COMUNICACIONES
CURSO: Programación Móvil para Redes
PROYECTO:
Snake Binario
Docente:
Presentado por:
Arequipa - Perú
2025
INDICE
1. Objetivos..........................................................................................................................................................
2. Marco teórico:.................................................................................................................................................
3. Aplicación........................................................................................................................................................
4. Desarrollo........................................................................................................................................................
5. Conclusiones....................................................................................................................................................
6. Referencias......................................................................................................................................................
1. Objetivos
Objetivo general:
El proyecto SnakeBiT busca combinar el entretenimiento con el aprendizaje, permitiendo
a los usuarios desarrollar habilidades en la conversión de números binarios a decimales y
viceversa. Esta práctica es esencial para comprender cómo se representan y transfieren
los datos en los sistemas digitales, especialmente en las capas inferiores del modelo
OSI, como la Capa Física y la Capa de Enlace de Datos.
A través de un juego interactivo basado en el clásico "gusano" (Snake), los jugadores
manipulan valores codificados en binario, lo que les ayuda a visualizar cómo se procesan
los datos en la comunicación entre dispositivos. El objetivo es que, de forma didáctica, se
fortalezca la comprensión del funcionamiento de la transmisión de datos en redes
informáticas, aspecto clave para estudiantes y profesionales en el campo de la tecnología
y las comunicaciones.
Objetivos específicos:
❖ Fomentar la comprensión del sistema binario y su conversión al sistema decimal,
mediante la dinámica de recolección de elementos dentro del juego
❖ Simular de forma didáctica el proceso de transmisión de datos, haciendo
referencia a cómo se representa la información en la Capa Física y la Capa de
Enlace de Datos del modelo OSI.
❖ Evaluar el impacto del juego como herramienta educativa en la enseñanza de
principios básicos de redes y codificación de datos.
2. Marco teórico:
a) SurfaceView:
El SurfaceView es como una ventana independiente dentro de tu app
donde puedes realizar gráficos personalizados (como animaciones o videojuegos),
ya que te da acceso directo a un área de dibujo que no depende del sistema de
interfaz de usuario tradicional. Es muy útil cuando necesitas que el dibujo se
actualice rápido y sin interferencias, como en un juego con muchos movimientos
o elementos gráficos en tiempo real.
Ventajas:
❖ Permite dibujar con mayor control y rendimiento.
❖ Trabaja en un hilo (thread) separado, lo cual evita que se congele la
interfaz del usuario.
❖ Se usa comúnmente en juegos, reproductores de vídeo, o cualquier
aplicación que necesite gráficos dinámicos.
3. Aplicación
Describe en qué contexto o entorno se aplican los conocimientos expuestos.
Snake Binari es un proyecto pensado para el ámbito educativo y tecnológico,
especialmente útil para quienes están empezando a aprender sobre redes y codificación
binaria en carreras como informática o telecomunicaciones. La idea es aprovechar la
dinámica del clásico juego Snake para crear una experiencia interactiva que ayude a
reforzar conceptos clave, como la conversión de números binarios o cómo se representan
los datos en los niveles más bajos del modelo OSI (la capa física y la de enlace de datos).
Este tipo de herramienta encaja muy bien en cursos introductorios como redes,
arquitectura de computadoras, sistemas digitales o incluso programación. Gracias a su
diseño visual y dinámico, permite a los estudiantes interactuar con los datos de una forma
más tangible. Además, al usar tecnologías como SurfaceView, el juego mantiene un buen
rendimiento gráfico, lo cual es clave para captar y mantener la atención de los usuarios,
simulando de forma clara cómo circula y se transforma la información.
Snake Binari también funciona muy bien como complemento en talleres, laboratorios o
prácticas dirigidas. Para los docentes, es una forma efectiva de evaluar si los estudiantes
están comprendiendo conceptos que suelen ser abstractos y difíciles de visualizar, cómo
el sistema binario, la codificación y la transmisión de datos. Todo esto se logra en un
entorno que fomenta la exploración, el aprendizaje a través del ensayo y error, y, sobre
todo, el aprendizaje significativo.
4. Desarrollo
GameActivity
package [Link];
import [Link];
import [Link];
public class GameActivity extends AppCompatActivity {
private SnakeView snakeView;
@Override
protected void onCreate(Bundle savedInstanceState) {
[Link](savedInstanceState);
snakeView = new SnakeView(this);
setContentView(snakeView);
}
@Override
protected void onPause() {
[Link]();
[Link]();
}
@Override
protected void onResume() {
[Link]();
[Link]();
}
}
Activity_game.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<TextView
android:text="Pantalla del Juego"
android:textSize="24sp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
[Link]
package [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
public class MainActivity extends AppCompatActivity {
Button btnJugar, btnTutorial, btnPuntuaciones, btnSalir;
@Override
protected void onCreate(Bundle savedInstanceState) {
[Link](savedInstanceState);
setContentView([Link].activity_main);
btnJugar = findViewById([Link]);
btnTutorial = findViewById([Link]);
btnPuntuaciones = findViewById([Link]);
btnSalir = findViewById([Link]);
// Lanzar GameActivity
[Link](new [Link]() {
@Override
public void onClick(View view) {
Intent intent = new Intent([Link],
[Link]);
startActivity(intent);
}
});
// Lanzar TutorialActivity
[Link](new [Link]() {
@Override
public void onClick(View view) {
Intent intent = new Intent([Link],
[Link]);
startActivity(intent);
}
});
// Lanzar ScoreActivity
[Link](new [Link]() {
@Override
public void onClick(View view) {
Intent intent = new Intent([Link],
[Link]);
startActivity(intent);
}
});
// Salir de la aplicación
[Link](new [Link]() {
@Override
public void onClick(View view) {
new [Link]([Link])
.setTitle("Salir")
.setMessage("¿Deseas salir del juego?")
.setPositiveButton("Sí", new
[Link]() {
public void onClick(DialogInterface dialog,
int which) {
finishAffinity(); // Cierra
completamente la app
}
})
.setNegativeButton("No", null)
.show();
}
});
}
}
Activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="[Link]
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:padding="24dp"
android:background="#121212">
<Button
android:id="@+id/btnJugar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Jugar"
android:textSize="20sp"
android:layout_marginBottom="16dp" />
<Button
android:id="@+id/btnTutorial"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Tutorial"
android:textSize="20sp"
android:layout_marginBottom="16dp" />
<Button
android:id="@+id/btnPuntuaciones"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Puntuaciones"
android:textSize="20sp"
android:layout_marginBottom="16dp" />
<Button
android:id="@+id/btnSalir"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Salir"
android:textSize="20sp" />
</LinearLayout>
[Link]
package [Link];
import [Link];
import [Link];
public class ScoreActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
[Link](savedInstanceState);
setContentView([Link].activity_score);
}
}
Activity?[Link]
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<TextView
android:text="Puntuaciones"
android:textSize="24sp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
[Link]
package [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
public class SnakeView extends SurfaceView implements Runnable {
// ----- estados -----
private enum GameState { READY, RUNNING, GAME_OVER }
private GameState gameState = [Link];
// ----- tamaños de murallas y objetivos -----
private static final int[][] WALL_SIZES = { {3,3}, {3,2}, {4,4},
{4,2}, {6,4} };
private static final int[] TARGET_DECIMALS = {0, 255, 192, 168,
127, 10, 8};
// ----- view & dibujo -----
private final SurfaceHolder holder = getHolder();
private final Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
private Canvas canvas;
// ----- juego -----
private final ArrayList<Point> snake = new ArrayList<>();
private final ArrayList<Point> walls = new ArrayList<>();
private Point food0, food1;
private int directionX = 1, directionY = 0;
private String binaryString = "";
private int targetDecimal;
private boolean gameWon = false;
// ----- tablero -----
private final int blockSize = 50;
private int gameLeft, gameRight, gameTop, gameBottom;
private int numBlocksWide, numBlocksHigh;
// ----- bucle -----
private Thread thread;
private boolean isPlaying;
// ----- input -----
private float touchX, touchY;
private static final String PREFS = "SnakePrefs";
private static final String KEY_WINS = "wins";
private SharedPreferences prefs;
private long gameOverTime = 0; // momento en que terminó la
partida
// ---------- constructores ----------
public SnakeView(Context ctx) { super(ctx); init();
prefs = [Link](PREFS, Context.MODE_PRIVATE);
;
}
public SnakeView(Context ctx, AttributeSet a) { super(ctx, a);
init(); }
private void init() {
int width = getResources().getDisplayMetrics().widthPixels;
int height = getResources().getDisplayMetrics().heightPixels;
gameLeft = 50;
gameRight = width - 50;
gameTop = 200;
gameBottom = height - 100;
numBlocksWide = (gameRight - gameLeft ) / blockSize;
numBlocksHigh = (gameBottom - gameTop ) / blockSize;
initGame();
}
// ---------- reinicio de partida ----------
private void initGame() {
[Link]();
[Link](new Point(numBlocksWide / 2, numBlocksHigh / 2));
directionX = 0; directionY = 0;
binaryString = "";
generateWalls();
food0 = newRandomFood();
do { food1 = newRandomFood(); } while ([Link](food0));
targetDecimal = TARGET_DECIMALS[new
Random().nextInt(TARGET_DECIMALS.length)];
gameWon = false;
}
// ---------- generación de murallas ----------
/** Genera entre 3 y 5 murallas rectangulares. */
private void generateWalls() {
[Link]();
Random r = new Random();
Point start = new Point(numBlocksWide / 2, numBlocksHigh / 2);
int numRectangles = 3 + [Link](3); // 3-5 murallas
int placed = 0;
int attempts = 0;
while (placed < numRectangles && attempts < 500) {
attempts++;
// 1. Elegir tamaño
int[] sz = WALL_SIZES[[Link](WALL_SIZES.length)];
int w = sz[0], h = sz[1];
// 2. Posición esquina superior-izquierda
int x0 = [Link](numBlocksWide - w);
int y0 = [Link](numBlocksHigh - h);
// 3. Mantener distancia mínima al inicio
if ([Link](x0 - start.x) + [Link](y0 - start.y) < 6)
continue;
// 4. Construir lista de puntos del rectángulo
List<Point> candidate = new ArrayList<>();
for (int dx=0; dx<w; dx++)
for (int dy=0; dy<h; dy++)
[Link](new Point(x0 + dx, y0 + dy));
// 5. Verificar solapamiento con otras murallas
boolean overlap = false;
for (Point p : candidate) {
if ([Link](start)) { overlap = true; break; }
// verifica cada celda de muralla existente
for (Point q : walls) {
int dx = [Link](p.x - q.x);
int dy = [Link](p.y - q.y);
if (dx < 2 && dy < 2) { // distancia estricta en
ambos ejes (<2)
overlap = true;
break;
}
}
if (overlap) break;
}
if (overlap) continue; // intenta nuevamente
// 6. Aceptar la muralla
[Link](candidate);
placed++; // ¡cuenta bloques, no celdas!
}
}
// ---------- alimento ----------
private Point newRandomFood() {
Random r = new Random();
Point p;
do { p = new Point([Link](numBlocksWide),
[Link](numBlocksHigh)); }
while ([Link](p) || [Link](p));
return p;
}
// ---------- bucle ----------
@Override public void run() {
while (isPlaying) {
if (gameState == [Link]) update();
draw();
sleep();
}
}
private void update() {
Point head = [Link](0);
Point newHead = new Point(head.x + directionX, head.y +
directionY);
// choque con bordes o muralla
if (newHead.x<0 || newHead.x>=numBlocksWide || newHead.y<0 ||
newHead.y>=numBlocksHigh
|| [Link](newHead)) {
gameWon = false;
gameState = GameState.GAME_OVER;
gameOverTime = [Link]();
// guarda el tiempo del game over
return;
}
boolean ate0 = [Link](food0);
boolean ate1 = [Link](food1);
if (ate0 || ate1) {
[Link](0, newHead);
binaryString += ate0 ? "0" : "1";
// recolocar alimentos
do {
food0 = newRandomFood();
do { food1 = newRandomFood(); } while
([Link](food0));
} while ([Link](food0) || [Link](food1));
// 8 bits -> verificar
if ([Link]() == 8) {
int val = [Link](binaryString, 2);
gameWon = (val == targetDecimal);
gameState = GameState.GAME_OVER;
if (gameWon) {
int wins = [Link](KEY_WINS, 0); // obtener
los aciertos actuales
[Link]().putInt(KEY_WINS, wins + 1).apply();
// incrementarlos
}
}
} else {
[Link](0, newHead);
[Link]([Link]()-1);
}
}
// ---------- dibujar ----------
private void draw() {
if (![Link]().isValid()) return;
canvas = [Link]();
[Link]([Link]);
// marco
[Link]([Link]);
[Link](4);
[Link](gameLeft, gameTop, gameRight, gameBottom,
paint);
// murallas
for (Point w : walls) drawWallCell(w);
// serpiente
for (Point p : snake) drawSnakeCell(p);
// alimentos
drawFood(food0, "0");
drawFood(food1, "1");
// HUD superior
[Link]([Link]);
[Link](50);
[Link]([Link]);
[Link]("Bits: " + [Link]() + "/8", 50,
80, paint);
[Link]([Link]);
[Link]("Objetivo: " + targetDecimal, 380, 80, paint);
[Link](45);
[Link]("Binario: " + binaryString, 50, 140, paint);
// mensajes START / GAME OVER
[Link]([Link]);
if (gameState == [Link]) {
[Link]([Link]); [Link](90);
[Link]("START", [Link]()/2f,
[Link]()/2f, paint);
[Link](40);
[Link]("Toca para comenzar", [Link]()/2f,
[Link]()/2f + 60, paint);
} else if (gameState == GameState.GAME_OVER) {
String targetBin = [Link]("%8s",
[Link](targetDecimal))
.replace(' ', '0');
[Link](70);
[Link](gameWon ? [Link] : [Link]);
[Link](gameWon ? "¡CORRECTO!" : "INCORRECTO",
[Link]()/2f, [Link]()/2f - 80,
paint);
[Link](40); [Link]([Link]);
[Link]("Objetivo: " + targetBin,
[Link]()/2f, [Link]()/2f - 20,
paint);
[Link]("Tú: " + binaryString,
[Link]()/2f, [Link]()/2f + 30,
paint);
[Link]("Toca para reiniciar",
[Link]()/2f, [Link]()/2f + 100,
paint);
}
[Link](canvas);
}
// ----- helpers de dibujo -----
private void drawWallCell(Point w) {
int x = gameLeft + w.x * blockSize;
int y = gameTop + w.y * blockSize;
// Relleno marrón-anaranjado
[Link]([Link]("#CC6600")); // tono
intermedio
[Link](x, y, x + blockSize, y + blockSize, paint);
// Borde marrón oscuro
[Link]([Link]);
[Link](3);
[Link]([Link]("#8B3E00"));
[Link](x, y, x + blockSize, y + blockSize, paint);
[Link]([Link]);
}
private void drawSnakeCell(Point p) {
int x = gameLeft + p.x * blockSize;
int y = gameTop + p.y * blockSize;
[Link]([Link]("#00FF00"));
[Link](x, y, x+blockSize, y+blockSize, 15, 15,
paint);
[Link]([Link]);
[Link](x+4, y+4, x+blockSize-4, y+blockSize-4,
12, 12, paint);
}
private void drawFood(Point food, String label) {
int fx = gameLeft + food.x * blockSize;
int fy = gameTop + food.y * blockSize;
[Link]([Link]);
[Link](fx, fy, fx+blockSize, fy+blockSize, 15,
15, paint);
[Link]([Link]); [Link](3);
[Link]([Link]);
[Link](fx, fy, fx+blockSize, fy+blockSize, 15,
15, paint);
[Link]([Link]);
[Link]([Link]); [Link](40);
[Link]([Link]);
[Link] fm = [Link]();
float textX = fx + blockSize/2f;
float textY = fy + blockSize/2f - ([Link] + [Link])/2f;
[Link](label, textX, textY, paint);
}
// ---------- pausa y timing ----------
private void sleep() {
try { [Link](200); } catch (InterruptedException ignored)
{}
}
public void pause() {
isPlaying = false;
try { if (thread != null) [Link](); } catch
(InterruptedException ignored) {}
}
public void resume() {
isPlaying = true;
thread = new Thread(this);
[Link]();
}
// ---------- input ----------
@Override
public boolean onTouchEvent(MotionEvent e) {
switch ([Link]()) {
case MotionEvent.ACTION_DOWN:
touchX = [Link](); touchY = [Link]();
break;
case MotionEvent.ACTION_UP:
if (gameState == [Link]) {
gameState = [Link];
return true;
}
if (gameState == GameState.GAME_OVER) {
if ([Link]() - gameOverTime >=
1500) {
initGame();
gameState = [Link];
}
return true;
float dx = [Link]() - touchX;
float dy = [Link]() - touchY;
if ([Link](dx) > [Link](dy)) {
if (dx > 0 && directionX != -1) { directionX = 1;
directionY = 0; }
else if (dx < 0 && directionX != 1) { directionX =
-1; directionY = 0; }
} else {
if (dy > 0 && directionY != -1) { directionX = 0;
directionY = 1; }
else if (dy < 0 && directionY != 1) { directionX =
0; directionY = -1; }
}
break;
}
return true;
}
}
TutorialActivity
package [Link];
import [Link];
import [Link];
public class TutorialActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
[Link](savedInstanceState);
setContentView([Link].activity_tutorial);
}
}
Activity_Tutorial.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<TextView
android:text="Tutorial del Juego"
android:textSize="24sp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
Resultados:
Figura 1: Pantalla principal.
Figura 2: Pantalla de inicio de juego init()
Figura 3: Pantalla de completar el objetivo
Figura 4: pantalla de fallar el objetivo
Figura 5: Pantalla de generación de bloques
Figura 6: Pantalla de tutorial
Figura 7: Pantalla de puntuaciones
5. Conclusiones
Presenta un resumen de los hallazgos y conclusiones generales del trabajo.
❖ Integración de aprendizaje y entretenimiento: El proyecto demuestra que es
posible aprender sobre sistemas binarios y transmisión de datos mediante una
dinámica lúdica como el juego Snake.
❖ Visualización efectiva de conceptos abstractos: Al convertir números binarios
durante el juego, se facilita la comprensión de la codificación y representación de
datos en las redes.
❖ Aplicación del modelo OSI en un entorno práctico: Se refuerzan los conceptos
de la Capa Física y Capa de Enlace de Datos del modelo OSI de forma interactiva
y tangible.
❖ Uso eficiente de SurfaceView: La implementación de SurfaceView en Android
permitió una experiencia gráfica fluida, demostrando su utilidad en el desarrollo
de juegos educativos.
❖ Desarrollo modular y escalable: El proyecto está estructurado en múltiples
actividades (Main, Game, Tutorial, Score), facilitando su mantenimiento y
escalabilidad.
6. Recomendaciones
- Agregar retroalimentación visual o auditiva: Incluir efectos de sonido o
animaciones cuando se recolecta un bit (0 o 1) o se forma una cadena binaria
completa ayudaría a mantener al usuario más involucrado.
- Expandir la funcionalidad del puntaje: Sería útil agregar una conversión
automática del binario al decimal visible en pantalla, y quizás premiar al jugador
por formar ciertos números específicos.
- Soporte multilenguaje: Dado su enfoque educativo, una versión con soporte en
inglés y español permitiría que más estudiantes puedan aprovecharlo.
6. Referencias
● Deitel, P. J., & Deitel, H. M. (2016). Android para programadores: Una guía
para desarrolladores de aplicaciones móviles. Pearson Educación.
● Tanenbaum, A. S., & Wetherall, D. J. (2011). Redes de computadoras (5.ª ed.).
Pearson.
● Kurniawan, B. (2010). Android Programming: Build Your First Mobile App.
Brainy Software.
● Cisco Networking Academy. (2022). Introducción a redes: Guía del estudiante.
Cisco Press.
● Papastergiou, M. (2009). Digital game-based learning in high school computer
science education: Impact on educational effectiveness and student motivation.
Computers & Education, 52(1), 1–12.
● Android Developers. (2024). SurfaceView. Recuperado de
[Link]