Visual Selective Attention Analysis for Elderly Friendly Fresh E-Commerce Product Interfaces

Abstract

Visual selective attention is a cognitive process by which humans efficiently process critical visual information. It reflects the user’s authentic visual thinking and can be applied by designers in age-friendly design to enhance the user experience of elderly users, meeting their visual needs and attention characteristics. This has significant implications for the age-friendly design of fresh e-commerce product interfaces. This paper explores age-friendly design for fresh e-commerce product interfaces based on the theory of visual selective attention. Experimental data indicate that the optimized interface significantly enhances the user experience for elderly users, with task completion time reduced by 39.62% and satisfaction increased by 60%. First, qualitative research is conducted to uncover the visual selective attention mechanisms of elderly users. Combining this with the framework of fresh e-commerce products, an age-friendly design model is established, including page layout, brand colors, font size, and focal styles. Second, using eye-tracking, descriptive analysis, and correlation coefficient analysis, a comparative analysis of the visual selection behaviors of elderly and young users is conducted, yielding characteristics and principles for age-friendly interactive interface design. Finally, the feasibility and effectiveness of the proposed method are validated through design practice and evaluation. This research provides new insights and methods for the age-friendly design of fresh e-commerce product interfaces. It holds practical significance and value for constructing an elderly perspective in fresh e-commerce and expanding the private traffic of elderly users.

1. Introduction

Under the “home quarantine” epidemic prevention policies in China, the fresh e-commerce market has rapidly grown, with the industry reaching a scale of CNY 4584.9 billion and showing an aging trend [1]. However, current fresh e-commerce products primarily target users aged 24 to 35 and above, highlighting significant deficiencies in age-friendly design [2]. As internet technologies continue to advance, complex interface functionalities increase the cognitive load for elderly users, and cumbersome designs make it difficult for them to have smooth shopping experiences, exacerbating their resistance to internet products [3]. To address these design challenges, understanding user sentiment has proven valuable in tailoring interfaces that meet specific user needs. Huang et al.’s (2022) study applied advanced sentiment analysis to identify user preferences, offering insights that can support the development of personalized age-friendly e-commerce designs by highlighting features that resonate with elderly users [4]. While insights from sentiment analysis lay the groundwork for tailoring e-commerce interfaces to user preferences, addressing broader accessibility needs is equally essential to prevent digital exclusion among elderly users. In response to the challenges faced by elderly users in digital environments, the Web Content Accessibility Guidelines (WCAG) provide foundational principles aimed at reducing digital exclusion for diverse user groups, including older adults [5]. WCAG offers general accessibility guidance, such as enhanced contrast, adjustable font sizes, and simplified layouts, primarily addressing broad usability issues. Given the unique visual needs of elderly users in the fresh e-commerce context, design strategies need to extend beyond WCAG’s general principles, focusing on specific interaction and visual requirements to improve usability and engagement on these platforms.

The rapid development of fresh e-commerce platforms has increasingly become a focus of researchers. Zhang conducted an in-depth analysis of China’s fresh e-commerce industry, outlining four operational models and emphasizing the need for government support policies while suggesting strategies such as pre-sales to stimulate industry growth [6]. In 2022, Yin et al. proposed a logistics packaging design system for fresh e-commerce to enhance order processing and packaging quality [7]. Ling et al. identified brand image and trust as critical factors for the market competitiveness of fresh food e-commerce platforms [8]. Chen et al. utilized a latent Dirichlet allocation model to analyze customer reviews of e-commerce fresh food logistics services, proposing a six-dimensional evaluation system to improve the quality of cold chain logistics services [9]. Despite extensive research both domestically and internationally covering various aspects of fresh e-commerce such as marketing, purchasing factors, brand strength, and logistics packaging, studies specifically focused on fresh e-commerce product interfaces, particularly in the context of age-friendly design, remain limited.

Visual selective attention refers to the process by which individuals selectively perceive external information within a specific timeframe [10]. International research on “Visual Selective Attention” has predominantly focused on neuroscience, cognitive psychology, image processing, and computer vision, with relatively limited practical application in smart product interaction interface design. Overall, both domestic and international studies emphasize the importance of visual selective attention, yet research on its practical application in smart product interaction interface design remains relatively sparse [11]. This study uses visual selective attention as a starting point to investigate the age-friendly design of fresh e-commerce product interfaces for elderly populations. Considering that visual selective attention reflects users’ visual thinking and that the visual selective attention mechanisms of elderly individuals degrade due to declining visual functions [12], it is essential to guide age-friendly interface design based on the visual selective attention mechanisms of elderly users. This study aims to optimize age-friendly fresh e-commerce interface design through the theory of visual selective attention, enhancing the user experience for elderly users. The research objectives include (1) analyzing the visual selection characteristics of elderly users on fresh e-commerce interfaces; (2) refining age-friendly design strategies; and (3) validating the effectiveness of the design through experiments. This study provides theoretical support and practical methods for age-friendly design in fresh e-commerce interfaces.

This paper is structured as follows: Section 2 of this paper focuses on the research and review of relevant theories. Section 3 outlines the research process, introducing the methodologies used. Based on the User Experience Five Elements model and the visual attention mechanisms of elderly individuals, an age-friendly design model for fresh e-commerce products is developed. Section 4 presents the research findings, analyzing the characteristics and factors influencing visual attention choices among elderly users. Section 5 discusses these results and implements age-friendly design practices for fresh e-commerce product interfaces based on the derived design strategies. Section 6 concludes with a summary and prospects. Grounded in the theory of visual selective attention, this study utilizes experiments and eye-tracking measurements to deeply investigate the differences and influencing factors in visual element selection on interfaces between elderly and young users. It provides valuable case references for future age-friendly interface design and development.

2. Related Work

