Crafting a platform to promote
an academic project
Crafting a platform
to promote an academic game
Game of Ethics is an academic project designed to support the IT course of Unimelb University in presenting games that challenge students to reflect on real-world decisions involving ethics dilemmas in technological products developed by them.
I designed the platform’s interface and interactive prototype, creating a playful and accessible experience. The result was a colorful, web-based solution that combines retro game aesthetics and modern design with the aim of dialoguing with the reference of games from different generations, reaching teachers and young students.
Game of Ethics is an academic project designed to support the IT course of Unimelb University in presenting games that challenge students to reflect on real-world decisions involving ethics dilemmas in technological products developed by them.
I designed the platform’s interface and interactive prototype, creating a playful and accessible experience. The result was a colorful, web-based solution that combines retro game aesthetics and modern design with the aim of dialoguing with the reference of games from different generations, reaching teachers and young students.
MY DESIGN PROCESS
MY DESIGN PROCESS
MY DESIGN PROCESS
DISCOVERY
08 days
STAKEHOLDER INTERVIEW
VISUAL RESEARCH
DEFINITION
05 days
PROBLEM
CHALLENGE
PROPOSAL SOLUTION
FOUNDATIONS
09 days
STYLE DEFINITION
SITE MAP
WIREFRAME
DEVELOPMENT
12 days
DESIGN SYSTEM
PROTOTYPE
STAKEHOLDER FEEDBACK
1. DISCOVERY
1. DISCOVERY
1. DISCOVERY
VISUAL RESEARCH
VISUAL RESEARCH
VISUAL RESEARCH
OLD ERA

Image and Colour
Low resolution images and strong colors
with a predominance of blue, red and green.

Symbol
Video game remote controls and their
shapes are symbolic elements of the
old era.


Typography
Typography used to stand out with
different formats.

Shape
The pixel shape was present
in all games.
OLD ERA

Image and Colour
Low resolution images and strong colors with a predominance of blue, red and green.

Symbol
Video game remote controls and their
shapes are symbolic elements of the
old era.

Typography
Typography used to stand out with
different formats.
Shape
The pixel shape was present
in all games.MODERN ERA

Image and Colour
High resolution images and a predominance of different shades of blue and purple.

Symbol
Computers and virtual reality glasses are references of the digital era of games.


Typography
With the modernization of games, brands have become more minimalist and the quality of game graphics stood out as an element of differentiation and enhancement of their product.

Shape
In modern high-resolution games, shapes are as varied as possible.
MODERN ERA

Image and Colour
High resolution images and a predominance of different shades of blue and purple.

Symbol
Computers and virtual reality glasses are references of the digital era of games.


Typography
With the modernization of games, brands have become more minimalist and the quality of game graphics stood out as an element of differentiation and enhancement of their product.

