How to navigate the front-end?

• What is the front end?

• Side Navigation

• Page Menu

• Navigation bar

• User Menu

The front end is the publicly accessible website built with the Games2gether platform. This includes hubs for each of a Studio’s Universes with a page for each enabled feature. When they first visit the front end, users can register for an account. Registered users can interact with a Universe through the front end.

The Side Navigation is the front end’s main navigation menu. It is a collapsible menu located on the left-hand side. When collapsed, the menu is a thin vertical bar with a series of icons. 

The collapsed menu has an icon for each recommended Universe. Hovering over a Universe icon will display that Universe’s submenu. Clicking on an icon will take you to that Universe’s home page.

The icons of legacy Universes are nested below an arrow. Clicking on the arrow will show legacy Universe icons.

Hovering over a Universe icon in the collapsed Side Navigation displays a submenu.

The Side Navigation can be expanded by clicking on the arrow icon at the top of the collapsed menu. Clicking on the same icon when the Side Navigation is expanded will collapse the menu.

The arrow icon that can expand or collapse the Side Navigation is highlighted in dark blue on the left.

When the Side Navigation is expanded, a Universe submenu can be accessed either by hovering over a Universe name or by clicking on the Universe name.

Here, a Universe submenu has been expanded by clicking on the Universe name.

Note: A Universe submenu can include external links, such as a wiki or shop link. External links are indicated by an icon.

The page menu is a horizontal menu on all Studio or Universe pages. It sits below the header image.

A Universe’s page menu is made up of the same links as the Universe’s Side Navigation submenu. This includes links to feature pages and any added external links.

A Studio’s page menu has links to each of its Universe’s home pages.

The page menu on a Universe’s home page is highlighted in dark blue.

Note: The landing page does not have a horizontal page menu.

The navigation bar is a static menu at the top of a G2G site. Central to the navigation bar is the search bar. Typing a keyword in the search bar and hitting enter will search for that keyword across all Universes.

When a registered user is logged in, their avatar and name can be found to the right of the search bar. Clicking on the user’s name or avatar will open the user menu.

The navigation bar is highlighted in dark blue.

The user’s total number of G2G points is displayed next to the user’s name. Clicking on the number of points will open the Studio’s leaderboard.

The rightmost three icons are helpful shortcuts to the user’s profile page.

The gift icon in the navigation bar links to the “Rewards” page of the user’s profile.

Clicking the gift icon leads to the “Rewards” page. When a user is able to claim new rewards, the number of new rewards will appear at the bottom of the icon.

The envelope icon in the navigation bar links to the user’s inbox.

Clicking the envelope icon leads to the user’s inbox. The number of unread messages in the inbox will appear at the bottom of the icon.

The dialogue bubble icon in the navigation bar links to the user’s feed.

Clicking the dialogue bubble icon leads to the user’s feed. When a user has new notifications, the number of new notifications will appear at the bottom of the icon.

The user menu is a dropdown menu where users can find the settings page and their profile. A registered user can access the user menu by clicking on their avatar and name in the navigation bar.

An example of a button with the user’s avatar and name which opens the user menu is highlighted in dark blue.

From the user menu, users can access:

• Their profile, which includes their rewards, inbox, and interactions

• The leaderboard, which displays where the user ranks relative to other users

• The settings page, from which users can update their information and link other accounts

• Cookie controls, where users can change their cookie settings

• The logout button