Skip to main content

Second Screen

Over 30% of Overwolf users have multiple screens and is often unused during gameplay. This creates a great opportunity to enhance user experience and increase engagement without disrupting the game. Since many users keep the second screen open throughout gameplay, you can leverage it for better monetization by boosting ad visibility leading to more revenue.

Types of second Screens and when to use them​

  • Main window (Typical size)—similar in size to a desktop window. It’s ideal for displaying extensive information or large item lists. This window also provides better monit options (i.e., larger ad placements).
  • Companion screen (Compact Size)—this is a smaller, more condensed window and is best used for displaying limited yet essential information. without overwhelming the user.
  • Multi-app screens—multiple windows in your app can display specific types of data. When you display multiple windows on a second monitor you make more content accessible at the same time providing more monetization opportunities and increased content visibility. Keep in mind that:
    • Users cannot interact with this screen during gameplay, so ensure all the content is viewable at a glance.
    • Excessive content may feel overwhelming or spammy to users, so prioritize value-driven information.

Building a second window experience is just as simple as creating a normal window which communicates with GEP and has a transparent background window.

Accessibility and customization​

Accessability and customization of your app on a second screen is important. Use the following guidelines:

  • Second screen windows should launch automatically.
  • Second screen windows should include a hotkey or a close button at the top.
  • Allow users to adjust screen size for comfort and flexibility. If resizing isn't supported, design the window to fit the most common screen sizes, using 1920X1080 as the default.
  • Enable hotkey support for quick toggling.
Recommendation

Implement second-screen functionality early in the development of your app. This will help if you want to add monetization options later in your app's lifecycle.

Second screen guidelines​

When building the second screen window, follow these rules:

  1. Set the keep_window_location flag to true.

  2. Set the desktop_only flag to true.

  3. We recommend you set native_window flag to true.

  4. If your native window runs as a second screen with the game, make sure to set the disable_hardware_acceleration in your manifest.json. It improves the performance of the game by reducing usage of the GPU while you are playing.

  5. Identify which screen is the secondary one, and display the secondary window on that screen. Use the getMonitorsList() function for that. Do the calculation for exactly where you should display your window if you already know the screen resolutions.

  6. Take advantage of the GameInfo objects. They contain monitorHandle and windowHandle. Usage example: identify that the user moved the game window to the secondary screen.

  7. Use the transparent background window to share data and have your app windows communicate.

Second Screen Example

For a second screen implementation example, see the Second Screen Example from our GitHub repo.