Fresh e-commerce products primarily refer to intelligent terminal applications that leverage internet technology to offer users transactions involving fresh agricultural products such as vegetables, fruits, meat, poultry, eggs, and seafood in a virtual space [13]. Fresh e-commerce products act as intermediaries within the upstream and downstream industries, coordinating and integrating users, products, information, funds, and logistics. They provide suppliers with low-cost efficient sales channels while enhancing industry capabilities and consumer experience [14]. As post-pandemic elderly care models increasingly integrate informatization, intelligence, and digitization, the online penetration rate of fresh products continues to grow, with user demographics trending toward an aging population. Driven by policy, some fresh e-commerce enterprises have introduced age-friendly designs, including simplified information, enlarged fonts, and voice interaction features, making age-friendly design a new development trend in the industry. In recent years, China has introduced the Internet Website Age-Friendly Universal Design Guidelines, which specifically address design requirements for elderly users, aiming to enhance the online experience for this demographic [15]. While these guidelines provide a foundational approach to age-friendly design, their practical application remains limited, particularly in more complex environments such as fresh e-commerce platforms. The age-friendly design of fresh e-commerce products is still in the exploratory stage, and several user experience issues persist [16]. First, the coverage is low, and designs often do not consider the needs and difficulties of elderly users. Second, there is a lack of clear design standards, and product quality needs improvement. Additionally, overly complex interface information increases cognitive load [17], necessitating improvements in user experience. Finally, interface designs are often similar, lacking attractiveness and innovation, and do not align with the cognitive preferences of elderly users, leading to decreased trust among elderly users. These issues urgently need to be addressed to enhance the shopping experience for elderly users. Betlej’s (2022) study emphasizes the importance of aligning technology with the social and emotional context of elderly users, which is highly relevant in fresh e-commerce platforms, where elderly users benefit from designs that cater to their unique needs [18].

As the international benchmark for web accessibility, the Web Content Accessibility Guidelines (WCAG) serve as a foundational framework for digital inclusion, emphasizing accessible web content for users with various disabilities, including older adults. This standard, established by the World Wide Web Consortium (W3C), is widely adopted globally and provides essential principles for designing accessible web content [19]. In the context of fresh e-commerce platforms, which face specific usability and accessibility challenges for elderly users, WCAG’s guidelines support efforts to establish universally accessible platforms. By integrating WCAG’s principles as a baseline, the present study seeks to explore additional targeted design strategies that address the particular visual and interaction needs of elderly users on fresh e-commerce interfaces, thus aligning the study with international accessibility standards.

Age-friendly interactive interfaces play a crucial role in facilitating information exchange between elderly users and intelligent terminals. These interfaces typically consist of elements such as layout, color, images, icons, and text [20]. The goal of excellent age-friendly interface design is to ensure that elderly users experience ease of use, efficiency, and enjoyment. Zhou et al.’s (2022) study on smart home interfaces demonstrated that optimized layouts and controls significantly improve usability and satisfaction for elderly users, highlighting the importance of tailored design in age-friendly technology [21]. Visual cognition is a key element in achieving ease of use, efficiency, and enjoyment in age-friendly interactive interfaces, involving the integrated application of knowledge from cognitive psychology and ergonomics. In the interaction with internet products, elderly users primarily rely on visual perception to acquire interface information. Visual selective attention, as one of the cognitive mechanisms by which elderly users efficiently process critical information, also serves as an important means of self-regulating psychological resources.

Visual selective attention refers to the process of concentrating limited psychological resources to perceive the most important information within a finite period [22]. Psychologist Hal Pashler (1998) pointed out that individuals selectively focus on certain pieces of information when perceiving external visual stimuli [23]. This selective attention acts as an information filter, helping the brain connect visual sensations with perception during information processing. Due to the brain’s limited capacity for information processing, visual selective attention allows individuals to selectively focus on important information, thereby enhancing cognitive efficiency. Visual selective attention plays a crucial role in visual cognition, and researchers have proposed various theoretical models to explain it. Early filter models emphasized information selectivity. Broadbent (1957) proposed a filter model of visual selective attention, highlighting that individuals selectively focus on information relevant to their psychological goals to prevent information overload in the brain [24]. Treisman’s (1969) attenuation model suggested that all information is perceptible but only some is selectively attended to [25]. Deutsch and Deutsch’s (1963) late selection model posited that visual selective attention involves habitual and fine processing of information, regardless of the amount of information input [26]. Johnston and Heinz’s (1978) multimode model combined these earlier models, emphasizing three stages of visual selective attention: physical representation recognition, semantic representation matching, and information processing [27]. In summary, visual selective attention is a complex process influenced by multiple factors, including familiarity, physical representation, and semantic features. Familiar objects are typically prioritized, the physical attributes of information are more likely to capture attention than semantic attributes, and the selection of semantic attributes is influenced by their importance to the individual.

Based on previous research, three cognitive models of visual selective attention have been summarized: spatial location priority, object feature priority, and contextual decisiveness. Visual attention prioritizes spatial locations as fundamental units for selective cognition, forming specific spatial “beams” through scanning and positioning, and then processing information deeply at those locations [28]. Additionally, there is an object feature priority cognitive model where visual attention selectively recognizes and contrasts information objects based on their object features, reinforcing attention to those features. In different visual environments, individuals choose spatial locations or object features as fundamental units depending on the complexity of the environment.

Visual selective attention exhibits three fundamental characteristics: goal-directedness, interactivity, and human-centricity, which underscore its universality. This selective attention is driven by goals, where individuals actively focus on information relevant to their goals; once the goal is lost, the attention mechanism ceases. It encompasses both passive and active forms of attention, relying on the presence of external information, although not all information can capture attention—it depends on the match between information and user needs. Importantly, visual selective attention is uniquely human, influenced by various human factors including physiological, psychological, behavioral, and mental states. Only information that aligns with these factors can capture attention, highlighting a user-centered cognitive model.

Visual selective attention is influenced by multiple factors, including early environmental factors and later endogenous and exogenous factors. Early environmental factors involve information capacity and density, which impact selective attention. Therefore, in complex information environments, people tend to prefer information that is easier to distinguish. Additionally, visual selective attention involves two cognitive mechanisms: top-down and bottom-up [29]. Top-down cognition is governed by endogenous factors such as knowledge, goals, experience, and expectations. Bottom-up cognition is triggered by external visual stimuli, including contrast, change, and salience among other exogenous factors. These two cognitive mechanisms intertwine and collectively influence the manifestation of visual selective attention.

3. Materials and Methods

3.1. Hypotheses

Elderly users face distinct visual and cognitive challenges when interacting with digital platforms. Age-related changes in visual processing and attention mechanisms make it more difficult for them to navigate complex interfaces, often resulting in information overload. Visual selective attention, a crucial cognitive mechanism, enables elderly users to prioritize relevant visual elements. However, due to cognitive limitations, they may struggle to focus on key content within complex interfaces, leading to increased cognitive load and navigation difficulties. Although existing research has proposed various design strategies, it has yet to fully address how these strategies can be specifically adapted to meet the needs of elderly users on visually complex platforms such as fresh e-commerce sites.

