Announcing CfxUI 2022 - our next generation user interface

Hi everyone :wave:

After tireless work from our frontend development team, we are very happy to finally introduce our newest user interface iteration to everyone starting today.

Key targets

In 2020 we launched a complete refresh of our design language. This year we set out to improve on that work and fix many of its shortcomings. In the process, the design language has received some major updates as well. Our objectives were clear:

  • Drastically improve performance
  • Increase modularity and extensibility
  • Create a better user experience for everyone

What’s new

CfxUI Framework

We’ve built our UI framework including both a well-defined design system and a solid components library to serve us not only in the in-game UI but for all of our applications.

This framework started as a components library for our Cfx.re Development Kit, also known as FxDK, but has now matured into a full-fledged framework for building not only in-game UI, but also the web version of our servers list for FiveM and RedM (they will be updated soon!).

Using industry-leading tools such as React and MobX allowed us to make the framework fast and responsive, not only for end-users but also for our developers.

Home screen

We’ve iterated through a dozen of home screen layout and design iterations, starting with very radical changes to its layout in pursuit to make it both better for players and more appealing for server owners, but after receiving a lot of feedback from our most active users, decided that it was way too radical and eventually came up with only one big change.

The layout of the home screen has been kept the same, same familiar “Play” button and other navigation elements, but instead of always showing just one top region server, we’re now showing 10 of them.

We believe this change benefits both our players, giving them more immediate choices, and server owners that were previously struggling to get attention from players.

Servers list screen

While preserving the same familiar look, it is now lightning fast and responsive when it comes down to filtering and/or sorting the list, thanks to offloading these tasks to a background process.

We’ve also added a cheat sheet of what is possible when searching for servers.

The “Direct Connect” functionality of the search bar has been reworked: type > followed by the server IP address or join link, and the UI will react immediately. This functions the same as connect <ip>!

Server details screen

The server details screen has been reworked to allow for more room to display important server information such as the DLC it is running on, current Pure Level, game mode name, map name, and other server-defined information.

Feedback, questions, and bug reports

Your feedback is important! As with every big update, we’re happy to hear about your input. Did you find any bugs? Perhaps you have an idea that would make the UI even better? Don’t hesitate to let us know.

We hope you enjoy the new UI as much as we do!

25 Likes

it keeps crashing me :frowning: im using windows 11 OS
image

1 Like

image
While it was on dev mode, it had the same problem
Now, when its to everybody, it destroyed our car plates,
any way to fix that?

Is anyone getting “Early exit trap error” message when loading into a city?

tbh i thought the new UI gives an opportunity to get a fresh new look.
But over the past weeks / months the new design more and more became the Old one but with a new look (in terms of positioning etc).

I think one of the early designs looked the best but it was yeeted for no obvious reason.

And “Top Servers” should be replaced by some sort of “Server History” where it scrolls through the servers you visited in the past. Because “Top Servers” is sorted by “who pays the most” and not by actual top/good Servers

6 Likes

Yes fatal error. A few people who are in the server also have this issue

1 Like

This is beautiful! Well done to the team.

Good Work! <3

Hello, do you have a date for release new build RedM ?
Thanks, and good feature UI <3

Some old (invalid) code people often shared to replace license plates doesn’t work anymore as a result of the CEF update, doing it properly like this resource did still works though: [FREE] Custom License Plates and Patterns

This should be fixed now, some users ended up with ‘broken’ server history entries saved and this issue wasn’t caught before.

1 Like

Major props to the frontend devs that worked on it.
I really liked this new design! It looks fresh and unique.

Also I think it deserves special praise simply for the fact that it doesn’t suck like most FPS shooter menus.
What is up with this industry always having the most (good looking but) awful user experiences?!
The last two games I tried were BF2042 and COD:mw2… both have shitty user flow with a bunch of steps and unintuitive buttons. Rant over.

Thanks again for the new CfxUI :yellow_heart:

2 Likes

I mean do you expect something good from either of those dev studios putting out the same hot garbage every year.

Got extremly texture loss after the update…

1 Like

Amazing!

private server does not work, you cannot start the game, that option is only there when the server is not private

This is amazing but can you guys make it so I can connect to my FiveM Single Player mod without having to do localGame ModName please :slight_smile: <3 Overall loving the new UI!

Yep, using direct connect with the “connect IP:port” works, but is annoying as players can’t connect by choosing the server in their favorites or history.

2 Likes

My vram was 6100 out of 6200 after the update it said 9000 out of 6200

2 Likes

When I launch FiveM it gets stuck in the download phase with about 20% complete then stays there. Is their a fix out for this yet or no?

Love the new UI! But since the update like everyone else, I have been experiencing texture loss. Can’t even enjoy the servers I usually visit.

1 Like