...
The purpose of the vocab selection screen is to group each vocabulary into a "vocabulary block," which provides all the properties of each vocabulary. Several improvements were made to this design due to user complaints about visibility and efficiency. First, an alternating color scheme of white and light blue was chosen to mark contrast and boundaries among the different vocab blocks. This makes the overall design "less busy" because of clear chunking of information by colors and separations. Additionally, the three elements of vocab (PinYin, English, and Displayed) are clickable buttons that sort the vocabulary according to alphabetical order for the selected element. In this picture, the vocabulary is being sorted by alphabetical order according to PinYin, as marked by the downward black arrow. In addition to assigning a vocab as a study focus, users can also check "May appear in sentences" option for familiar vocab words, changing their color coding in sentences to red (see Sentence Viewing).
Sentence Viewing
We chose buttons for displaying the vocab words, as opposed to underlines, because this appeared to indicate the clickability affordance the best during user testing. Because some users had difficulty going back to previously viewed sentences during paper prototyping (where we initially displayed only one sentence at a time), we instead made it such that all previously fetched sentences would be displayed in a scrollable list. However, during computer testing, users complained about how once they had fetched a sentence, it wasn't possible to remove it from the list of displayed sentences, hence we introduced a Close button to remove it from the list. However, as users in our own independent testing during GR5 were confused as to whether closing a sentence simply removed it from immediate view or prevented it from ever being fetched again, and because the error of accidentally closing a sentence was not easily recoverable, then we introduced a "Closed Sentences" tab where closed sentences could be found and restored.
...