This gap in the literature leads to the following hypotheses:

H1: 

A cognitive mechanism underlying the visual selective attention of elderly users exists.

H2: 

Certain design strategies can significantly improve the user experience of elderly users on fresh food e-commerce interfaces, meeting their visual needs and attention characteristics.

To answer these hypotheses, a research framework (Figure 1) was developed, integrating a literature review, case analysis, and experimental research. This framework clarifies the visual selective attention mechanisms of elderly users and identifies key elements of age-friendly fresh e-commerce interfaces. Based on these insights, an age-friendly design model was constructed, which guided the selection of visual elements for further analysis. Subsequently, experiments involving visual element selection, eye-tracking tests, and data analysis were conducted to derive effective design strategies. These strategies were then applied in practical design cases, with task performance and eye-tracking experiments validating their age-friendliness and supporting the study’s conclusions.

The research framework in Figure 2 is designed to test the core hypotheses of this study by systematically investigating the cognitive mechanisms underlying elderly users’ visual selective attention to fresh e-commerce interfaces first (H1). Building on these insights, the framework then focuses on developing targeted design strategies (H2) to enhance the user experience, ensuring that the visual needs and attention characteristics specific to elderly users are effectively met. Each stage, from the literature review and case analysis to experimental validation, contributes to refining these strategies and establishing a robust age-friendly design model.

3.2. User Research

Elderly users of fresh e-commerce platforms mostly grew up in the 1950s and 1960s, possessing a rich knowledge background and experience with internet products [30]. Currently, they primarily reside in first-tier and new first-tier cities, are between 60 and 70 years old, have the ability to live independently, and have the material means to do so. They are willing to use internet products to meet various needs [31]. By studying the visual physiological characteristics, visual cognitive characteristics, and active and passive interaction behaviors of elderly users, their visual selective attention mechanisms when using fresh e-commerce products can be summarized. This provides a foundation for the subsequent extraction of visual selective attention elements and the construction of an age-friendly design model for fresh e-commerce.

As people age, their visual senses experience three main issues. First, they may encounter challenges in seeing objects clearly, requiring them to hold their phones farther away and enlarge the text for a clear view. Second, elderly individuals’ ability to distinguish colors diminishes, leading them to prefer warm tones and have a reduced ability to differentiate between similar colors. Lastly, their field of vision narrows, making it difficult to fully perceive their surroundings and accurately judge distance and depth. Research indicates that the visual attention abilities of elderly individuals decline in three areas: the ability to distribute attention decreases, although they maintain a high level of attention to single pieces of information; the flexibility in shifting attention is reduced, making it easy for them to become confused among multiple pieces of information; and the efficiency of selective attention decreases. Compared to younger individuals, elderly people perform worse in locating target information and filtering out distracting stimuli [32].

In visual selective attention, elderly individuals exhibit two behavioral modes: passive selection behavior and active selection behavior. Passive selection behavior includes involuntary gaze shifts and habitual implicit expressions [33]. Involuntary gaze shifts refer to the elderly’s eyes moving unintentionally toward randomly appearing visual stimuli without specific constraints [34]. Habitual implicit expression is characterized by the elderly repeatedly choosing a particular target, even if better options are available, maintaining this habit [35]. Active selection is purposefully choosing specific interface information based on conditions such as context, knowledge, goals, and experience [36]. The absence of these constraints may lead the elderly to exhibit passive attention behavior or even cease selecting information altogether. Active selection behavior includes context matching behavior, knowledge activation behavior, goal search behavior, and expectation description behavior. Context-matching behavior is a bottom-up cognitive process that helps elderly users accurately acquire information and achieve task goals by activating their memory or cognition [37]. Knowledge activation behavior involves selecting interactive information based on personal knowledge background and life experience [38]. Goal search behavior helps elderly users efficiently retrieve information relevant to their task goals [39]. Lastly, expectation description behavior refers to elderly users selecting information according to predefined criteria, such as visual style or product functionality requirements [40]. These behaviors reflect the elderly’s sensitivity and reliance on context, knowledge, goals, and expectations in visual selective attention.

From the analysis of elderly users’ visual physiological characteristics, visual attention characteristics, and factors influencing active and passive visual attention behaviors, five dimensions of cognitive mechanisms were identified: visual sensitivity, personal habits, personal memory, knowledge and experience, and emotional needs. This comprehensive analysis provides a foundation for understanding the visual selective attention behaviors of elderly users on fresh e-commerce product interfaces, guiding the design of an age-friendly interface model.

3.3. Competitive Analysis

Researching age-friendly fresh e-commerce can be effectively conducted by analyzing related competitive products to summarize the functions and key task processes suitable for elderly users. The competitive analysis includes the following steps: (1) collecting leading products in the fresh e-commerce field and capturing screenshots of key task interfaces; (2) breaking down product features and filtering relevant functionalities; and (3) organizing core task processes such as product search, checkout, order review, returns, and after-sales services.

