Research

---

What do I want to do?

I want to venture forth into the world of UI/UX design, specifically within the games industry. This is quite a broad term, but in short, it is the process of deciding how an interface looks and functions. All the buttons and text you see in any app or website is a result of meticulous thought and intention behind it. It’s not just making something look pretty, but making something people understand.

A UI Designer is a large encompassing role, which can be applied in many areas. It could be for a website, a mobile app, a video game even.

What do you do as a UI Designer?

The simplest definition of a UI Designer’s job is to decide what goes where. You don’t just make nice looking buttons, you decide where those buttons go, and what they do.

What is the difference between UI and UX?

UI and UX are often used interchangeably, but they are in fact different roles with different principles.

User Interface is the interactivity of something a user will interface with. The look and feel, if you will. User Experience is the overall experience a user will have when using an interface. How many buttons do you click? Where does this tab lead to?

“Effective user interface design brings together usability and interactive design to build an emotive connection between users and products” –  

Hugo Raymond, Designer Advocate at Figma

What software is used?

UI Designers have quite a large selection of software in their arsenal, with varying levels of pricing.

The most popular tool in this space is Figma. It’s a web based design tool that’s really capable. They have multiple sub-apps under their umbrella, like FigJam for brainstorming and Figma Slides for presentations. But their crown jewel is Figma Design.

Figma Design contains three main modes. Design Mode is where you actually make your interface, with tools like a vector editor and advanced typography controls. Prototype Mode lets you link frames together to create a demo for your interface’s flow. Dev Mode then lets you take those mockups, and start implementing them into a codebase.

Other alternatives used in the industry are the Adobe suite, as well as the likes of Affinity and Sketch.

Many design roles also require additional technical skills. Some require HTML/CSS/JS knowledge, to help implement the design. Some require knowledge in analytics tools, to measure user behaviour, or experience in CMS tools like WordPress (where the very thing you’re reading is managed on).

Where might a UX Designer be needed?

When you think of a UX Designer, you probably think of apps or websites. But the role is much broader than it may seem. Anything from the buttons on a vending machine to the HUD in your favourite game has meticulous thought put behind each interaction.

How much would you earn as a UI Designer?

In the UK, the average UX designer earns a yearly salary of £46,410, according to Indeed.

That figure does vary depending on your skill level. Entry level roles come closer to £30k, while more senior roles go more towards £50k. Salaries are also typically higher if located in London, but expenses are also high there, outweighing that boost.

Many of these roles are Hybrid, meaning a mix of in-person and remote work. This does mean I’d need to move away for certain roles. Some roles are permanently on-site, while others are fully remote.

If you’re working Freelance, you’re more likely to work on an hourly rate instead. Many will offer an hourly rate of about $30 USD (£22) an hour.

What’s the typical workflow of a UX Designer?

The workflow of a UX Designer is more like a loop. You start by gathering research on your user’s behaviour. You find a spot that could be improved. You then come up with ideas on how to improve it. You then go and make a more refined prototype, with wire-framing and then 1:1 mockups. You prototype that solution with a subset of users. If all goes well, that gets handed off to the devs to implement those changes.

UX Design in the Games Industry

An interface is not just an app or a website, it anything that’s intractable. That includes video games. Let’s take a look at some notable examples of strong video game UIs.

HUD – EA Sports

A HUD, or Heads Up Display, is crucial in any video game. It gives the player important context, and tips on how to perform certain actions. It also can’t get in the way of gameplay, however. It’s a fine balance. The EA Sports umbrella of games achieve that well, utilising simple fonts, transparent shapes and a neutral colour palette to deliver a clear HUD that informs the player, whilst not getting in the way of gameplay.

Menus – Forza Horizon

Menus throughout any game need to achieve a number of things. To stop gameplay, and to provide areas of the game otherwise not available. It needs to be clear how to navigate this interface, where each option lives, and what they do. They need to prioritise visual hierarchy.

Forza Horizon has been a bastion of good menu design across many releases now, with a paginated, tiled design. Larger tiles are given to more commonly accessed functions, like the world map. Options are categorised into tabs, clearly filtering out DLC, Online and Campaign options.

AAA Game Studios

Most of your favourite AAA game studios have dedicated UI design teams, who work closely with the programming team to ensure a seamless experience for players. They often prototype their interfaces in Figma before implementing into the engine, often proprietary.

What parallels are there between Game UX and other types of UX?

Interfaces, no matter the implementation, share many common traits and mindsets. The onboarding process is like a tutorial in a game. Navigation is just like inputs on a controller. The same decision making process behind positioning a button or menu are the same, whether tapped on a phone or pressed with a controller.

