A downloadable project

EN

Project for the Interaction and Interface Design Course

In university, within the Interaction and Interface Design course, we were assigned a practical challenge to recreate the interface and main menu of the game Brawl Stars from scratch. The only materials provided were a reference image of the menu and a PNG file of the character that should be placed in the center of the screen. The rest of the design, graphical elements, and interface structure had to be created entirely from scratch.

The goal of this project was to put into practice our skills in user interface design, considering aesthetics, usability, and user experience, while maintaining the visual identity of the game. The task involved creating various buttons, animations, icons, and other interactive components that make up the main menu, while adhering to the design principles applied in mobile games.

This exercise not only allowed us to develop our graphic and interactive design abilities but also our decision-making skills regarding the placement of elements and how these communicate with the user, always aiming for a smooth and engaging experience.

The project was a challenging and stimulating task, as it required both creativity and precision in implementing all the interface components, thus providing a comprehensive experience that integrates both visual design and interactive functionality.

______________________________________________________________________________________

ES
<title>Portfolio - Brawl Stars</title>

Proyecto de la Asignatura de Interacción y Diseño de Interfaces

En la universidad, dentro de la asignatura de Interacción y Diseño de Interfaces, se nos asignó un reto práctico que consistía en recrear la interfaz y el menú principal del juego Brawl Stars desde cero. El único material proporcionado fue una imagen de referencia del menú y un archivo PNG del personaje que debía ubicarse en el centro de la pantalla. El resto del diseño, elementos gráficos y estructura de la interfaz debíamos crearlos de manera completamente original.

El objetivo de este proyecto era poner en práctica nuestras habilidades en el diseño de interfaces de usuario, teniendo en cuenta la estética, la usabilidad y la experiencia del usuario, al mismo tiempo que se debía mantener la identidad visual del juego. La tarea involucró la creación de los diversos botones, animaciones, iconos y demás componentes interactivos que forman parte del menú principal, respetando las pautas de diseño que se aplican en este tipo de juegos móviles.

Este ejercicio no solo permitió desarrollar la capacidad de diseño gráfico e interactivo, sino también la de tomar decisiones sobre la disposición de los elementos y cómo estos se comunican con el usuario, buscando siempre una experiencia fluida y atractiva.

El proyecto fue un desafío estimulante, ya que requería tanto creatividad como precisión en la implementación de todos los componentes de la interfaz, brindando así una experiencia completa que integra tanto el diseño visual como la funcionalidad interactiva.

Download

Download
MainMenu.psd 23 MB
Download
MainMenu.png 1.2 MB
Download
brawl-stars-main-menu.png 1 MB

Install instructions

EN<title>Download Information</title>

Download Information

This project includes three files that showcase the process and final result of designing the main menu interface for the game Brawl Stars.

  • brawl-stars-main-menu.png: This file is the reference image provided for the project. It contains a screenshot of the original Brawl Stars menu, which served as the base for creating the new design.
  • MainMenu.png: This file is the final result of the project. It shows the main menu interface I designed, following the reference image and applying my own ideas of graphic design and interaction.
  • MainMenu.psd: This is the working file in PSD format from Photoshop. It contains all the layers and details of the design, allowing you to observe the entire process of creating the interface, including the placement of elements, icons, buttons, and other visual features.

All three files are available for download, and together they allow you to view both the development process and the final result of the Brawl Stars menu interface design.

______________________________________________________________________________________

ES

Información de la Descarga

Este proyecto incluye tres archivos que muestran el proceso y resultado final del diseño de la interfaz del menú principal del juego Brawl Stars.

  • brawl-stars-main-menu.png: Este archivo es la imagen de referencia proporcionada para el proyecto. Contiene una captura del menú original de Brawl Stars que sirvió como base para la creación del nuevo diseño.
  • MainMenu.png: Este archivo es el resultado final del proyecto. En él se muestra la interfaz del menú principal que he diseñado, siguiendo las indicaciones de la referencia y aplicando mis propias ideas de diseño gráfico e interacción.
  • MainMenu.psd: Este es el archivo de trabajo en formato PSD de Photoshop. En él se pueden ver todas las capas y detalles del diseño, permitiendo observar el proceso completo de creación de la interfaz, incluyendo la disposición de los elementos, los iconos, botones, y otras características visuales.

Los tres archivos están disponibles para su descarga, y juntos permiten visualizar tanto el proceso de desarrollo como el resultado final del diseño de la interfaz del menú de Brawl Stars.

Leave a comment

Log in with itch.io to leave a comment.