The fresh e-commerce sector adopts various business models such as “home delivery”, “store + home delivery”, “community group buying”, and “locker delivery.” Given the increased reliance on fresh e-commerce post-pandemic and the significant trend of aging users, this research focuses on age-friendly design for home delivery mode fresh e-commerce products. By searching “fresh e-commerce” on the iOS platform and the keywords “fresh” and “shop” in the overseas App Store, the top ten home delivery mode fresh e-commerce products were selected for age-friendly design analysis (

Table 1. Age-friendly fresh food e-commerce competitor information table.

Icon	Name	Version Number	Function	Monthly Active User	Score	Mode	Elderly Friendly
	Dingdong	11.31.1	Home/Categories/Communities/Shopping cart/Personal center	9810	4.8	Home delivery	√
	Freshippo	6.15.0	Home/Categories/Communities/Shopping cart/Personal center	19113	5	Store + home delivery	√
	JD Daojia	8.42.0	Home/Categories/Communities/Shopping cart/Personal center	7803	4.9	Traditional fresh produce	√
	Taobao (Elderly Edition)	10.42.30	Home/Communities/Message/Shopping cart/Personal center	167802	4.2	Shopping	√
	JD (Elderly Edition)	13.6.8	Home/Communities/Shopping cart/Personal center	140753	3.7	Shopping	√
	Xiang Supermarket	6.44.10	Home/Categories/Menu/Shopping cart/Personal center	3539	4.8	Home delivery
	Meituan Selected	6.62.71	Home/Categories/Communities/Shopping cart/Personal center	6383	4.9	Community group buying
	Pupumall	5.0.6	Home/Categories/Special offers/Shopping cart/Personal center	12607	4.8	Home delivery
	Weee!	20.9	Home/Categories/Restaurant/Communities/Personal center	3340	4.8	Home delivery
	FreshDirect	11.13	Home/Search/Categories/Order/Personal center/Shopping cart	2510	4.8	Home delivery
	FreshGoGo	6.9.3	Home/Categories/Shopping cart/Order/Personal center	1460	4.1	Home delivery

). Based on an experiential analysis of the core functions of ten competing products and user evaluations from elderly individuals, a vertical dissection of fresh food e-commerce product functionalities was conducted. This led to the arrangement and combination of three functional frameworks: (1) Home Page, Categories, Shopping Cart, Personal Center; (2) Home Page, Categories, Special Offers, Shopping Cart, Personal Center; and (3) Home Page, Categories, Community, Shopping Cart, Personal Center. Considering the needs of elderly users and the educational role of social media platforms for this demographic, the framework of “Home Page, Categories, Community, Shopping Cart, and Personal Center” was selected as the primary functional framework for age-friendly fresh food e-commerce products.

The design of task workflows aims to assist users in achieving their goals through a structured path, with a focus on task execution and goal attainment. Research indicates that the core task flow typically used by elderly users on shopping websites includes the Home Page, Category List Page, Product List Page, Product Details Page, Shopping Cart Page, Payment Page, and Personal Center Page. With the rise of community-based e-commerce, users of fresh food e-commerce products primarily need to perform the following three core tasks: product selection, participation in interactive communities, and obtaining after-sales service [41].

3.4. Model Construction

Extracting visual selective attention objects and factors influencing user experience for age-friendly fresh food e-commerce products is the prerequisite for this study. The literature review reveals that common models for user experience research include the Five Elements Model of User Experience [42], the HEART Model [43], the Honeycomb Model [44], the 5E Model [45], the CUBI Model [46], and the APEC Model [47]. Jesse James Garrett proposed that user experience, applicable to internet product design, can be divided from abstract to concrete into five layers: Strategy, Scope, Structure, Skeleton, and Surface [48], with each layer further decomposable into its components [49]. Given that age-friendly fresh food e-commerce products fall into the category of vertical functional e-commerce products, the Five Elements Model of User Experience was adopted, combined with competitive product analysis and semi-structured interview methods, to extract visual selective attention objects.

Based on a competitive analysis of the functional frameworks and core task flows of age-friendly fresh food e-commerce products, utilizing the Five Elements Model of User Experience, a dissection and an analysis of the core interfaces of both domestic and international fresh food e-commerce products were conducted. This process extracted visual selective attention objects at various levels, encompassing aspects such as interaction design, page layout, functional components, text, images, icons, and color schemes. Through semi-structured interviews with scholars, product managers, interaction design experts, and elderly users, the visual elements influencing user experience in age-friendly fresh food e-commerce products were discussed. The study identified page layout, focal style, text size, and brand colors as the most critical visual selective attention objects.

This study analyzes the visual selective attention mechanisms of elderly users when interacting with fresh food e-commerce products. Based on five dimensions—visual sensitivity, personal habits, personal memory, knowledge experience, and emotional needs—a visual selective attention mechanism for elderly users was constructed. Subsequently, integrating the Five Elements Model of User Experience, competitive product analysis, and semi-structured interviews, four visual elements—page layout, text size, brand color, and focal style—were extracted from the core interactive interfaces of fresh food e-commerce products. Finally, these visual elements were aligned with the visual selective attention mechanism of elderly users to form a design model for age-friendly fresh food e-commerce products.

3.5. Sample Clustering

Elderly individuals often experience issues such as scattered attention and quick fatigue. Therefore, precise control over the quantity and duration of tests is required in experiments. A typicality processing method is employed, which involves classifying a large number of test subjects to select the most representative samples, thereby simplifying the experimental sample while retaining key characteristics. This study uses a combination of algorithmic clustering and expert clustering, based on clustering efficiency and the accuracy of clustering results, to perform typicality processing of visual elements.

Expert clustering leverages the experience and expertise of specialists for classification and extraction, ensuring high accuracy. In contrast, intelligent algorithm clustering often employs the K-means algorithm. This algorithm uses a user-defined parameter k to partition n input objects into k clusters, aiming to maximize similarity within each cluster while minimizing similarity between different clusters. The basic steps include selecting k objects as initial cluster centers, assigning each object to the nearest cluster, recalculating the mean of each cluster, and repeating this process until convergence [50]. Generally, the squared difference criterion is used, as expressed in the following formula:

The formula for the standard form of the difference in squares is

$$\mathrm{E}={\sum }_{i=1}^k{\sum }_{\mathrm{g}\in {\mathrm{A}}_{\mathrm{i}}}{\left|\mathrm{g}-{\mathrm{n}}_{\mathrm{i}}\right|}^2$$

In this context, E represents the sum of squared errors for all samples, g is a point in the space, and ${\mathrm{n}}_{\mathrm{i}}$ is the mean value of cluster ${\mathrm{A}}_{\mathrm{i}}$ [51]. This objective function ensures that the resulting clusters maintain the highest level of compactness and utilizes the Euclidean distance as the metric.

In the process of typifying experimental samples using the K-means algorithm, each visual element is first subjected to the corresponding encoding operation. Subsequently, the complete set of encoded data for each category is used as the input database for K-means clustering. In this process, the Web Content Accessibility Guidelines (WCAG) were also considered to ensure that the selected visual elements adhered to accessibility standards, such as enhanced contrast and adjustable font sizes, which are essential for elderly participants. Considering the physiological conditions of elderly participants and the experimental objectives, it is crucial to avoid an excessive number of options to prevent difficulty in their selection process. Additionally, it is essential to ensure that the number of experimental samples is both comparable and valuable for reference. Therefore, the typical sample size for each visual element is set to 4–5, meaning the value of k is set to 4–5. Taking the clustering process and results of page layout as an example, an initial analysis reveals diversity in the product listing pages of fresh food e-commerce, while other functional interfaces are similar. Ultimately, 76 product listing pages were selected. After encoding and iterative clustering processing, the final experimental samples were formed (

Table 2. Page layout clustering results.

Code	P11	P12	P13	P14
Characterization	Card layout	Drawer list layout	Waterfall layout	Nine grid layout
Typical sample
Abstract samples
Experimental samples

). The clustering results of various visual elements using the K-means algorithm are presented in

