Designing for the Middle East: Best Practices for Bilingual Gaming Websites

Designing for the Middle East: Best Practices for Bilingual Gaming Websites

In line with Saudi Arabia's Vision 2030 to become a leader in esports, the Saudi Esports Federation launched Gamers8 at Riyadh’s Boulevard Stadium. The 60-day event boasts a $45M prize pool, attracts millions of viewers, and offers a blend of gaming, live music, cultural activities, and family entertainment. The Saudi Esports Federation plans to develop a website that caters to both local and global audiences, offering event details and ticket booking.


The project presented unique challenges, including understanding Middle Eastern users’ cultural nuances and designing for both English (LTR) and Arabic (RTL) audiences. Overcoming these complexities provided invaluable insights and growth.

Here’s a closer look at the lessons I learned from this exciting journey.

Understanding eSports Gamers from Middle East

Key Demographics & Internet Usage

  • Over 60% of the Middle East’s population is under 30, making this demographic a key driver of the region's growing esports community.

  • Internet usage among esports gamers is exceptionally high, with players frequently engaging in competitive multiplayer games, streaming matches, and participating in online tournaments.

  • Saudi Arabia leads the region in esports engagement, supported by a 98% internet penetration rate, robust infrastructure, and government-backed initiatives to promote esports

  • The gaming market across the Middle East and North Africa (MENA) region is valued at $6.5 billion (2023), with a CAGR (Compound Annual Growth Rate) of 13.88%.

Cultural & Language Preferences

  • Arabic is the preferred language for esports content, including game interfaces, commentary, and promotional material, with Modern Standard Arabic (MSA) being widely understood across diverse regions.

  • Esports gamers value visuals that reflect vibrant and rich color palettes, aligning with the regional design aesthetic.

Device Preferences & Technical Considerations

  • Mobile devices dominate the esports scene, with 70–80% of internet traffic coming from smartphones, making mobile games like PUBG Mobile and Free Fire exceptionally popular.

  • Google Chrome is the most widely used browser (~80% in Saudi Arabia), making it essential for optimizing esports web platforms and streaming sites for Chrome users.

Behavioural Patterns

  • 60% of Middle Eastern internet users play video games.

  • Popular esports titles among Middle Eastern gamers include FIFA, Fortnite, and PUBG, with growing interest in titles like Valorant and League of Legends.

  • Platforms like YouTube, TikTok, and Instagram are the primary hubs for esports-related content, including live streams, match highlights, and game tutorials.

  • Online engagement peaks during evenings and late nights, with heightened activity during Ramadan and festive periods when gamers have more leisure time.


Cultural Sensitivities

  • Esports characters, skins, and promotional materials should adhere to modest attire standards, covering shoulders and knees, to respect local cultural values.

  • Avoid references to alcohol, pork, or other culturally sensitive topics in esports-related games, branding, and events.

  • Depictions of physical intimacy or suggestive content should be excluded from esports environments to maintain a family-friendly appeal.

  • Game design should minimize graphic violence while maintaining competitive appeal to align with regional norms.

  • Communication in esports should employ formal and respectful language, steering clear of humor or slang that may not resonate with the region’s cultural sensitivities.

  • Hypersexualized characters or avatars should be avoided to ensure inclusivity and respect for local sensibilities.


UX Benchmarking of Popular Saudi Websites with Arabic (RTL) and English (LTR) Support

Airbnb: Comparison of Arabic and English Versions

Amazon: Comparison of Arabic and English Versions

Visit Saudi: Comparison of Arabic and English Versions

Observations from Popular Saudi Websites

  • Most websites default to Arabic, allowing users to switch to English.

  • Websites mirror layouts from left-to-right (LTR) to right-to-left (RTL).

  • English content follows LTR alignment, while Arabic content aligns RTL.

  • Italics are rarely used in Arabic, and there are fewer font weight variations compared to English.

  • LTR layouts emphasize the top-left corner, whereas RTL layouts emphasize the top-right.

Elements to Mirror for RTL Design

Layout & Structure

  • Flip page alignment, content flow from right to left.

  • Move navigation menus to the right.

  • Adjust multi-column layouts to mirror content order.

  • Flip pagination (Next left, Previous right).

  • Place scroll bars on the left.

Typography

  • Render Arabic text right-to-left.

  • Align Arabic text to the right.

  • Adjust line spacing and text justification.

Icons & Buttons

  • Flip directional icons (arrows, progress bars).

  • Flip interface icons that represent text or reading direction

  • Mirror checkboxes and radio buttons.

  • Flip an interface icon that shows forward or backward motion

  • Mirror pagination icons.

UI Elements

  • Align buttons and links for RTL.

  • Adjust input fields and forms.

  • Place text cursor to start on the right.

Images & Visual Assets

  • Flip background and contextual images.

  • Adjust directional images (e.g., arrows).

Navigation Flow

  • Flip main site navigation (side menus, icons).

Elements to not Mirror for RTL Design

Numbers & Dates

  • Do not reverse individual numerals (e.g., “8148893735” remains unchanged).

  • Maintain standard numeral progression in percentages and progress counters.

  • Use date formats as (day/month/year).

Logos & Branding:

  • Logos and trademarks remain consistent globally without mirroring.

Images:

  • Photographs, illustrations, and general artwork are not flipped.

Graphical Elements:

  • Charts, graphs, and axes retain their standard orientation.

  • Universal signs and marks, such as directional road signs, are not mirrored.

Legal & Regulatory Text:

  • Terms and conditions, privacy policies, and other regulatory text should remain in their original alignment.

Slashes & Separators:

  • Keep slashes, hyphens, and similar separators unchanged.


Glimpses of Final Designs

The final designs of the Gamers8 website were the culmination of thoughtful research, user insights, and meticulous implementation of the principles mentioned above. Every detail was crafted to ensure the experience resonated with the diverse audience of Gamers8, from esports enthusiasts to families. Here’s how the design came to life:

Gamers8 Landing Page: English & Arabic Version



Esports Page: English & Arabic Version



Music Page: English & Arabic Version