Airframe Config Usability

[DonLakeFlyer]

QGroundControl - Airframe Setup.pdf

We can discuss this document below and adjust as needed.

[LorenzMeier]

We need these icons for PX4 (APM will use a subset):

Unknown: We need an icon for cases where we don't have a proper icon yet.

Multirotors: Quadrotor, Hexrotor, Octarotor: In X and + orientation (one arm to the front vs two arms symmetrical to the front). Preferably all in similar style with similar rotors (two blades).

Planes:

• Standard plane: https://store.3drobotics.com/products/3DR-Aero
• Flying Wing: https://pixhawk.org/platforms/planes/z-84_wing_wing
• Inverted V-Tail (Albatross): http://appliedaeronautics.com/Albatross-Airframe-MAX_p_1.html

Vertical takeoff and landing: https://pixhawk.org/platforms/vtol/start#aircraft

• Tailsitter (Duorotor): https://pixhawk.org/platforms/vtol/tbs_caipirinha_vtol
• Tailsitter (Quadrotor): http://transition-robotics.com/collections/quadshots/products/the-mocha
• Tiltrotor (Firefly Y6): https://pixhawk.org/platforms/vtol/birdseyeview_firefly
• Standard VTOL: https://pixhawk.org/platforms/vtol/fun_cub_quad_vtol

Rover: Simple vehicle with four wheels http://www.hobbyking.com/hobbyking/store/__39020__1_10_Quanum_Skull_Crusher_2WD_Brushless_Monster_Truck_ARR_EU_Warehouse_.html

Boat: Simple surface RC boat http://www.hobbyking.com/hobbyking/store/__69214__FT009_High_Speed_V_Hull_Racing_Boat_460mm_Green_RTR_.html

[dogmaphobic]

And axial multirotors:

For graphics, when applicable, the best would be vector files. I work with Illustrator but SVG files work just fine too.

One thing that should be brought up is the need for two color palettes. One for "Outside" (black text over white background) and another for "Inside" (white text over black background).

[DonLakeFlyer]

We need these icons for PX4 (APM will use a subset):

@LorenzMeier The current icon set shows prop rotation using colors, and tiny little arrows. Do you want to lose that visualization or keep it?

[DonLakeFlyer]

Some general UI information as a starting point:

The current UI uses a standard color and font palette. There are three fonts: default, small and large. Small is smaller than default, and large is larger than default. The color palette has a light and dark style variation which users can change from settings. The tablet defaults to light palette, desktop defaults to dark palette. The light palette is tuned for outside use in the sun, the dark palette is meant for inside use. If you run a debug build you can bring up a pallete inspector from Widgets/Test Qml palette and controls menu item to see the available entires and color choices as well as example usage in controls.

[Update] Forgot to saythat that in the color dialog you can click the color blocks and it will bring up a color picker so you can try out different palette color and see their affects.

The fact that the user can switch palettes affects the icons in the product. They need to work well in both palette styles. This can be done in multiple ways: 1) A single image that works fine in both palettes. Vector graphics (svg) preferred in this case. 2) A different image for each palette style. Vector graphics preferred in this case. 3) A png file with a white foreground and transparent background. This is then colored appropriately for the palette.

An example of type 3 is used for the setup button images. Here is what they look like in light/dark style as well as red indicator coloring:

[dogmaphobic]

The current icon set shows prop rotation using colors, and tiny little arrows. Do you want to lose that visualization or keep it?

The existing arrows are way too small to be able to see. There should be a way to select a vehicle and bring up a larger version of the image exactly so we can see how to setup the motor/propeller direction and sequence.

[DonLakeFlyer]

More general UI information as a starting point:

The concept of a slide out dialog is used as a standard UI element across the product. These dialogs slide out from the right side of the window and take the full vertical real esate. The reason for this is that vertical real estate is at a premium on tablet so you want to use space at the right and left edges for larger overlays as much as possible. I think this concept works well and at this point we should work within the bounds of what it provides instead of making a new mechanism.

Here are some example usage beyond airframe config:

Parameter Editor

Compass Configuration

[DonLakeFlyer]

More general UI information:

The area at the bottom of the window is currently reserved for display of critical messages to the user. Majority of these come from the vehicle itself. These can pop up at any time. So unless that concept is reworked you can't put other things in this space that the user will need to interact with. Here is an example of what it looks like:

[DonLakeFlyer]

The existing arrows are way too small to be able to see. There should be a way to select a vehicle and bring up a larger version of the image exactly so we can see how to setup the motor/propeller direction and sequence.