Table 3. Brand color clustering results.

Code	P21	P22	P23	P24	P25
Characterization	Rose red	Grass green	Sky blue	Warm yellow	Classical Red
Experimental samples

,

Table 4. Focus style clustering results.

Code	P31	P32	P33	P34
Characterization	Line border	Background overlay	Bold and enlarged	Color specificity
Experimental samples

and

Table 5. Text size clustering results.

Code	P41	P42	P43	P44	P45
Characterization	14 px	16 px	18 px	20 px	22 px
Experimental samples

.

3.6. Controlled Experiment

Experimental Objective: In the experiment, both the elderly group and the young group are required to select visual elements of the fresh food e-commerce product interface. By utilizing subjective attention ratings, a visual selective attention factor evaluation scale, and eye-tracking measurement data, the characteristics and main influencing factors of the visual choices of elderly users are summarized.

Experimental Design: Using clustering methods, 4–5 typical samples for each visual element were obtained. After standardizing the typical samples as single variables, they were grouped by visual elements to form images. Figure 2 provides an example of a page layout sample combination. The experiment requires participants to view the experimental samples of each group of visual elements, with each sample viewed for 10–15 s. Participants then select the two samples that attract the most attention and rate them using a five-point Likert scale, with scores ranging from 1 to 5: very inattentive, inattentive, neutral, attentive, and very attentive. Additionally, participants are asked to describe the reasons for their choices using descriptive words (

Table 6. Factors influencing visual choice.

Evaluation of Factors Influencing Visual Attention in Making Choices

(1) The selection of this visual element is based on visual sensitivity.

(2) The selection of this visual element is based on personal habits.

(3) The selection of this visual element is based on personal memory.

(4) The selection of this visual element is based on personal knowledge.

(5) The selection of this visual element is based on personal emotions.

). They also rate the influencing factors of visual selective attention across five dimensions: visual sensitivity, personal habits, memory experience, knowledge background, and emotional needs. These factors are quantified using a five-point Likert scale, with scores ranging from 1 to 5: strongly disagree, disagree, neutral, agree, and strongly agree.

Experimental Subjects: The experiment recruited two groups of participants. (1) Elderly Group: This group includes 20 residents from first-tier cities, aged 60–70, with experience in using fresh food e-commerce. The gender ratio is 1:1, with the age distribution between 60–65 and 66–70 being 3:2. (2) Control Group: This group includes 20 young adults aged 20–30, also with experience in using fresh food e-commerce. The gender ratio is 1:1.

Experimental Equipment: an SMI ETG 2w Eye Tracker; a Computer; a Stopwatch for Timing; two Paper-Based Visual Attention Rating Forms; a Selection Factors Rating Form.

Experimental Procedure:

• Before the experiment begins, the tester gives the participants a brief introduction to the purpose and procedure of the experiment. After the participants fully understand the experimental tasks, they are asked to wear the eye tracker and adjust their sitting posture. A three-point calibration is conducted to ensure the accuracy of the eye tracker. The experiment formally starts after the calibration is completed;
• The experiment is divided into four groups of visual element measurement samples, with each group containing 4–5 high-fidelity images. Figure 2 shows a sample of page layouts as one group. The positions of the sample images are randomly adjusted for each experiment. Participants are instructed to observe the sample images of each group of visual elements for 10–15 s. They then select the two samples that attract the most visual attention and rate them for attentiveness. This process is repeated for all four groups of visual elements, completing the selection and attentiveness rating for each group, thereby concluding the eye-tracking measurement;
• After the eye-tracking measurement, participants are asked to rate the factors influencing visual attention selection. Participants use descriptive words to explain the reasons for their sample choices for each group and complete the rating scales for five influencing factors (visual sensitivity, personal habits, memory experience, knowledge background, emotional needs). The rating process is conducted through semi-structured interviews. The tester provides detailed explanations of the five influencing factors and captures the sensory descriptions of the elderly participants. The tester also guides and assists the elderly participants in completing the rating scales for the factors influencing visual selection;
• The eye tracker collects the fixation point coordinates and fixation duration data of the participants within the first 10 s for each group of visual elements, serving as objective physiological measurement indicators [52]. The eye-tracking measurement data are then compared with the visual element selection experiment results to verify the accuracy and scientific validity of the experimental results. Finally, by comparing the experimental data of the elderly group and the young group, the characteristics and influencing factors of visual elements that trigger active and passive visual attention selection behaviors in elderly individuals are identified.

4. Results

4.1. Data Analysis

Through quantitative research, the visual attentiveness and visual selection factor ratings of the two groups of participants were analyzed. The average values and standard deviations of the attentiveness and selection factors for the two most visually attention-grabbing samples in each group of visual elements were calculated. The results indicate that the experimental data are relatively stable, with standard deviations ranging from 0.8 to 1.2.

5.

Evaluation of Factors Influencing Visual Attention in Page Layout Selection

