Rather than say they are creating a relationship with the referenced product, I would say they are just adding a filter for "Product Line Items", and in the "Global: Custom Text" field, they are simply re-using the previous fields (which are excluded from display, but provide the information; they must be placed before the Global: Custom Text field, otherwise it won't work).

To display different attributes based on the product, they have created several Product Variation Types (for example: some have Color and Size attributes, others just Color). And each variation type, when you go to edit it, has a "Manage Display" tab.

The menu items, below the tabs and to the right, are the "View Modes". I believe the one you are mentioning is called "Product in cart". If you re-order the fields, you should see that the view is updated automatically.

Now, about how to understand this, you could read this tutorial: http://www.jaypan.com/tutorial/drupal-7-view-modes-consistently-themeing... and/or closely study the file: profiles/commerce_kickstart/modules/commerce_kickstart/commerce_kickstart_product_ui/commerce_kickstart_product_ui.module (line 21) which is where the "Product in cart" view mode is defined. Also, there's a lot of interesting hooks you could research too, in that same file.

Take this with a grain of salt, because I just started with Drupal Commerce 2 weeks ago. :D (but already had some Drupal xp).