Essay 1

As society is rapidly transitioning into a fully digitalised future the importance of User Interface (UI) and User Experience (UX) is becoming increasingly important. Not only is this because of usability and accessibility, in their own right, but also because of the ethical implications they may have. As the reach of technology continues to expand, developers are continually needing to redefine and re-enforce ethical UX and UI design. Nexus Hub is a South African website dedicated to gaming, collectibles, and general pop culture. While there exists a physical Nexus Hub store in Randburg, Nexus Hub's online website offers not just a retail section, but also game/movie reviews, community forums, news articles and chatrooms. Despite Nexus Hub's engaging visuals, interactive elements and community features, the site is riddled with several UI and UX design flaws affecting both usability and user trust. These include overcrowded layouts, duplicated navigation icons, hidden pricing and general inconsistencies in how users interact with the website. In terms of shopping sites like Nexus Hub, UI and UX directly affect the user's experience, business outcomes, and ethical interactions. Poor design decisions can lead not only to less site traffic and a lower profit, but also to frustration and distrust from customers. This is particularly important in situations where users may be pushed towards more expensive purchases due to difficulties in navigation and hidden prices. In this essay I will critically analyse the UI, UX and ethics of Nexus Hub's interaction design by exploring its general interface, usability, accessibility, as well as its ethical implications.

General Interface and Visual Design

Nexus Hub has a polished and minimalist black-and-white aesthetic that creates a strong visual contrast, improving visibility and basic accessibility-especially for users who may be visually impaired. The site uses a sans serif font which has a balanced weight and width, and most text is written in bold block capitals, which further enhances readability for users with dyslexia or visual impairments. Despite these positive elements, the overall layout feels chaotic and overcrowded. While the use of gaming and general pop-culture imagery to showcase products and events is appealing, the staggering amount of content can easily overwhelm a first-time visitor. The site does keep to a consistent visual style across its many webpages, but each page suffers from similar issues: overcrowding and cluttered design. According to (Norman, 2013), effective design should emphasise clarity and intuitive interaction, something that is compromised by visual overload. Additionally, (Krug, 2014) states that visual hierarchy is key to guiding users through content smoothly, and this is often disrupted by excessive competing elements. Overcrowding and cluttered visual elements are the two primary issues Nexus Hub faces with its interface and visual design. One major problem is the navigation system (The primary navigation bar at the top of the screen more specifically), which extends into two stacked rows-one with six buttons and another with twelve more, many of which are vague or redundant. Categories such as 'Joker', 'Read', and 'Watch' are quite vague and not inherently self-explanatory. This not only creates visual clutter but also confuses users who may not understand the purpose of each link without visiting each tab. Additionally, important icons such as those for the user account and shopping cart appear twice-once in the top navigation bar and a second time in the side menu-creating unnecessary redundancies and confusion. These icons are also small, reducing their importance despite being a crucial element of the site's functionality. The side navigation bar appears on every webpage but is incredibly small in size-preventing users from easily finding and accessing these particular features of the site. Retail pages further complicate navigation by including their own embedded navigation bars within the main one. This nested structure makes it easy for users to overlook specific product categories, frustrating those who are trying to search for specific products. Another notable design flaw is that all the webpages allow slight horizontal scrolling to the right, which appears to be however this exposes unformatted page margins. This disrupts the site's symmetry and makes vertical scrolling more difficult for some users. The homepage carousel-which showcases 26 product releases and events-scrolls too quickly and can only be navigated using tiny pagination dots rather than intuitive arrows. This limits usability and can further induce frustration in the user. Footer links also suffer from small font size and tight spacing, making them hard to read or click on precisely. Despite these shortcomings, the site has some great features: excellent visual contrast which allows for satisfactory visibility and readability, interactive text that glows orange on hover- providing excellent feedback to the user, and large, bold fonts that also improve readability. The inclusion of community-based features like forums, chatrooms, and polls also adds value to the site by encouraging more user interaction and engagement.

Usability and Navigation

While Nexus Hub offers a wide variety of features, the site's usability is lacking-particularly for users who are casually browsing as opposed to those searching for specific pages or features. (Nielsen, 2000) highlights that users often leave a site if they cannot find what they are looking for within a few clicks. Although the search bar is easily accessible, the keyword recognition is limited, requiring users to input very specific terms and wording to receive relevant results. This can easily lead users to believe a product isn't available on the site, prompting them to exit the site completely. Reading reviews is quite straightforward, as the content is clearly laid out and well-written. However, the images accompanying these reviews are sometimes too large, which can interrupt the reading flow. The body text of these pages also stretches too far across the screen (roughly ¾ of the screen), which can make it difficult for some users to follow the lines of text comfortably-especially on wider screens. On a more positive note, the account creation process is quick and user-friendly. Input fields are clearly labelled, and the form is soft on the eyes and easily accessible. Similarly, the process of adding items to the cart and reviewing pricing is intuitive and efficient. The cart page showcases all relevant information in a clear and organised manner thereby helping users understand what they're purchasing without confusion. However, site-wide navigation remains one of the most problematic elements. Instead of simplifying the interface with dropdown menus or categorisation filters, Nexus Hub uses an excessive number of navigation buttons spread across both a primary navigation menu at the top of the screen and nested category bars. This lack of hierarchy creates a cluttered interface and makes the browsing experience more frustrating than it should be.