How do you become a UX Designer?

There are many entry routes into this industry. Here are a few examples:

University

Many universities offer Games Design and Interaction Design courses, which are a great way to level up skills and create new opportunities.

Apprenticeships

If you can find the right employer, an apprenticeship is a great route to go down. They can give you real world experience in the field, and you still get paid as a regular employee.

Freelance

Going down the freelance route is a great option. You work on your own schedule, anywhere in the world. You work with clients directly, through platforms like Upwork and Fiverr. You can then show off that work in a portfolio, typically in the form of a website, which can attract new clients and even potential employers.

Full time employment

Once you rise up the ranks, you could catch the attention of larger companies. They offer attractive salaries, long term job security and valuable experience. There are manys way to get here, whether from from a freelance stint, rising from an apprenticeship to a full time role, or even an offer after graduation.

---

Planning

Brief

This project is a speculative portfolio piece, in which I create a piece for Samsung’s One UI mobile interface. While not a game UI as per se, it will demonstrate transferrable UX principles that studios require.

I have to redesign the entire set-up flow, from first boot to you landing on the home screen. This will involve steps like setting up Wi-Fi, logging into your Google and Samsung accounts, and setting some options.

What do I need to consider?

We have a few things to take into account for this project.

Adaptability

This interface has to scale correctly across a large number of screen sizes. From small phone screens, large tablets, and everything in between. We have to design in a way that dynamically adapts the UI to make efficient use of the screen.

Accessibility

This is an interface all users will come across at some point. This means we have to design this in an accessible way. I have to follow industry standards on colour, placement and naming.

Design guidelines

This interface will be many people’s first interaction with their new Galaxy device. So it has to represent the brand correctly. I’ll have to follow One UI’s design guidelines, including using appropriate colour tokens, typography, iconography and layout rules.

Software and resources

In order to complete this project, I’ll need some tools and resources to help me along the way.

I’ll be completing this project in Figma, as it has all the features I need for designing and prototyping an interface.

I’ll also be using the One UI Design Kit, a Figma resource I created that contains everything from colours, elements and icons that follow Samsung’s design system.

On top of that, I will be using official resources too. Samsung has official guidelines on the One UI design language. This not only contains core principals on One UI itself, but also provides guidelines for designing for foldables and tablets.

What’s the current flow look like?

First, we need to establish the order in which these pages appear. I don’t fancy resetting my phone to get raw screenshots, but thankfully sakitech recorded the setup flow when picking up his Galaxy S25 Ultra. So we’ll use his footage as a reference.

Here is the same order in the form of a flowchart.

What’s the new flow going to look like?

Here is the order in which each these new screens will appear.

I’ve made some notable differences between the two. I aim to reduce duplicate screens, like Samsung transfer or Google transfer. I also want to consolidate both the Gemini and Bixby setups to a single “Device Assistant” screen, where you choose your preferred assistant. Finally, I want to surface the choice of navigation types, three button or swipe gestures.

Wire-framing

I wanted to get a good visual idea of the positioning of the elements, where they’d go, so I created a wireframe. This is an industry standard technique that helps visualise your ideas to clients before you move on to high resolution mockups.

Health and Safety

While this is seemingly unrelated subject for this project, making sure I’m not overworking myself is important.

I keep my work environment ergonomic, with supportive seating and comfortable typing. I take regular breaks from work, following the 20:20 rule – Stare at something 20 feet away for 20 seconds, This helps reduce eye strain.

Organisation

I like to keep my projects organised, with a consistent naming structure. I store my project file within Figma’s cloud, so I can access it on all my devices. The work within is sorted into pages, for planning and for production. I sort everything into Sections, and then title nested frames in Sentence case – a capitalised first letter followed by lower case for all subsequent words.

Production Schedule

When it comes to scheduling the various tasks involved in a project, I like to use Notion. This lets me put all my ideas in one place, and organise them based on priority and progress. So I know if there’s something important that needs doing asap. This allows my work to be flexible, assessed constantly, based on the client’s needs.

---

Production

I created a blank Figma file, added two pages, and imported the One UI Design Kit for the icons and components we’ll need.

I then imported a few of the components I will need. The important ones are Headers and Cards, which are super flexible components that can adapt in numerous ways. We might need to make some custom components in certain areas, but the aim is to use as many of these components as possible, to adhere to the design system.

I then made a device frame, based around the scale of a standard Samsung Galaxy S series device.

I then set up a simple Auto-Layout setup, keeping the status bar and navigation separate and the page’s content contained within its own auto-layout enabled frame. This ensures responsive design.

