This paper examines the role of indiscriminate usage of color in design, on intuitive usage in interaction space. It seeks to explore whether there are any relationships between the adoptions of familiar color schemes on humans-computer interaction. This paper presents the results of this study as well as discussion on the outcome in relation to interface design and user experience and other critical design decisions.

The study used a mixed method design; principally qualitative, but relied on quantitative data to buttress claims

This research methodology focuses the research towards ascertaining variations in relation to quality; thus making research data, interpretation and theory formation, hinged on distinctions based of qualities (Wyse, 2011; Creswell, 2012). The quantitative relied on numerical strength of outcome and their inclination towards certain hypothetical claims or assumption. The study therefore engaged 24 participants who are credit seeking students in the “Technische Universitaet Berlin” through convenience sampling. The research question on which the investigation was based is “To what scale does the choice of design elements affect the intuitive use during interaction?”

In order to ascertain the effect of arbitrary color usage in interaction design on users, the study deployed interactive stimuli of 5 categories to participants. The categories are: Class 1: Inappropriate Coloring (IC) + good Label (GL); Class 2: Appropriate Color (AC) + Bad Label (BL); Class 3: Appropriate Color (AC) + Good Label (GL); Class 4: Outline-GL (GL); Class 5: Outline-Bad Label (BL). Figure 1 shows the interactive stimuli. The participants were expected to confirm if the images matched their respective labels. The identification model demanded of participants is to identification beyond color, as used in Wang et al. (2022).  

The stimuli were presented through a web application accessible via mobile or desktop devices. Each respondent had 20 each from Classes 1, 2 and 3 and also 30 each from Classes 4 and 5. Data captured from their interaction include:

1) Item Number (Integer)

2) Item label (Text)

3) Response (“Yes” or “No” represented in Binary)

4) Response time (milliseconds - starting from appearance of stimuli and respondents’ choice)

Stimuli and deployment

The stimuli for this experiment were an interactive web-application. It entails  collection  of  common  fruits  and  vegetables  with  name labels (English: German). The task of participants is to indicate if label matches the object displayed with primacy on shape/outline. The interaction was in two sets, colored interaction and outline interaction (Tables 1 and 2).

The color interaction stimuli are classified as follows: Class 1: Inappropriate Coloring (IC) + good Label (GL); Class 2: Appropriate Color (AC) + Bad Label (BL); Class 3: Appropriate Color (AC) + Good Label (GL) (Figure 2). Each class had 20 stimuli. A total of 60 stimuli were randomly presented to participants. The outline interaction had two categories of stimuli as, Class 1: Bad labels (BL) and Class 2: Good Labels (GL). The total stimuli in the outline set were 60; 30 from each class and randomly presented to participants. The experiment was deployed as responsive web application and participants were able to access with smart devices and willingly submit their data afterwards. 

Demographic data from 24 participants indicate 12 (50%) as female and the remaining 12 (50%) identified as male. 16 (64%) of the participants fall within the age range of 18-23 years, and 8 (32%) are in the age range of 24-29 years. The demographic data indicates a well heterogeneous population and entirely of digital natives, thus eradicating any doubt of incompetence in participating in the digital interactions. Tables (3 and 4) summarizes descriptively the outcome from the interactions.

In the appendix, Tables, 1 (IC +GL), 2 (AC+BL), 3 (AC+GL), 4 (BL), 5 (GL) summarizes the response time outcome from the interactions. In the case of outline stimuli, which have 30 stimuli per category against 20 in color categories, the first 20 stimuli were samples for comparative analysis.

Analysis of variance on effect of color usage

To investigate whether the use of color as compared to no-color interface designs pose any significant effect in interaction, an ANOVA was run on the average response accuracy from 20 stimuli extracted from each category. This analysis is necessary to confirm the notion of the effect of color usage in design. Comparing accuracy of result, outline stimuli had average accuracy of 0.826 whiles the colored stimuli had an accuracy of 0.6. This difference is confirmed as valid from the ANOVA analyses with P-value of 0.00000003, F-statistical value of 43.435 and F-critical of 4.052. With this a hypothesis of accepting difference in the average accuracies and elimination of occurrence by chance is removed.

It is concluded based on this finding that the addition of additional elements in the interaction space (as least as color as a carrier of information) increases complexity (Aloumi, 2013) in design and unlike general graphic works, color can positively or negatively affect interaction performance depending on how it matches the perceptive metaphor of users.

To examine the relationship between the various classes of stimuli, single factor analysis of variance (ANOVA) was conducted on the sets with varying hypothesis with alpha value of 0.05 in each case. The analysis returned inaccurate color (IC+GL) with average accuracy output of 0.408 and variance of 0.02 while accurate coloring (AC+GL) yielded a mean of 0.547 with variance of 0.057. The null Hypothesis (H₀) is invalid and is rejected because the P value (0.0187) is less than the computed α. This indicates that the experiment has less than 5% chance of happening by accident. Furthermore, the F critical of 4.052 is less than the F Statistic of 5.940 (Glen, 2013); this evidence compel the acceptance of the variations in means as significant and dependent on the appropriateness of color in the interaction. It can  thus  be concluded that interaction scheme with coloring that matches reality or users’ expectation of design scheme yields a more accurate interaction as compared to design with arbitrary color scheme.

Analyzing response time

Aside accuracy of inputs interaction speed also poses an interesting dimension to be observed; Response Time (RT).

The Hicks law shows that the time it takes for a person to make a decision as a result of the possible choices he or she has: increasing the number of choices will increase the decision time logarithmically (Soegaard, 2019; Nikolov 2017). Considering color and its usage as a carrier of information in design, it is hypothesized that color usage increases RT. It is also hypothesized that in designs where color is arbitrarily used, it can misinform respondents and thus the attempt to accurately respond will result in longer response time as compared to accurately colored stimuli.

