Frank,
In the beta area, about 80% of us understood this intuitively, but not everyone did, so you are not alone, and I'm sure the iFly team would be happy to find a solution that is unambiguous and intuitive for all.
In the meantime, see if this helps any:
The wind barb in the upper-right corner of the runway diagram pane shows you the wind vs all runways. This is equivalent to the yellow arrow you added to your mocked-up diagram, so that information is already there.
Everything in the right pane of this window is helping you interpret how the wind is presenting at each of your landing options. Wind direction with respect to the runway is shown as a vector (the arrow next to the runway number) and in head/tailwind and crosswind components (the green/red and yellow arrows, respectively).
All arrows in the right pane are presented with respect to the runway (i.e., with respect to your aircraft, if your aircraft is on final). So the thin arrow next to the runway number 10R indicates "coming at me a little from the left".
For the two 10/28 runways, the colored ihighlights on the runway numbers indicate 10 is the preferred runway (green) and 28 is not (red). 10 is preferred because you get a 6 kt headwind landing on that runway (the green arrow pointing "down the runway"). There will also be a 3kt crosswind coming from the left (the yellow arrow). If you were to choose 28, you'd have a 6kt tailwind (red arrow pointing "up the runway"), and a 3kt crosswind from the right.
It may not be intuitive to everyone when they first see it, but it *is* accurate, and should make sense once it's explained, even if it was confusing at first.
If you have suggestions on how that information could have been better indicated to make it more intuitive to you the first time you saw it, I'm sure the iFly team would like to hear that.