feat(metric): add Mirror symmetry - contour pixel

[kargaranamir]

This pull request refactors the pixel symmetry metric in AIM legacy. In all test cases, the new implementation yields the same results as the legacy implementation.

Mirror symmetry - contour pixel description:

[kargaranamir]

There is only one concern I have. For a more symmetric result, legacy metrics.js judgment says it's "bad".

[kargaranamir]

Observations:

• One of the most symmetric UIs based on the evaluation is "duckduckgo.com.png".
• Most of the UI screenshots are Non-symmetric.

[kargaranamir]

For Mobile:
"Miniukovich and De Angeli (NordicCHI'14)" says the measure settings for this metric in both mobile and desktop are identical except symmetry tolerance threshold (search for "symmetry tolerance threshold" in NordicCHI'14 paper).

"symmetry tolerance threshold" is one of the "radius" constants that we have? the 3-pixel one or the 4-pixel one. Do you have any idea?

[mplaine]

There is only one concern I have. For a more symmetric result, legacy metrics.js judgment says it's "bad".

Could this interpretation be based on the results shown in Table 3 (see AVI'14)? Then again, "Notably, the effect of symmetry on complexity was much stronger. Unlike in desktop GUIs, users did value symmetry in mobile GUIs." (see NordiCHI'14).

[mplaine]

For Mobile: "Miniukovich and De Angeli (NordicCHI'14)" says the measure settings for this metric in both mobile and desktop are identical except symmetry tolerance threshold (search for "symmetry tolerance threshold" in NordicCHI'14 paper).

"symmetry tolerance threshold" is one of the "radius" constants that we have? the 3-pixel one or the 4-pixel one. Do you have any idea?

"In particular, we lowered the color reduction threshold, which followed from the smaller screen size; lowered edge detection thresholds, which followed from subtler background textures; and increased our symmetry tolerance threshold, which followed from the smaller absolute size of mobile pixels." (see NordiCHI'14)

"Then we took the ratio of symmetrical pixels to all edge pixels and normalized it by edge density [31]. The measure settings were identical to those from [21] with an exception of symmetry tolerance threshold, which was twice as high (the size of Galaxy SII pixels was approximately a half of pixel size of the MacBook we used in [21])." (see NordiCHI'14)

"We reduced the number of contour pixels (by taking a contour pixel and dismissing others in the 3-pixel radius) and took them as key points. Further, for each key point, the algorithm looked for a match in the 4-pixel-radius area across the central axis." (see AVI'14)

I cannot give a confident answer really as the term symmetry tolerance threshold is not explicitly used in the AVI'14 paper.

[kargaranamir]

Could this interpretation be based on the results shown in Table 3 (see AVI'14)? Then again, "Notably, the effect of symmetry on complexity was much stronger. Unlike in desktop GUIs, users did value symmetry in mobile GUIs." (see NordiCHI'14).

"Considering individual correlations, our symmetry metric only moderately correlated with complexity scores and did not correlate with aesthetics scores."

For complexity score, it gets a negative score, which means the more the better.

[kargaranamir]

I cannot give a confident answer really as the term symmetry tolerance threshold is not explicitly used in the AVI'14 paper.

For now, it may be better to define two more variables for mobile as well, but keep them as the same as desktop.

[mplaine]

For now, it may be better to define two more variables for mobile as well, but keep them as the same as desktop.

I agree. However, as long as the variable values for mobile are incorrect also the results of the metric for mobile would be incorrect. Therefore, I would probably implement mobile support in the code but "disable" it until we get the correct values.

[mplaine]

For complexity score, it gets a negative score, which means the more the better.

One option is to use (for now) the following score ranges similar to m15_0:

• r1: "Less symmetric" (normal)
• r2: "Fair" (normal)
• r3: "More symmetric" (normal)

What do you think?

[kargaranamir]

• r1: "Less symmetric" (normal)
• r2: "Fair" (normal)
• r3: "More symmetric" (normal)

What do you think?

Agree. Also, the paper's pearson correlation for symmetry complexity is not that high.