According to the statistical results (

Table 7. Descriptive statistical analysis table of experiment results.

Experiment	Group	Influence Factor	Average Value	Standard Deviation	Skewness Coefficient	Kurtosis Coefficient
Page layout	Elderly	P11	3.4250	1.04655	0.664	0.464
		P12	3.6000	1.05076	0.861	1.269
	Youth	P12	3.1000	0.87560	0.708	0.132
		P13	4.2000	0.83246	0.134	0.192
Brand color	Elderly	P24	2.4250	1.06698	0.780	0.625
		P23	3.1000	1.06698	0.992	0.072
	Youth	P23	2.3000	1.02485	0.743	0.886
		P22	3.5000	1.08856	0.300	1.234
Focus style	Elderly	P33	2.3250	1.09545	0.878	0.512
		P32	4.3000	1.03749	0.512	0.992
	Youth	P32	3.9500	0.89598	1.094	1.122
		P31	2.8500	1.10201	1.068	1.074
Text size	Elderly	P44	3.5750	0.98886	0.285	1.025
		P43	3.7000	1.01749	1.232	0.797
	Youth	P42	4.0000	0.94281	0.595	0.687
		P41	2.8000	1.05293	0.518	0.244

and

Table 8. Descriptive statistical analysis table of group differences including influence factors.

Experiment	Influence Factor	Group	Average Value	Standard Deviation	Skewness Coefficient	Kurtosis Coefficient
Page layout	Visual sensitivity	Elderly	2.9375	1.08183	0.019	1.311
		Youth	1.5500	1.05006	0.362	0.265
	Personal habits	Elderly	3.3750	1.04380	0.890	1.287
		Youth	3.6000	1.01389	0.327	0.283
	Personal memory	Elderly	2.1875	0.85000	0.564	1.091
		Youth	2.9000	1.05237	0.945	0.056
	Personal knowledge	Elderly	1.1250	0.80000	0.665	0.092
		Youth	4.3500	1.03999	0.823	0.003
	Personal emotions	Elderly	1.3125	1.10900	0.781	0.351
		Youth	2.0500	0.99868	1.380	0.476
Brand color	Visual sensitivity	Elderly	1.7500	1.19099	0.448	0.824
		Youth	1.5500	1.09097	1.003	0.236
	Personal habits	Elderly	1.3750	0.81914	0.580	0.564
		Youth	1.6500	1.06803	0.852	0.776
	Personal memory	Elderly	1.6250	1.14746	0.425	0.599
		Youth	1.8500	1.02441	0.516	0.703
	Personal knowledge	Elderly	1.0625	0.85000	0.665	0.092
		Youth	3.7500	0.80278	0.460	0.890
	Personal emotions	Elderly	3.0625	0.79189	1.091	0.698
		Youth	2.5000	1.07017	0.534	0.882
Focus style	Visual sensitivity	Elderly	3.1875	0.83371	0.756	0.558
		Youth	2.1000	1.08324	0.730	0.742
	Personal habits	Elderly	2.3750	0.81022	0.894	0.010
		Youth	2.9000	0.88612	0.721	0.333
	Personal memory	Elderly	1.5000	1.09545	0.927	0.391
		Youth	3.2000	0.87332	0.639	0.683
	Personal knowledge	Elderly	1.1250	0.80000	0.665	0.092
		Youth	2.9500	1.06808	1.082	0.464
	Personal emotions	Elderly	1.1250	0.84157	0.489	0.509
		Youth	1.3500	0.84516	0.302	1.263
Text size	Visual sensitivity	Elderly	2.3125	0.86208	0.444	1.108
		Youth	1.2000	0.89443	1.161	0.734
	Personal habits	Elderly	3.1250	0.80783	0.605	0.391
		Youth	3.4250	0.89578	0.355	1.035
	Personal memory	Elderly	1.4375	1.09354	0.564	1.091
		Youth	2.1000	0.84732	0.487	0.884
	Personal knowledge	Elderly	1.1250	0.81000	0.092	0.665
		Youth	2.7500	1.00955	0.346	0.015
	Personal emotions	Elderly	2.0625	1.03659	0.259	1.049
		Youth	2.2000	1.08145	0.612	0.820

), there are significant differences between the two groups of participants in their selection of page layouts. The elderly group mainly selected the experimental samples P12 and P11, influenced primarily by personal habits, visual sensitivity, and personal memory. Participants in the elderly group pointed out that the list layout of P12 aligns with their top-down information reading habits and matches the layout of product listing pages on shopping platforms they are familiar with. Although the enlarged product images in P11 strongly attracted their visual attention, the elderly generally believed that the card layout of P11 was not conducive to efficiently finding target products;

6.

Evaluation of Factors Influencing Visual Attention in Brand Color Selection

According to the statistical results (Table 7 and Table 8), there are significant differences between the two groups of participants in their selection of brand colors. The elderly group mainly selected samples P23 and P24, primarily due to personal emotional needs, as these samples matched their personal color preferences. The young group mainly selected samples P22 and P24, believing that cool colors such as green and blue are more suitable for fresh products. This choice was largely influenced by their personal knowledge background, leading to their visual selective attention toward brand colors;

7.

Evaluation of Factors Influencing Visual Attention in Focus Style Selection

According to the statistical results (Table 7 and Table 8), there are significant but relatively small differences between the two groups of participants in their selection of focus styles. The elderly group primarily selected samples P32 and P33, believing that these experimental samples matched the tag styles of their everyday shopping platforms. The young group mainly selected samples P32 and P31, primarily considering their knowledge background. They believed that the focus style of sample P32 better aligned with the visual cognitive mechanisms of people;

8.

Evaluation of Factors Influencing Visual Attention in Text Size Selection

According to the statistical results (Table 7 and Table 8), there are significant differences between the two groups of participants in their selection of text size, although the primary selection factors are the same for both groups. The reason for their choices is that the selected text size matches the font size they commonly use for reading on their mobile phones. The elderly group avoided selecting P45 due to age-related psychological and safety concerns. They typically suffer from presbyopia and need to maintain a certain distance to read clearly, thus preferring not to have overly large fonts on the interface to prevent privacy leakage. They also believe that larger fonts highlight their age and prefer to reduce text size as long as visual clarity is maintained.

To verify the relationship between elderly participants’ choices of visual elements and the influencing factors of visual attention, a Pearson correlation analysis was conducted using SPSS 26. At a significance level of <0.05, ** indicates a very significant correlation, * indicates a generally significant correlation, and the rest indicates no significant correlation [53].

According to the statistical results (

Table 9. Sample correlation analysis results.

Experiment	Pearson Coefficient	Factors Influencing Visual Selective Attention
Name	Sample	Visual Sensitivity	Personal Habits	Personal Memory	Personal Knowledge	Personal Emotions
Page layout	P12	0.353	0.976 **	0.409	0.308	0.353
	P11	0.539	0.960 **	0.318	0.289	0.539
Brand color	P23	0.781 **	0.790 *	−0.309	0.436	0.781 **
	P24	0.881 **	0.815 *	0.833 *	0.214	0.881 **
Focus style	P32	0.662 *	0.638 *	0.031	0.331	0.370
	P33	0.503 *	0.665 *	0.393	0.276	0.314
Text size	P43	0.370	0.948 **	0.361	0.243	0.662 *
	P44	0.314	0.803 *	0.284	0.028	0.503 *

* Significant at p < 0.05. ** Highly significant at p < 0.05.

), it was found that the elderly are most influenced by page layout in their selection of visual elements, especially with the P12 sample. The choice of P12 is influenced by multiple factors such as sensitivity, habits, memory, knowledge, and emotions. In terms of brand color, emotional needs play a crucial role, while habits and visual sensitivity are the main influencing factors for text size and focus style. Additionally, the elderly’s visual attention to page layout, color, and text size is higher than to focus style.

