Overwolf

Overwolf

  • Getting Started
  • Docs
  • API
  • Events Status
  • Blog
  • Q&A
  • Support

›Build Your First App

Getting Started

  • Getting started
  • App Creation process
  • SDK Introduction
  • Using our dev tools
  • Game compliance principles
  • Submit app proposal

Build Your First App

  • The Basic Sample App
  • Sample App Components
  • UX/UI Best Practices
  • Overwolf UI Components

Test Your App

  • App testing basics
  • Technical checklist
  • Product checklist
  • Marketing checklist
  • Community alphas

Submit Your App

  • App submission basics
  • Custom Installer

Monetize with Ads

  • Monetization overview
  • Ads Monetization Basics
  • Ads SDK overview
  • Configuring your Ads
  • Managing Ads
  • Current Ads SDK

Monetize with Subs

  • Subscriptions overview
  • Subscriptions user flow
  • Integrate subscriptions
  • Request an app plan

Maintain Your App

  • Submit an app update
  • Set app status
  • Support Your Users
  • App Knowledge base
Edit

Sample App Components

You can download the latest version from our GitHub here, and read how to setup it here.

You will find several files and folders in the sample app repository:

  +---- css
  +---- img
  +---- windows
  +---- icons
  +---- odk-ts
  +---- types
  +---- manifest.json
  +---- consts.ts
  +---- package.json
  +---- tsconfig.json
  +---- webpack.config.js

manifest.json

The manifest file is responsible for describing the different aspects of your app. This is a mandatory file for all apps and has to be present in the root folder for your app to function.

In our manifest.json file, we have {start_window:background} defined.
This sets our background window as the app's starting point.

All of this app's windows' properties can be found under the windows object.

windows

Each app window is based on an HTML file. This folder contains these files for each of your pages.

windows/background

The background folder holds the background window, which serves as the application's starting point and window orchestrator.
The window's run() method detects whether a Fortnite game is currently running, decides which window to launch accordingly, and listens for changes.

The background window has no visual representation, which can be gleaned from the empty background.html file or from the {is_background_page:true} property the background window has in our manifest.json.

tip

You can read more about the background controller concept in our Communicating between windows guide.

windows/in_game

The in_game window listens to Info Events and Game Events emitted by the game. Furthermore, it defines the behavior for the show/hide hotkey.

Read all about hotkeys here.

windows/desktop

This window serves a purely visual purpose and has no special logic.

windows/AppWindow

This is a base class that holds the logic shared by the in_game and desktop windows, such as minimize/close, drag, etc.

types package

Currently, the Overwolf SDK is written in javascript. The type definition file holds typescript type definitions for the SDK methods used in this app.

We released the types file as a npm package, and the sample app used this package.

icons

Mandatory files showing up in the Overwolf dock and other locations:
Tile.jpg, IconMouseNormal.png, IconMouseOver.png, desktop-icon.ico.

css and images

All of the visual resources used by the app.

Last updated on 10/24/2021 by eransharv
← The Basic Sample AppUX/UI Best Practices →
  • manifest.json
  • windows
    • windows/background
    • windows/in_game
    • windows/desktop
    • windows/AppWindow
  • types package
  • icons
  • css and images
  • Legal
    • Terms overview
    • Developer's terms
    • App terms
    • Overwolf terms
    • Overwolf Privacy policy
  • Support
    • Questions and Answers
    • Discord
    • Slack
    • Facebook
    • Twitter
  • Documentation
    • Changelog
    • API
    • App Creation Process
    • Best Practices
    • Game Events status
  • Information
    • Careers
    • Fund
    • Developers Blog
    • Overwolf Appstore
    • Advertise on Overwolf
Overwolf 2022