top of page
SCOTT MEEKIN
SCOTT MEEKIN
UI Design
Bean Arena
Bean Arena is a Split Screen Co-op 3rd person shooter. It is 1v1 arena shooter featuring candy weapons and arenas. This was a project made for my Major Project moduel in Final Year.
I worked along side Jamie Braniff, and my roles for this project are UI/UX Designer, and level designer.
The UI elements that I created are the HUD, Settings, Controls, Select Arena, How to play, credits and the main menu. All of these menus were created in Figma and then implemented into Unreal Engine 5.6.
UI
Figma/Unreal Engine
Date
September 2025 - May 2026
UI Showreel
Roles & Responsability
UI/ux design
*Key Software used Unreal Engine ver 5.6/ Figma/After Effects*
I worked on Bean Arena as a UI/UX Designer & Level Designer during development.
My Responsibilities and Contributions on this project:
-
Research User Interface and translate into achievable UI/UX goals.
-
Develop Flow Diagrams, Post it investigations and SCAMPS.
-
Design and iterate Low and High fidelity Wireframes based on feedback.
-
High quality designs when developing.
-
Intuitive colour schemes
-
A Interactive Prototype within Figma
-
Implement UI into Unreal Engine.
-
Create slime dripping animations
-
Slime transition between menus
Pre-Production
I gathered images of other 3rd Person Shooter games to get a general idea for the cartoony/candy look and feel for Bean Arena. I looked at other Shooter games like Plants Vs Zombies: Garden Warfare, Fortnite and Slime Rancher to help me gather ideas of how information is gathered in a visual way during gameplay for the HUD. I also looked at other games like Fall Guys and Crash Bandicoot 4: It's About Time for the layout of the menus
SCAMPS!
I then designed some scamps to help me with the layout of a 3rd Person Action game. This helped me when making the UI elements.
flow diagrams
User flow diagrams visualising all HUD/UI element that the player would interact with. Allowed me to keep track of Key features and UI needs.
Low Fidelity Wireframes
Polished High Fidelity Wireframes
Finalized UI In Unreal Engine
Poster
As part of this module I had to make a poster for the End of year show for final years which takes place on the 4th & 5th of June 2026. I was able to create this poster in Photoshop and I used Unreal Engine renders, a svg logo from Figma and the background also was made in Figma. This is the result:
bottom of page