UX and accessibility improvements

---

title: UX and Accessibility Improvements - Readability of State, Rules, and User Sessions author: Kotmin - PJT created: 2026-04-09 updated: 2026-04-09

Description

User Story

As a player, I want to have clear information about the session state (whether I am logged in), game rules, and the readability of elements (card colors), so I don't waste time guessing and avoid mistakes due to ambiguity.

---

Context and Problem

Current Issues

• Lack of constant, clear information that the user is logged in (missing "Hi, username" element)
• Rules regarding cards (e.g., requirement of 4 cards of the same color) are not sufficiently clear
• Card colors may be difficult to distinguish (lack of accessibility support)
• No option to undo the "draw 2 cards" action despite no state change

Why This is a Problem

• The player loses orientation (whether they are logged in, what they can do)
• Unclear rules lead to frustration and wrong decisions
• Lack of accessibility limits the game's availability
• Lack of undoing simple actions reduces the sense of control

---

Solution

A set of UX improvements focused on readability and control:

• Constant UI element: "Hi, username" + logout option (visible globally)
• Accessibility mode for cards: ability to display color names on cards (toggle in settings)
• Clarification of rules:
  • When requiring "4 cards" without specifying color - a message indicating that it refers to 4 cards of the same color
  • Visual support (tooltip/hint during action)
• Ability to cancel the "draw 2 cards" action as long as the game state has not changed

---

Key Principles

• Minimal interference with the game flow - changes should support, not slow down
• Readability > aesthetics (especially in accessibility mode)
• Information should be available in context (where needed)

---

Acceptance Criteria

• [ ] Globally visible element "Hi, {username}" when the user is logged in
• [ ] Next to the username, the action "Logout" is visible
• [ ] Option in settings: "Show card color names" (default OFF)
• [ ] When the option is enabled, each card displays the color name (e.g., "red")
• [ ] When attempting to play cards, the UI clearly communicates the requirement: "4 cards of the same color"
• [ ] Tooltip or hint appears in the context of action selection
• [ ] After selecting the "draw 2 cards" action, the player can cancel the action until the first state change occurs
• [ ] Cancellation is not possible after revealing new cards or any other change in the game state