I agree. Just making sure everyone knows what could be lost without additional feature work.

[DonLakeFlyer]

We need these icons for PX4 (APM will use a subset):

APM isn't quite a subset. They have additional which PX4 does not have:

H Frame quad

V Tail quad

A Tail quad I can't find an image for an A Tail but I think it just an inverted V tail?

[LorenzMeier]

We got all of these as well.

[DonLakeFlyer]

Comments on doc: Page 7: We previously had titles like "Airframe" on each setup page. We specifically removed them because we need to be very mindful of real estate of tablet. They just took up too much space and caused things to scroll off the bottom for the tablet. In general I'd agree with having a Title but I don't think we have the real estate for it. Page 8: Having an overlay at the bottom of the screen for Apply and Restart won't work because it will overlap the critical message area. Push buttons controls have two colors, normal and primary. We could switch the Apply/Restart button to primary color to indicate you must push it if you make a change. Page 9: This dialog should be a slide out side dialog. I'll change the wording to match yours. With the new AutoConnect functionality there is no need to manually re-connectv though after reboot. It will happen automatically.

The remainder of the changes look good. Big thanks. I'll update the app to match the spec in those areas.

[DonLakeFlyer]

Another issue for PX4 Stack is that I think there are too many boxes. For example there are three Hexarotor top level items: Hexarotor +, Hexarotor Coaxial and Hexarotor x. Each one of these top level items only has a single item in the dropdown. That's a lot of prime real estate for just three settings. I think some of these should be collapsed down. In this case a single Hexarotor top level item with the three types in the dropdown would be a much better use of real estate. There are other's similar to this.

[LorenzMeier]

PX4 doesn't have too many boxes - the issue is that QGC is lacking proper support for further meta data. We should come back to the root cause: When a user selects an airframe he needs to know how to wire it. That info should be immediately linked to that step.

[LorenzMeier]

Here ist an example how we could fix this:

[DonLakeFlyer]

Here ist an example how we could fix this:

That's a somewhat different thing. I think that deserves a complete redesign. Could you detail out everything that needs to be in that right pane? No pictures needed just information for now.

Let me try the detail it out:

• Random text fields, some may link to web site or email
• Maybe an icon for branding
• Pixhawk connections: RC, SB, Main 1-8, Aux 1-6
• Enough motor and frame information for QGC to automatically draw a picture like this based on frame type:

Assuming QGC can generate the picture above then it should also be able to use this in any sort of frame picker ui like the current airframe config.

[DonLakeFlyer]

I'll see what I can do with the existing meta data. Never realized that was all in there.

[LorenzMeier]

Its not yet in for all frames, but there are a couple which are complete. Adding more fields would not be hard.

[cfelipesouza]

I've been doing the icon family for PX4, as requested by @LorenzMeier, maintaining the same style as used today. I would like to share to receive some feedback, because I have doubts about the rotation and numeration of the rotors. Do you guys have this information to help me?

Feel free to comment about the drawing and, if I missed something or did something wrong, tell me than I can correct asap.

In the future (not so far), our ideia is to redesign all the icon family, using another visual style.

Note that I'm only referring to the icons. The others parts commented here about UI we are currently working on to develop a new approach and we are going to answer soon.

[LorenzMeier]

@cfelipesouza Would you prefer to move the new icon style immediately? Do you have an example?

[biapalmeiro]

@LorenzMeier If it's not a problem to you, I prefer to start improving some usability issues then move to redesign the UI. What do you think? BTW, if @cfelipesouza has an example to send you, I don't think it's a big problem too.

[LorenzMeier]

I'm perfectly fine going with these, they look great! I just don't want to imply that we're in any way clinging on to the current visual style. We want it to be awesome!

[LorenzMeier]

Can you put the SVG files somewhere so we can download them?

[cfelipesouza]

@LorenzMeier , I'm working on the new style. I've made some tests but I don't have a finished example. For now, I prefer to move with the current style.

To be awesome (I want it to!) I would like to give more efforts and time on this, discussing some points before presenting something new. For example: arrows, are they necessary or can I explain the rotor sense using only colors? Is 2D the best way? Comparing with other GCS, what do you guys like and dislike in the current icons? What do you think about this flow?

I'm preparing the SVG package, but do they are all correct?

[LorenzMeier]

Sorry, I skipped over that part. I need a little more time to review all of them. In general the rotation direction is pretty small and not well visible. Should we remove the arrows and add a legend with turn direction arrows? Do you see another method?

[dogmaphobic]