This looks pretty basic though, right? We need a hero image. Let’s use a One UI style update banner, discovered in previous One UI 8.5 leaks.

Add quote block here – https://x.com/thatjoshguy69/status/1974510283914695127?s=20

Let’s use that, change the colours slightly, and have a pretty good looking welcome screen.

Now to a more boring page, but one where the fundamentals are made. I used a header, and a few cards, and a custom button design for the back and next buttons.

I won’t go over each and every page, so let’s fast forward until all the pages are finished.

I then wired up each page with Figma’s Prototype tools. This lets me preview the layout directly on my phone. Here’s what that looks like:

What did I change compared to the original?

Throughout this project, accessibility was paramount. I ensures tap targets were large, colour contrast aligned with industry standards, and elements were clearly labelled.

Try it out

You can even try it yourself with this interactive prototype. Best experienced in full screen.

---

Log

Week 1

This week changed how I view interface design. Initially, I approached the OOBE as a visual problem. How can I make it look better?

However, researching UX workflows and analysing examples like Forza Horizon’s menus made me realise the importance of hierarchy and cognitive load. I began identifying friction points in Samsung’s current setup flow, particularly duplication and inconsistent visual language. This week shifted my thinking to lean towards user journey optimisation.

Week 2

Creating the revised flow exposed how complex even simple setup processes are. Mapping each screen forced me to justify why it exists. I realised some pages were redundant and could be consolidated. This stage reinforced the importance of planning before jumping into high-fidelity mockups. It mirrors real industry practice where UX designers validate flows before committing development resources.

Week 3

Moving into high-fidelity design tested my ability to follow a design system. Using the One UI Design Kit required discipline. I couldn’t just design freely. I had to work within brand constraints, which reflects real studio environments. I also began to see how component reuse increases efficiency and consistency. This week strengthened my understanding of scalable design.

Week 4

Prototyping revealed usability issues I hadn’t noticed in static designs. Certain button placements felt unnatural when interacted with on a phone. This stage reinforced the iterative nature of UX. No design is perfect on the first pass. It also highlighted the importance of testing before implementation, something essential in professional environments, where development time is expensive.

---

Conclusion

This project significantly changed how I perceive UI/UX design as a career. At the beginning, I viewed interface design primarily as a visual discipline, simply arranging buttons and making layouts look appealing. Through research into industry workflows and analysing professional examples from games and mobile interfaces, I realised that UX design is fundamentally about problem-solving and behavioural understanding.

Researching entry routes into the industry also broadened my perspective. I initially believed university was the only viable path, but exploring freelance and apprenticeship routes showed that portfolio quality and practical experience often outweigh formal qualifications. This reinforced the importance of producing work to professional standards, rather than simply completing an assignment.

This project helped me understand that UI design within games is not isolated from development. It must integrate with engine systems, gameplay logic, and performance constraints, reinforcing the importance of structured planning before production.

Analysing various designs helped me understand visual hierarchy and cognitive load. I began applying those principles to my redesign, focusing on reducing duplicate screens and consolidating choices to streamline the user journey. My thinking shifted from “What looks better?” to “What removes friction?”

One of the most valuable lessons from this project was the importance of planning. Creating flowcharts and wireframes before high-fidelity mockups prevented unnecessary redesign later. This mirrors industry practice, where validating structure early reduces development cost.

If I were to improve this project further, I would conduct real usability testing with participants unfamiliar with Samsung devices. This would provide measurable data to support design decisions rather than relying solely on personal judgement.

Overall, this project only increased my interest in UI/UX design. It demonstrated that the role requires both creativity and analytical thinking, something I enjoy balancing. It also highlighted the responsibility UX designers have in shaping everyday digital experiences. I now better understand the professional standards expected in the industry and feel more prepared to continue developing towards this career path.

---

Bibliography

1. Figma. (2025). UI vs UX: What’s the Difference between UI & UX Design? | Figma. [online] Available at: https://www.figma.com/resource-library/difference-between-ui-and-ux.
2. ‌Indeed.com. (2024). User experience designer salary in United Kingdom. [online] Available at: https://uk.indeed.com/career/user-experience-designer/salaries.
3. ‌GeeksforGeeks (2023). Understanding the UI/UX Workflow. [online] GeeksforGeeks. Available at: https://www.geeksforgeeks.org/websites-apps/understanding-the-ui-ux-workflow/ [Accessed 23 Jan. 2026].
4. ‌Samsung Developer. (n.d.). One UI | Samsung Developers. [online] Available at: https://developer.samsung.com/one-ui.
5. ‌Youtu.be. (2026). Available at: https://youtu.be/_Dw13gxzWxs?t=219 [Accessed 26 Jan. 2026].