Accessibility Considerations

Nexus Hub's accessibility is a mix of thoughtful implementation and easily recognisable oversights. The Web Content Accessibility Guidelines (WCAG) 2.1 set forth by ((WAI), 2018) recommends that alternative text be used for all visual media to ensure full navigability using keyboards. The site supports screen magnification effectively, allowing for the layout structure and readability to be maintained even when zoomed in closely. Keyboard navigation is also functional, allowing users to move between elements without a mouse-an essential feature for users with mobility impairments. However, accessibility features such as alt text for images are almost entirely missing, and tooltips are inconsistently attached across the site to the point where there is very little purpose for the existing elements with tooltips and alt text. This creates challenges for screen reader users, who need these elements to experience the visual content. Additionally, most of the webpages are cluttered with tightly packed small text that can be difficult to read for users with visual impairments or cognitive processing issues. Surprisingly, the mobile and tablet versions of the site have a more accessible experience overall. The reduced content and simplified layout help remove the overwhelming nature of the desktop layout. In fact, the site arguably performs better on mobile, as users are guided toward fewer, more focused interactions.

Ethical Implications

The design of Nexus Hub creates several ethical concerns, particularly with regards to transparency and user agency. (Gray, 2018) describes dark patterns as deceptive design strategies that exploit cognitive biases, often leading users to make unintended decisions. This undermines user trust and violates ethical design principles. One of the most notable deceptive design strategies on the site is the hidden pricing since product prices are only visible when a user hovers over an item. This design choice can be misleading, as users may overlook cheaper options simply because they aren't immediately visible. In a shopping/commercial context, this borders on manipulative design, pushing users toward unintended or higher-priced purchases. Overcrowded navigation also plays a role in decreasing user agency. With redundant links, duplicated icons, and inconsistent layout patterns, users may struggle to find what they're looking for or even believe certain items aren't available on the site. This confusion can lead to frustration and decreased trust in Nexus Hub-especially if users feel that they've been led to certain products through overwhelming or inefficient navigation rather than free choice and their own research. Ultimately, the inconsistent use of accessibility tools (such as alt text and tooltips) provides a barrier to potential customers with visual impairments form accessing the site. Ironically, the site performs better on mobile, which unintentionally improves accessibility for some users. Although these improvements are somewhat limited, the text is larger, and the overall site seems less cluttered. The lack of seemingly deliberate accessibility planning suggests that inclusivity was not a main concern during the design process. In today's digital age, ethical design is not just about avoiding harm but actively supporting fair and transparent user experiences. Nexus Hub's current layout and interaction choices reveal a need for more ethical and user-centred design practices.

Conclusion

Nexus Hub is a site that clearly caters to its target audience, but it struggles with several UI and UX design choices-some of which can border on being ethically harmful. While these issues may not be innately obvious, their impact can be significant for both the users and owners of Nexus Hub alike. Users may experience frustration due to confusing navigation, face accessibility challenges due to poor layout and small text and even suffer financial consequences through manipulative design elements like hidden pricing. Whilst ethical design should be integral to every site on the internet, there are more substantial implications with regards to e-commerce sites. Sites that can be accessed by anyone that also require entering sensitive information have a stronger need for top-quality UX and UI. Failure to do so could lead to potential clients could losing faith in the website - or even lead to legal injunctions. A suggestion I would pose as a potential improvement would be to make better use of the space. Simplifying page layouts by reducing the number of competing banners and calls-to-action. This would be anchored by streamlined navigation - such as a drop-down menu or hamburger menu A cleaner design would allow for visible pricing, larger text and icons, and a clearer hierarchy of information. Switching out the ungainly navigation buttons for cleaner dropdown menus would prevent the user from being bombarded with an unnecessary amount of information and allows for a natural discovery of the site. This would be especially poignant for those navigating the site for the first time - whilst also being attuned to those with impairments.

References

• 1. Norman, D. (2013). The Design of Everyday Things. New York: Basic Books.
• 2. Krug, S. (2014). Don't Make Me Think, Revisited: A Common Sense Approach to Web Usability. San Francisco: New Riders.
• 3. Nielsen, J. (2000). Designing Web Usability: The Practice of Simplicity. Indianapolis: New Riders.
• 4. (WAI), W. W. (2018, June 5). Web Content Accessibility Guidelines (WCAG) 2.1. Retrieved from W3C: w3.org
• 5. Gray, C. M. (2018). The Dark (Patterns) Side of UX Design. Proceedings of the 2018 CHI Conference on Human Factors in Computing Systems (CHI '18) (pp. 1-14). New York: Association for Computing Machinery (ACM).