In general the rotation direction is pretty small and not well visible.

Don and I were talking about this the other day. Unless you make the arrow huge, there is no practical way to expect you will be able to determine proper direction from this icon. It makes more sense for the icon to be only representative of the vehicle (and not much else). Once you select a vehicle, a larger dialog would come up showing a better view, with not only proper rotation direction but also motor sequence numbers (and any other pertinent info).

[cfelipesouza]

I did some research and I noticed that, ~normally~, green is for CW and blue for CCW in many others GCS's. Maybe this could be a pattern and arrows and legend aren't needed. Maybe. I will do some tests about arrows and reduction and maybe I can find a way to maintain them well visible. But the big problem for me are the rotor numbers. I do agree with @dogmaphobic: a larger dialog or something like that could be a way to showing a better view. Our group will discuss it to come up with a solution too.

[biapalmeiro]

@DonLakeFlyer , @LorenzMeier We are working on the other aspects you discussed here, probably in the beginning of the next week we will send you an update. Thanks a lot!

[biapalmeiro]

@DonLakeFlyer , @LorenzMeier , @tcanabrava told us you have concerns about the APM airframe setup. Could you tell us more details about it?

[biapalmeiro]

QGroundControl - Airframe Setup - vs1.1.pdf

Guys, I've attached the updated wireframe according to our discussions here.

We have some questions about this issue:

1) About the PX4 icons:

• we are not sure about what Simulation and Tricopter Y- are.
• could you check the numbers and the correct rotation for us, please?

2) About the rotation arrows:

• is this information really useful at this screen? Maybe we can show it in a proper step in the setup flow.

3) About critical messages:

• in a first moment, it doesn't look a proper place for this kind of information, but we need a bigger understand about the entire UI to redesign that. We will work on that soon.

4) About APM icons:

• @cfelipesouza are doing the icons you've mentioned. Are there any more?

5) About titles for each screen:

• We believe we have more earnings than losses keeping the titles. It can help new or non-power users to know where they are in the UI. It doesn't use lots of pixels, we can do some trials on mobile devices to see how it fit better. What do you think?

6) We are not sure if group airframes are the best solution for this screen. Maybe just positioning the airframes in a proper order can help the users.

7) @LorenzMeier We didn't understand your scratch. Could you explain better, please?

[cfelipesouza]

I've done the APM icon family. Here I also need help, review and feedback about the rotors. If I missed something, just let me know.

[LorenzMeier]

We have some questions about this issue:

1) About the PX4 icons:

we are not sure about what Simulation and Tricopter Y- are. could you check the numbers and the correct rotation for us, please?

Y- is a tricopter with opposite rotation direction. I think I will fold them both into the Tricopter category though, so no need for a 2nd airframe.

Simulation is difficult: The easiest would be to combine three of the airframes into a single icon, e.g. a quad, a plane and a VTOL grouped together. Or if that's too tight you could use a standard plane and different colors to indicate a difference.

2) About the rotation arrows:

is this information really useful at this screen? Maybe we can show it in a proper step in the setup flow.

I would propose to remove the icons and only keep the colors. Do you see a way to add a legend (global, not per icon) for blue and green to people can look it up in the legend?

7) @LorenzMeier We didn't understand your scratch. Could you explain better, please?

Essentially once you click an airframe it would open a menu which covers the right half of the screen, showing details and wiring information (also how to put the rotors on and rotation direction). Then you click apply in that dialog and the system configures and reboots.

[cfelipesouza]

I'm sending all the icons I've made, exported in SVG format and without arrows. The file is organized by APM and PX4, but you guys can use as you want.

Again, if I missed something, let me know.

AirframeIcons.zip

[LorenzMeier]

Thanks!

@DonLakeFlyer We should not make these two different icon sets. PX4 and APM use exactly the same physical configurations and the final airframe name comes from the airframe XML anyway. We shouldn't parallel efforts for something that is the same and we have to push a bit on both projects to try to weed out subtle differences wherever they can.

[DonLakeFlyer]

We should not make these two different icon sets.

Never said anything about two different icon sets. What I said was that I wanted to generate these images programmatically from the airframle xml definition. This way we aren't contuously chasing the latest frame config icon. It would also allow us to draw both small version for airframe selection and larger versions which show rotation and motor wiring numbers more easily.

Issues:

