Making More Space Available in UX Screen


Is it possible to make better use of the space available in the UX screens? I started to mock up a wizard, but I only get one row of data when it is presented on a projector (1280 * 800) (there’s about twenty rows). I do need the main steps and sub steps.

I also get an issue that when I scroll down, I don’t get any other lines, just a blank page.


Hi @R.B,

Not many computers have a resolution that low these days. You should change the Zoom in the browser to 70% or 80% to get more screen real estate.

I agree to Tim’s comment about the screen resolution. Apart from that you can show and hide a lot of UI elements via the advanced options. This is kind of the maximum that you could hide (to be set on “New View”) You have to decide what is essential for the user to see or how you structure the wizard:
“appbarEnabled”: false,
“toolbarEnabled”: false,
“filterbarEnabled”: false,
“wizard”: {
“hideHeader”: true

Even when the projector isn’t being used, a lot of space is taken up being blank (1920 * 1080).

We need the wizard header, but can the number be next to the text?
Can the amount of space below the wizard header be reduced?
Can the amount of space below the wizard buttons be reduced?
Can the title of the wizard be removed or moved to the either the appbar or next to the application name at the top of the screen or to the left of the wizard steps?

I appreciate that the app bar may get wider with more apps, but there seems to be a lot of space that is wasted elsewhere on the screen.


As mentioned in my previous post you can already configure a lot of things to be completely hidden to save space. We might fine-tune a few things in terms of the design but we do not plan to do major changes in the design. We have chosen to use the PatternFly template as it is because it works reliably, looks consistent and is also responsive, i.e. the wizard for instance will also look decent on mobile devices etc. You could if you really want to change/overwrite CSS to achieve something like that in a particular project. One thing that is on our roadmap is to have a “fullscreen” or “presentation” mode to hide everything but the widget/view you are working in.