4.2. Comparison of Results

Throughout the experiment, an SMI ETG 2w eye tracker (SensoMotoric Instruments, Teltow, Germany) was used to collect the fixation point coordinates and fixation duration data of participants within the first 10 s of selecting each group of visual elements. These data were used to measure the participants’ visual attentiveness to individual experimental samples [54]. The number of fixation points is proportional to the selection tendency, and the fixation duration is proportional to the degree of attraction. Therefore, a combination of these two eye-tracking data metrics can assess the participants’ attention to the experimental samples. By analyzing the eye-tracking data of the two groups of participants (

Table 10. Eye movement data processing results.

Group	Influence Factor	Sample	Average Attention Points	Average Attention Time (ms)
Elderly group	Page layout	P12	10.5	318.6
		P11	9.1	270.9
	Brand color	P23	8.9	291.6
		P24	2.3	242.1
	Focus style	P32	9.5	291.3
		P33	3.5	248.3
	Text size	P43	8.1	267.6
		P44	6.4	253.3
Youth group	Page layout	P13	15.6	241.2
		P12	10	169.2
	Brand color	P22	11.3	230.6
		P23	10.8	203.5
	Focus style	P32	11.2	203.7
		P31	7.6	207.5
	Text size	P42	15.2	297.6
		P41	8.9	212.5

), it was found that the eye-tracking measurement data corresponded with the selection results for each group of visual elements. The elderly group had higher average fixation points and a longer average fixation duration for the page layout visual elements compared to other groups, indicating that the elderly have the highest visual attentiveness to page layout. When compared with the young group, the young group had higher average fixation points for each visual element but a lower average fixation duration. In contrast, the elderly, due to limited visual attention, exhibited lower attention-switching efficiency but higher visual attention duration.

4.3. Experimental Summary

Based on the comparative analysis of the visual element selection experiment results and eye-tracking measurement data, the characteristics of visual elements that trigger active and passive selection behaviors in elderly individuals’ visual attention were summarized (

Table 11. Characteristic description of the interface interaction and aging interaction elements.

Influence Factor	Legend	Description
Page layout		Information summarized in cards Top-down list layout Aligned with viewing habitsFacilitates easy comparison
Brand color		Fresh and clean Natural and comfortable Gentle and non-irritatingFocus on visual experience
Focus style		Background color, red emphasis Aligned with key information retention Clear and affirmative visual experience
Text size		Font size appropriately enlarged Ensures visual clarity and information security Information hierarchically and sectionally displayed Reduces reading strain and visual fatigue

). These findings provide a foundation for summarizing the visual principles for designing fresh food e-commerce interfaces suitable for the elderly, which will be discussed in the following sections.

4.4. Design Strategies

Based on the visual selective attention mechanisms of elderly users and the conclusions drawn from the visual element selection and eye-tracking experiments, the following five design strategies are proposed for optimizing fresh food e-commerce interfaces for elderly users:

9.

Categorized Information Cards to Improve Visual Selection Efficiency:

Implementing information card categorization in internet product design establishes a clear information framework, facilitating a smooth and efficient interaction experience for elderly users. Clearly categorized information and ample white space are more likely to attract the visual attention of elderly users and reduce their cognitive load. In age-friendly design, similar information can be integrated into card formats, making it easier for elderly users to locate target information and enhance selection efficiency;

10.

“Top-Down” Layout Structure to Align with Reading Habits and Optimize Interaction Experience:

Elderly users prefer vertically arranged information lists and dislike crowded and complex page layouts. Given that the way elderly users hold and operate their phones differs from that of younger users [55], adopting a top-down layered single-column list layout with whitespace and right-side hot zone design is more effective in capturing their visual attention and optimizing the interaction experience;

11.

Emotional Implications of Color to Guide User Behavior:

The color choices of elderly users are influenced by individual emotions and memories. Design should consider the consistency of colors with their emotional experiences to ensure that color expression aligns with user perceptions. Interface elements can leverage the emotional expression function of color, such as using warm tones to highlight important information, thereby guiding the attention of elderly users;

12.

Clear and Appropriate Text Information:

Elderly users prefer sans-serif fonts of moderate thickness, with 18 px being a commonly favored choice. Fonts should be simple and easy to read, using language that is understandable to elderly users. Additionally, maintaining font consistency is crucial, avoiding the use of too many different font styles on the same interface;

13.

Focus Styles to Guide Elderly Users Toward Targets:

Elderly users concentrate more on task-related information [56]. Interactive interfaces should use prominent visual guidance to help them effectively execute tasks. The design should employ clear visual guidance methods, such as background color changes, highlighting, and enlargement, to assist elderly users in efficiently completing tasks, building trust, and directing visual attention.

5. Discussion

5.1. Discussion of Research Results

H1: “ There exists a cognitive mechanism underlying the visual selective attention of elderly users.” This study comprehensively validates the hypothesis through a literature review, field surveys, and in-depth analysis of visual physiological characteristics, visual attention features, and active-passive interaction behaviors. The cognitive mechanisms of elderly users in this context have been identified across five dimensions: visual sensitivity, personal habits, personal memory, knowledge experience, and emotional needs. This comprehensive analysis lays the foundation for the subsequent extraction of visual selective attention elements and the construction of an age-friendly design model for fresh food e-commerce interfaces, thereby fully confirming the hypothesis of H1.

H2: “Hypothesis: Certain design strategies can significantly improve the user experience of elderly users on fresh food e-commerce interfaces, meeting their visual needs and attention characteristics.” This study combined visual element selection experiments with eye-tracking measurements to identify the visual elements that trigger both active and passive selection behaviors in elderly users. The characteristics and influencing factors of these visual elements were derived through the experiments. By processing and analyzing the experimental data, the study summarized design strategies for age-friendly fresh food e-commerce interfaces. To verify the practical application and reference value of the proposed design strategies, a qualitative research and experimental data analysis approach was adopted. This was further validated through a practical application, incorporating theoretical insights into the design practice of the “One Day Three Fresh” product (Figure 3).