To verify the above hypothesis an ANOVA was conducted on average response time from outline stimuli (no color) and colored stimuli. With computing alpha value of 0.05, the analysis yielded an average response time of 2 seconds for colored stimuli and 2.12 seconds for outline interaction. The P-value of 0.704 is greater than the computing alpha value, thus the null hypothesis cannot be rejected. The F-Statistics (0.146) and the F-Critical (4.0517) also affirm the acceptance of the null, based on the bases that the average values could merely be by chance and are not significant.

Although the averages indicate that RT is slightly faster with color interaction (against the main Hypothesis), further analysis compel the rejection of this notion.

Validating further, the research sought to ascertain the effect of arbitrary coloring on response time. This necessitated another ANOVA on the response average response time between appropriately colored stimuli (AC+GL) and inappropriately colored stimuli (IC+GL). Accurately colored stimuli had average RT of 2.03 seconds whiles the inaccurate coloring yielded average RT of 1.83 seconds. However, the P-value of 0.39 against the alpha value of 0.05 points to disregarding the differences in the averages. The F-Statistic (0.75) and F-Critical value 0f 4.051 affirms the acceptance of the null hypothesis that the averages are not different.

Conducting the investigation during the covid-19 pandemic  had  a  toll  on  the  statistical  strength  of  the outcome towards mass application and interpretation. However, the analysis still reveals significant relationships that are useful for meeting the objectives of the study.

Zhang and Wang (2009), argue that color is significant in (a) increasing accuracy of information identification and effectiveness and (b) ensuring high speed in human-computer interaction. This claim is debatable according to the finding in this research. The disparity between the accurate color interaction (AC-GL and AC-BL) and outline interactions (GL and BL) shows that this not always the case. As deduced, color as an element of design in an interaction space increases complexity (Aloumi, 2013) and consequently the accuracy of stimuli interpretation. Juxtaposing the above deduction on the conclusion from (IC-AC) ANOVA, then it is logical to conclude that color only enhances accuracy of information comprehension when it complements or satisfies the users color association. In the case where intended message in color usage contradicts users’ intuitive interpretation, the effect is rather distractive. This affirms the assertion of Löffler et al. (2018), that, congruent coloring yielded the greatest accuracy and preference probably because they do resolve conceptual ambiguities and aid comprehension of relayed information. It is worth noting that this assertion should be assimilated with cognizance of the performance difference between colored and no-colored images is smaller with artificial object recognition than in natural object recognition.

Although the averages indicate that RT is slightly faster comparing color interaction and outline interaction the ANOVA output compels the rejection of the hypothesis. This implies that the difference in the response averages is not significant or occurred by accident. The similar conclusion comes with the accurately colored stimuli and inaccurately colored stimuli. Thus, the claim of Zhang and Wang (2009) on color increasing interaction speed could not be ascertained. This insignificant effect could have been traded-off in the variations in the response accuracy tests, although not justifiable in this experiment.

Implication for interface design

ID like other forms of design involve creative use of elements of design. However, ID demands “purposeful design” which is essential for good interaction, lest elements become distractive. In as much as there is no strict rule as to which and how, elements must be used in design, this investigation has shown that, in the order to facilitate intuitive use and minimalize the interaction concept without compromising on essential requirements, the use of elements can be considered under these tenets:

a. Relevance: using primarily elements and components that have a role in the interaction scheme.

b. Relation: explore usage  context  knowledge  scope  to build relationship between the “relevant” elements or components.

This is applicable in cases where designers derive their interaction from prototypes and templates, and also when composing Interaction scheme from scratch.

Drawing from the findings of this research, it is reaffirmed that color significantly affects interaction by improving efficiency and accuracy of output when the usage conforms to users encoded coding of images and association. Encoding is enhanced with color through the encoding-specificity effect (Zhang and Wang, 2009). Signal or stimuli interpretation is further enhanced when similar color matching is presented at retrieval point. In a case where color association is arbitrary and encoding and mismatched at retrieval, the efficiency and accuracy effect can be impeded. It can thus be concluded that, fundamental to understanding element usage in design is based on their “Relevance and Relation”. Relevance points to determined usefulness of an element in a usage context. So long as users are able to identify relevance of an element to the context of use, recognition is augmented and satisfaction increased. Next to ensuring relevance is the notion of how well an element relate into the usage context. Relation exploits, creatively, the several options of making a “relevant” element synthesize well into a context. This is what creates the unison in the design and ensure consistency in interaction space. Relation can be developed from innate, sensorimotor, culture and expert associations (Naumann et al., 2007; Löffler, 2014). The knowledge Continuum (Naumann et al., 2007) identifies hierarchy of knowledge sources as innate (acquired through genetic activations or at the prenatal stage of development), sensorimotor (acquired from interaction with physical environment), culture (knowledge specific to users’ society) and expertise (knowledge specific to professional domain). Depending on the type of usage context, the various sources in the knowledge continuum confirm their preeminence. From the designer’s perspective, all of the thought process and usage of elements evolve basically around the principle of relevance and relation.

Despite the small participant number for the study, it was still possible to ascertain the principles of color usage in design. Further research with larger class of participants will be worthy to affirm or disprove the outcome of this study.

This work was supported by the Katholischer Akademischer Ausländer-Dienst [S1 Funding Program]; the Department  of  Psychology and Ergonomics Human-Machine Systems, Technische Universität, Berlin.

The authors have not declared any conflict of interests.