Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I have a two List of Strings; ex:

ListA = {"A","B","C", "F"}

ListB = {"C","D","E"}

I need to compare these two lists & present the difference to user in UI.

I have implemented algorithm to compare lists & have following data:

  • Items in ListA which is not in ListB {"A", "B", "F"}
  • Items in ListB which is not in ListA {"D", "E"}

Please suggest some way to calculate & display percentage of similarity between two lists. Also it would be helpful if you can suggest a way to present list of missing element across lists.

share|improve this question
    
Can you give more information about what is in the lists? Are they single characters, names of countries, lines of code, numbers? The visualization can use features of the content to improve comprehensibility. –  ted.strauss Apr 4 at 5:59

4 Answers 4

Since you have two lists and there is no information on which one is primary, I think that diff like this will work good:

diff

Pros:

  1. It shows both lists unmodified
  2. It shows resulting list
  3. It highlights items which are added
  4. It shows common part of the lists

Cons:

  1. Three lists instead of one

Colors could be tuned up to your needs (for example, you may assign different colors to both lists and highlight different items accordingly in the resulting list, but do it with care since too much color may make things less recognizable).

You may also try to show only resulting list and give user an ability to choose list she want to compare it with:

enter image description here

Pros:

  1. One single list

Cons:

  1. Individual lists are not shown
  2. User interaction is required
share|improve this answer

What you describe seems a diff-like application. You could use a similar view, two columns and the matching items hightlighted.

enter image description here

As for the similarity algorithm, if ListA is {A} and ListB is {A,B} lists would be 50% similar, then it could be:

coincidences / (ListA length + ListB length + conincidences) * 100

share|improve this answer

The classical way is a Venn diagram:

Source: Wikipedia

(Source: Wikipedia)

For quantification of set similarity/dissimilarity, you can look at Sørensen–Dice coefficient or Jaccard index. Their parameterization is the Tversky index.

share|improve this answer

Alternative to alexeypegov suggestion is having a vertical list. Again, if you are showing less than 15 elements vertical list works. However, if the design had elements Scipion examples. You could pull off an amazing list comparator.

What is the main goal for the user having to view the list comparator?

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.