In designing the brand color scheme, particular attention was given to the use of blue, considering that elderly users often experience challenges distinguishing this color due to age-related visual sensitivities [57]. To address this, high-contrast blue elements with larger surface areas were selected to enhance visibility and ensure these design elements effectively capture and retain attention. This approach aligns with best practices identified by Pereira, Martins, and Brandão (2022), which emphasize the importance of balancing color visibility with user-specific visual needs [58]. By following these guidelines, the design seeks to make blue a functional and accessible color choice for elderly users, supporting overall usability in age-friendly interfaces.

Through usability testing of fresh food e-commerce products, the differences before and after age-friendly design were comprehensively examined, including task completion time, subjective user experience ratings, and eye-tracking visual trajectory data. The experiment was divided into two rounds, with five participants in each group testing “One Day Three Fresh” and “Hema Fresh”, respectively. Participants were required to purchase products on two different e-commerce interfaces, performing tasks across five pages: homepage, product listing, product details, shopping cart checkout, and order confirmation. The recorded metrics included task completion time, user ratings, and eye-tracking data. After completing the tasks, participants rated the usability of each fresh food e-commerce product interface using a five-point Likert scale, covering aspects such as interaction flow, page layout, brand color, text readability, and focus style. The experimental results (Figure 4 and Figure 5) indicate that elderly users exhibited shorter task completion times, higher task completion rates, and higher usability and satisfaction scores on the “One Day Three Fresh” interface. The age-friendly design showed significant improvements in page layout, brand color, and text readability, while there was relatively less improvement in focus style. Eye-tracking results supported this finding, showing that the “One Day Three Fresh” interface better captured the visual attention of elderly users. The combined experimental and eye-tracking data confirmed the effectiveness of the age-friendly design of “One Day Three Fresh.” Additionally, according to the correlation analysis in

Table 12. Correlation analysis results.

Pearson Coefficient	Scoring of Each Element
Usability	Use Flow	Page Layout	Brand Color	Focus Style	Text Size
4.10	0.342 **	0.401 **	0.298 **	0.312 **	0.336 **

** Highly significant at p < 0.05.

, the user satisfaction ratings for the four visual elements of “One Day Three Fresh” were significantly correlated with usability scores, further validating the effectiveness of the age-friendly design principles and proving the hypothesis of H2.

5.2. Hypothesis Verification and Implications

The research results confirmed the hypothesis in H1, demonstrating that elderly users exhibit cognitive mechanisms of visual selective attention on fresh food e-commerce product interfaces. This indicates that their attention behavior is not random but guided and influenced by cognitive mechanisms. For design, this means that interfaces can be tailored to match the cognitive mechanisms of elderly users, making them more attuned to their attention characteristics and thereby improving product usability.

Regarding H2, this study integrated visual selective attention theory with visual element selection experiments, eye-tracking measurements, and quantitative theoretical analysis to develop age-friendly design strategies for fresh food e-commerce product interfaces. The “One Day Three Fresh” interface achieved significant improvements in user experience for elderly users compared to “Hema Fresh”, particularly in page layout, focus style, brand color, and text size. This provides strong empirical support for age-friendly design, showing that improving visual design elements can significantly enhance the user experience of elderly users on fresh food e-commerce interfaces. Designers can apply these findings to other fresh food e-commerce products or internet products to improve usability for elderly users, meeting their visual needs and attention characteristics.

The results underscore the guiding role of cognitive mechanisms in the attention behavior of elderly users and demonstrate that appropriate design strategies can significantly enhance their user experience. This provides guidance for future age-friendly design research and practice, highlighting the importance of personalized design and cognitive psychology in better meeting the needs of elderly users and improving product usability and user satisfaction.

6. Conclusions

This study aims to optimize age-friendly design for fresh food e-commerce interfaces using the theory of visual selective attention, enhancing the user experience for elderly users. The research summarizes the visual selection characteristics of elderly users, refines design strategies, and validates their effectiveness through experiments.

Results from eye-tracking experiments indicate that the optimized interface significantly reduces task completion time for elderly users by 39.62% and increases user satisfaction by 60%. These findings demonstrate that the optimized interface enhances both efficiency and satisfaction, validating the application value of visual selective attention theory in age-friendly design. Furthermore, this study proposes an age-friendly design model that includes optimizations in page layout, brand color selection, and font size adjustments, effectively promoting visual selection efficiency for elderly users on fresh e-commerce platforms.

Despite these achievements, there are limitations that need to be addressed in future research. First, this study focused on a specific platform, which limits the generalizability of the findings. While the design strategies proposed are applicable to other e-commerce platforms, the specific needs of different platforms may vary. Therefore, future research could explore how these strategies apply across diverse e-commerce platforms, particularly in different product categories and user demographics. Additionally, the study was conducted with a specific user group (elderly users), and future research could investigate how these design strategies apply to more diverse user groups, such as elderly users from different cultural backgrounds or regions. This would contribute to understanding how cultural differences influence age-friendly design and could provide valuable insights for developing global accessibility standards.

While this study highlights the emotional and psychological associations of color preferences among elderly users, it acknowledges the inherent subjectivity and individual variability in color perception. Future research could explore how elderly users from different cultural or geographical backgrounds respond to various color schemes, refining universal design principles while allowing for context-specific adaptations. In practice, the development of adaptive user interfaces that allow for personalized color theme adjustments could be beneficial.

Finally, future studies could explore a more integrated approach that combines WCAG standards with findings from visual attention experiments. This would enable the development of comprehensive design guidelines that address both general accessibility requirements and the specific needs of elderly users, particularly in visually intensive and interactive fresh e-commerce platforms. Additionally, integrating long-term usability tests could help capture how user preferences evolve over sustained interaction with interfaces, further improving the robustness and inclusivity of these design strategies.

Additionally, future studies could explore a more integrated approach that combines WCAG standards with findings from visual attention experiments. This would enable the development of comprehensive design guidelines that address both general accessibility requirements and the specific needs of elderly users, particularly in visually intensive and interactive fresh e-commerce platforms.