Shape
In modern high-resolution games, shapes are as varied as possible.
2. DEFINE
2. DEFINE
2. DEFINE
PROBLEM
Faced with real ethical dilemmas involving situations in which technology played a central role, it is necessary to invite these students (future technology professionals) to think critically about the consequences of their future actions, putting themselves in the shoes of those who were directly affected by tragic events.
PROBLEM
Faced with real ethical dilemmas involving situations in which technology played a central role, it is necessary to invite these students (future technology professionals) to think critically about the consequences of their future actions, putting themselves in the shoes of those who were directly affected by tragic events.
PROBLEM
Faced with real ethical dilemmas involving situations in which technology played a central role, it is necessary to invite these students (future technology professionals) to think critically about the consequences of their future actions, putting themselves in the shoes of those who were directly affected by tragic events.
CHALLENGE
The platform needed to present the development of educational games about ethics in technology in a way that was both engaging for students and educators.
CHALLENGE
The platform needed to present the development of educational games about ethics in technology in a way that was both engaging for students and educators.
CHALLENGE
The platform needed to present the development of educational games about ethics in technology in a way that was both engaging for students and educators.
SOLUTION PROPOSAL
SOLUTION PROPOSAL
1. PRESENTING THE GAME
Present "The Boeing Game" in a way that encouraged exploration and participation.
2.PRODUCT VALUE
Convey the real value of using the game as a language that can achieve educational purposes.
3.BUILD AN IDENTITY
Create a visual communication that can reach both teachers and students.
1. PRESENTING THE GAME
Present "The Boeing Game" in a way that encouraged exploration and participation.
2.PRODUCT VALUE
Convey the real value of using the game as a language that can achieve educational purposes.
3.BUILD AN IDENTITY
Create a visual communication that can reach both teachers and students.
3. IDEATION
3. IDEATION
3. IDEATION
STYLE DEFINITION
Through the research carried out, it was possible to identify that it would be valuable to adopt a language that could fluctuate between the old era of video games, dialoguing with teachers, and the modern and current era, dialoguing with students. In order to generate identification in both. As a solution, we opted for an aesthetic that mixed elements from both eras, prioritizing a contemporary style in order to locate the current project in time.
STYLE DEFINITION
Through the research carried out, it was possible to identify that it would be valuable to adopt a language that could fluctuate between the old era of video games, dialoguing with teachers, and the modern and current era, dialoguing with students. In order to generate identification in both. As a solution, we opted for an aesthetic that mixed elements from both eras, prioritizing a contemporary style in order to locate the current project in time.
STYLE DEFINITION
Through the research carried out, it was possible to identify that it would be valuable to adopt a language that could fluctuate between the old era of video games, dialoguing with teachers, and the modern and current era, dialoguing with students. In order to generate identification in both. As a solution, we opted for an aesthetic that mixed elements from both eras, prioritizing a contemporary style in order to locate the current project in time.
WIREFRAME
WIREFRAME
4. DESIGN & FEATURES
4. DESIGN & FEATURES
4. DESIGN & FEATURES
STYLEGUIDE
STYLEGUIDE
STYLEGUIDE



PROTOTYPE
PROTOTYPE
PROTOTYPE



How to Play
How to Play
Button
Button
5. INSIGHTS
5. INSIGHTS
5. INSIGHTS
OUTCOME
To solve the dual challenge of education and engagement, I created an interface that felt playful yet credible. The layout used bold headings, modular sections, and game-inspired design cues to make the content feel more immersive. The result was a flexible and inviting platform that made it easy for both teachers and students to understand the project and explore its games.
OUTCOME
To solve the dual challenge of education and engagement, I created an interface that felt playful yet credible. The layout used bold headings, modular sections, and game-inspired design cues to make the content feel more immersive. The result was a flexible and inviting platform that made it easy for both teachers and students to understand the project and explore its games.
OUTCOME
To solve the dual challenge of education and engagement, I created an interface that felt playful yet credible. The layout used bold headings, modular sections, and game-inspired design cues to make the content feel more immersive. The result was a flexible and inviting platform that made it easy for both teachers and students to understand the project and explore its games.
KEY TAKEAWAYS
1. Designing with no brand guidelines can be challenging but it's also an opportunity to shape a project based on a visual language with which the public identifies. 2. Playful interfaces can work in academic settings when grounded in clarity and purpose. 3. A good mood board can be a powerful tool to align visual expectations with a client early in the process.
KEY TAKEAWAYS
1. Designing with no brand guidelines can be challenging but it's also an opportunity to shape a project based on a visual language with which the public identifies. 2. Playful interfaces can work in academic settings when grounded in clarity and purpose. 3. A good mood board can be a powerful tool to align visual expectations with a client early in the process.
KEY TAKEAWAYS
1. Designing with no brand guidelines can be challenging but it's also an opportunity to shape a project based on a visual language with which the public identifies. 2. Playful interfaces can work in academic settings when grounded in clarity and purpose. 3. A good mood board can be a powerful tool to align visual expectations with a client early in the process.
renata.ao@gmail.com
Renata Oliveira
renata.ao@gmail.com
Renata Oliveira
Hey! Drop me a line ;)
renata.ao@gmail.com









