New UI Preview

[sviridovt]

The New UI is now available for public preview! This is one of the many things I'm currently working on a lot of which rely around improving the experience and making the sim more mobile friendly while (hopefully) making the sim look a little nicer. I am looking to find ways to improve the sim experience and navigation so would be happy to hear feedback about the new UI and any other suggestions!

As part of this change I'm also introducing the airline widget/avatar, which at present is just the first 50px of your airline logo but I'm looking into if I want to allow uploading it separately if there is interest. 

Not currently available but one of the changes I'm working on is a change to simplify navigating the website, namely aggregating all of the aircraft related functions (purchasing, maintenance, fleet management) into a Fleet page, all the flight related functions into a Flights page and all the facilities functions into a Facilities page. That way the the overall navigation will be simplified to 4 categories: 

• Dashboard
• My Airline
  • Airline page/configuration
  • Fleet page for aircraft operations/maintenance
  • Flights page for flight operations
  • Infrastructure page for facilities operations
  • Finances page
• World
  • World Rankings
  • Airports Browser 
• Alliances

 

In addition to the new look this interface is designed to be mobile friendly (though fair warning that part is very much still in development and is still very buggy). One of my main priorities with the above redesign is to redesign from scratch the parts of the sim that are the most mobile unfriendly currently (seat configuration and scheduler) as well as make them better. 

 

How Do I Opt In?

In the sim under your airline navigation menu you should see the "try the new UI button" this will enroll you in the preview. If you sont see the button you might need to expand the navigation menu. 

 

If you then wish to opt out you may do so from your profile menu 

[Air Australia]

Exciting stuff :)

[AVGEEK]

The new UI looks really good. Can’t wait for it to be finished 😃 

[IllNoLimitsllI]

Looks really great! I am currently programming my first website so i know just how much work this is! must have taken you weeks up to this point!

Are you using css grid or flexbox?

One thing I noticed so far: the tab "finances" is missing from the new UI. 

 

 

[sviridovt]

9 hours ago, IllNoLimitsllI said:

Looks really great! I am currently programming my first website so i know just how much work this is! must have taken you weeks up to this point!

Are you using css grid or flexbox?

One thing I noticed so far: the tab "finances" is missing from the new UI. 

 

 

Thanks and best of luck with your website! It has taken a while especially as I'm doing this on the side. It's mostly flexboxes, the entire new UI is build on top of a React component library I created on top of ShadCN which itself is built on top of Radix with heavy use of TailwindsCSS. There is some custom CSS but I've mostly tried to steer clear with front-end not being my strongest area. The long term plan with this is to completely sever the front and the back end with the front-end utilizing React Native to allow it to be made into an app as well. Though this is def a long term plan with how little time I actually have to work on the sim.

 

Also thanks for pointing out about finances, I merged in the fix and it should be deployed soon (my home server internet is having some issues right now, so it's taking its time deploying). 

[IllNoLimitsllI]

That sounds fascinating! Definitely way more complex than my HTML/CSS Website with only a few lines of JS! 🙂 I'm the other way round. I am currently learning Frontend and have close to zero knowledge about the backend. (I juse Wordpress for that). I heard about ReactJS and TailwindCSS, the ShadCN and Radix are however completely new to me, so thanks for the tipps!!

Now worries! Finances are there already 👍

[sviridovt]

15 hours ago, IllNoLimitsllI said:

That sounds fascinating! Definitely way more complex than my HTML/CSS Website with only a few lines of JS! 🙂 I'm the other way round. I am currently learning Frontend and have close to zero knowledge about the backend. (I juse Wordpress for that). I heard about ReactJS and TailwindCSS, the ShadCN and Radix are however completely new to me, so thanks for the tipps!!

Now worries! Finances are there already 👍

I mean, it's all abstractions for the most part, the core is still HTML/CSS/JS just written in a more productionized/sustainable way both to make development as well as long term maintainability easier. Hypothetically speaking, since I'm not using a Node runtime (at least until I get to completely sever the front/backend) you could write the whole thing in a vanilla stack, that's what it gets compiled to and you can even see it's output! (Note that link will likely not work when I make a new release, you'll notice there is a hash on the file name which will change on a new release to ensure you don't use the old cached version after a new version comes out). Front-end code is interesting that way since all code compiles to vanilla Javascript that your browser can understand (with the still relatively rare exception of Web Assembly, though it has not caught on for many reasons).

Regardless, as a new dev you're doing the right thing, learning the basics. You could always add layers of abstractions later to make yourself more efficient, but understanding how things work 'under the hood' is one of the most valuable skill sets and IMO what separates the great from the wanna-be.