• The current PX4 UI which has a box for each top level category, and inside the box has a combo-box with the actual airframe list in it does not work well with a mouse wheel or two-finger track pad scroll. As you scroll, if the mouse ends up over one of the combo boxes, the scroll wheel will start scrolling the items in the combo box instead of the full view. As the combo box scrolls you are also making selections in the combo box. It makes it very easy to inadvertently change and airframe selection by just scrolling. It all ends up being quite strange behavior.
• The previous APM UI sort of matched the the PX4 UI. The issue there is that each FRAME selection in APM can encompass multiple airframe types with different chassis setups. In the previous UI we showed a Quad image for X Style. But X Style also include hexa/octo configs and the image was confusing people since they couldn't find their hexa config. Also the X Style FRAME value also includes some Tri variants. So each FRAME settings must show multiple icons in order to be visually representative. Instead of trying to add that new functionality I just switched everything to text as a quick fix. Here are images of how Mission Planner does FRAME selection, as well as what the current QGC daily build looks like:
• There is another issue with APM airframe config. Depending on what firmware type you select, the selection of a FRAME type may or may not be required. For example if you select the Heli firmware type, FRAME type is already set by the firmware to the correct Plus Style setting and should not be changed from there. Whereas if you select Quad firmware you may need to change to Plus Style intead of the X Style default.
• I also think that the current flow of the airframe config is not correct. I think it would be better if airframe config instead just showed you your currently selected airframe. It should also show you detailed wiring, motor numbers and prop rotations as the first screen. This is Lorenz's wiring screen scratch thing. Changing the airframe selection should be on a secondary dialog since it generally only happens one time and for APM stack in many cases it is not needed at all.That secondary dialog should have some hierachical mechanism for selecting aiframes which doesn't have the box+combo box scrolling problem.

Given the complexity of all of this. If we can get agreement on the change of flow from the last paragraph. Then I think the best approach would to have me first change to UI to match the new flow with some functional UI which can then be looked at and cleaned up with the designer's feedback.

[biapalmeiro]

Thanks @DonLakeFlyer for your answer. So, we will wait your adjustment to look it up again. If you prefer, you can send us just the flow for this configuration and we figure out how to fix the screen.

About the screen title and the airframe groups (it is not clear to me if it is an idea yet, but if yes), can we do some proposes to you evaluate?

[DonLakeFlyer]

I think I could mock up some images for a flow and then you could take it from there.

[biapalmeiro]

Ok. Great! I think if you just list the sequence of steps it is a good start point for us. Thank you.

[DonLakeFlyer]

I'm sending all the icons I've made, exported in SVG format and without arrows.

Thanks @cfelipesouza. I'll begin integrating these and comment if I find any problems.

[DonLakeFlyer]

FYI: My plan for V3.0 release is to move to the new icon set but still use the existing UI mechanism. Then for V3.1 we will move to the next aiframe config flow/ui which is in discussion.

[DonLakeFlyer]

@cfelipesouza I'm moving the icon discussion to a separate Issue: https://github.com/mavlink/qgroundcontrol/issues/2599, so it doesn't clutter up this Issue.

[biapalmeiro]

@DonLakeFlyer Do you have any dates for the releases?

[pkocmoud]

Can we also add a better method for determining the orientation of the flight controller. The list of orientation changes like pitch 90 and yaw 180 are very difficult to understand. I propose some form of 3d model of the Flight Controller which can be stepped via a simple control in Roll / Yaw / Pitch in 45 degree increments. This would also requiring a graphic representation of the aircraft it will be mounted to for overall reference.

[tubeme]

@pkocmoud I created this page: http://px4.io/docs/flight-controller-orientation/ so it is pretty straight forward and not confusing I think after you take a look at the manual.

[sujiv0]

I'm using QGC V3.2.4. I want to configure Airframe as Quad H. How can I configure it?? Please help @LorenzMeier

[hamishwillee]

@sujiv0 Best place to ask for technical support is on slack - qgroundcontrol channel - https://px4.slack.com/messages/C629RE9H7

[sujiv0]

@hamishwillee I'm not there in the px4.slack . Please help

[hamishwillee]

@sujiv0 You can create an account for our slack here http://slack.px4.io/ . I wouldn't have suggested you do this if I knew the answer.

[Pauloledes]

Hi, I would like to know which airframe is the most relative of Intel Aero RTF Drone one because this one is not available on QGC v3.3.0. I think that 3D Iris Quadrotor was the closest one but it looks like that Intel Drone is part of the Quadrotor X family whereas 3D Iris is part of the Quadrotor Wide family. Thank you already for your help.

[DonLakeFlyer]

You should ask this question on a firmware forum

[LorenzMeier]

Closing as stale.