UI roadmap (2nd pass)

[sturnclaw]

This issue collects future roadmap goals for the UI beyond the initial implementation or port to PiGui. All developers are welcome to add roadmap goals based on mockups or planned work, but please discuss them on IRC first!

See the 1st pass project
Mockup album.
Old mockups.

World View UI

• Make ship information available as subwindow?
• Add more information to planetary situation display (bottom right)
• Comms window for chatting with other ships

FlightUI (reticle)

• Hide option? - (a user asked for it, so it won't be on top of the ship in external view)
• Follow-target / set speed mode selector
• Planetary flight / pitch ladder mode?
• Simplified version for in-cockpit 3d display?
• Add button/options for autopilot orientation holds

Comms Window

• Display message received timestamps
• New unread messages count

Info Screen

• Convert to tabbed windows in WorldView?
• Format for use as 3d UI panels in ship cockpits?

Mission Display

• Orderable, filterable list
• A way to cancel missions

Station Screen

• Mass and TWR data available on all screens

Bulletin Board System

• Ordering and filtering
• Active missions list?
• Cabin data for passenger missions?
• Display chat interface in BBS UI instead of popup

Commodity Market

• Ordering and filtering
• Cargo hold list?
• Commodity mass-per-unit display

Ship Market

• Compare new ship to current ship

Equipment Market

• Equipment details view (power, heat, etc...)
• Store purchased / ship equipment at station
• Equipment loadout presets?
• Move repair functionality to equipment screen?

Sector Map

• Unify layout with mockups
• Alternate star / label coloring (trade price, system economy, etc.)

System Map

• Add "local situation" display of current body with planet heightmap, surface bookmarks, range to target, etc
• Brachistocrone calculator? (deltaV calculator for point-to-point planetary transfer)
• Improve orbit planner interface
  • pick point on orbit for new burn
  • drag handles for delta-V
  • display total delta-V and burn time in map

Issues

• Add Display FPS counter option #4142 - always-on FPS counter
• Text constrast too strong, makes eyes hurt #4140 - expose default text color / contrast to UI accessibility settings?

[bszlrd]

HUD & UI mockups

@Web-eWorks and @Gliese852: I've moved the useful parts of the imgur mockup album along with some descriptions.

Load game window

The color of the box, and the accent on the left indicates the type of save:

• Blue is compatible save, lighter for quicksave and autosave
• Darker, with red accent indicates saves made with previous versions of Pioneer. These could go to the save recovery window, which then would pop a dialog:
  

Docking Aid Reticule

A reticule docking aid mode. Not sure how it should be activated, but I suspect it could be tied to the landing gear and later to the docking collar extension/collar targeting. For landing all data is displayed relative to the ship, and shows as if looking down. For external docking the display is relative to the active docking port. I suspect in that case it would be useful to tie controls relative to the active docking collar to avoid confusion due to collars can be placed in multiple positions and orientations. Likely they would also need docking cameras, and this UI could show only on those cameras for docking.
Features:

• Rotation alignment display: (at the top-right of the explanation image) A blue cross inside the reticule showing the angle of the ship relative to the landing pad/docking collar.
  
  • If it is at the edge of the reticule, it means 45° rotation on the given axis. At the center means the ship aligned to the target.
  • When rotation is larger than 45°, then a small blue cross indicates at the edge of the reticule indicates its direction.
  • When landing on a landing pad, it indicates pitch and roll alignment
  • When docking to an external docking collar, then it indicates pitch and yaw alignment
  • I think the alignments in degrees could be shown in yellow next to where the orientation indicators are already at, but they aren't really necessary:
    
• Pad positioin and orientation: shows the relative position of the landing pad or docking collar. For landing pads, its rotation show yaw alignment, for docking collar it shows roll alignment.
  
  • Size and concentric circles indicate distance to landing pad. Each circle represents 10m (or so) of distance, and ship is at the given distance when the circle is the same size as the reticule circle. When the indicator itself is the same size as the reticule, the ship reached the pad/collar. (calculated from the landing tag)
  • When out of the 45° cone of the reticule, an icon indicates its direction. The icon still shows rotation.
  • The indicator should not be smaller than the icon size when it is at a greater distance.
  • A faint line is projected forward (where the icon also points) to help with orientation.
• Speed indicator: visually represents closing speed with a bar.
  
  • The gauge fills up and down depending on closing speed. (Up and down, so it is visually distinct from the brake distance gauge it replaces in this mode)
  • Only a dot at the center when stationary
  • Fully filled gauge means the upper safe speed
  • It fills up with red from the top and bottom when speed is larger than safety margin
  • Not sure about the safety margin, but my guess would be around 5m/s, and about 20m/s would likely severly damage the collar.
  • There could also be some visual position and speed indicators, but I'm not sure if they worth the clutter (they could look cool though - could be an optional feature, or could be shown in the cockpit on a screen which shows a docking camera)
    
• The Prograde marker could be a bit smaller, and could be connected with the crosshair with a faint line to aid the position alignment process. (I kinda think that the same could be done to the prograde marker in general as an option)
  UI idea for rough alignment:
  
  https://github.com/pioneerspacesim/pioneer/assets/4182678/3918102a-b7ad-4370-81e2-6b4905b5646a

Station landing guides:

guides.mp4

Landing aid

A similar aid for landings, shown on the scanner:

Landing_Aid_Mockup-1.mp4

In-flight orbit display:

Transfer / orbit planner:

Additional HUD panels:

Local and currently experienced gravity display:

Compact/hidden reticule

Compact orbit display and Orbital MFD and other panels:

Additional panels:

Panels for mission list, compact and expanded contact list, target info and hyperspace route:

Equipment market

Newer mockups:

Older mockups

Fuel system

Other mockups:

In-flight orbit display with more elaborate comms and contact list:

Notification and warning style mockups (also, collapsed contact list):

Atmospheric scooping aid:

Scanning HUD:

Orbital map ideas:

Ship overview/engineering:

Cargo hold mockups and ideas

**Jettison:**

Hidden hold:

Jump button on the Sector Map

[fluffyfreak]

🎉❤

[sturnclaw]

Required Icons

CC @bszlrd

Note: with our support for font-based icons, these can either be authored as part of the icons.svg sheet or distributed as a separate ttf font file with glyphs defined in the available subset of the Unicode Private Use Area (U+E000..U+F000). Our icons.svg file is mapped to codepoints U+F000 and following.

• Trash / delete icon (used for jettison as well as editor-context "delete" button)
• General "savefile" icon (see load-game mockup)
• Case-sensitive icon
• "Add" + icon (we currently use targeting crosshair for this)
• "Remove" x icon (we currently use retrograde indicator for this)
• A reset/undo icon (e.g. left-pointing circle with an arrowhead).
• "View Selected Object" icon (currently using maneuver node icon)

Useful Icons

• Save-to-disk icon
• Load-from-disk icon
• Dual arrow major import-export icon for trade computer

Icon Deduplication

These icons are currently aliased to other icons with separate semantic meanings. Ideally they should receive their own icons with visual clarity.

• follow_fill - Currently aliased to the generic planet icon used to draw interaction dots in the world view. One or the other should be made separate IMO.
• equip_fuel_scoop - Currently using the generic fuel-tank icon; this will become confusing once fuel reservoir equipment is added.
• equip_scanner - Currently aliased to the generic satellite-dish scanner icon. Could be split into planet-scan and ship-scan icons?
• ships_no_orbits - Aliased to the generic ship icon, perhaps could be a variant of the ship-with-orbit-line icon with dashed orbit lines?
• filter_ships - Completely unused at current but will be used to filter out ship contacts in a future iteration of sensor/scanning gameplay.
• equip_generic - Aliased to the ecm_advanced icon; should have its own (clearer) icon.
• Deploy and pickup (Box w down n out / up n in)
• Additional generic scanning

[bszlrd]

Added hollow icons too:

Also, I've rescaled the svg so icons are 40px, 1:1 of their intended size (including padding)
icons_40px.zip

Save file, Save, Load, Delete save, Jettisson, Case sensitive

[sturnclaw]

Semi-copied from IRC: black backgrounds in the icon svg file will render as black in-game - icons need to have fully transparent backgrounds / fills. I'm not sure there's much use for the solid fill increase/decrease icons (as we seem to use solid-fill in only a few cases like the time buttons) and would prefer to normalize around the hollow / stroke-only version of those icons.

I like the current stroke weight for use of the increment / decrement icons at small sizes, but at large sizes the stroke weight is a bit too much. I'd therefore recommend a few icons be saved at their current stroke weight, and the stroke weight be decreased for all of the increment/decrement icons. See the attached infographic for details.

[bszlrd]

I've used 3px thick lines, about 33% thinner than before. Used the same thickness for the +-x:

icons_40px_thinner.zip

[sturnclaw]

The new icons are good, but a little too thin in my opinion. The old icons are definitely too thick for the overall size, but the new are quite skinny.

New:

Old:

Additionally, the new remove icon is also a little thin in practice - I'd recommend it's stroke weight be increased - possibly to the stroke weight of the "thick" icons as they'll be used on small buttons in practice:

(The + characters in this image are characters from the pionillium font - ideally our icons are a bit thicker to clearly distinguish them from text elements.)

[bszlrd]

How about this? Fixed the black stuff too.
icons_40px.zip

[bszlrd]

Icons to remove: (from IRC)

[impaktor]