Hi,as we know, app studio could create desktop app.is it possible to sell little desktop game create using app studio,at the windows store?how to go abt it?i hope developers here would share some insight on this route.thank in advance,tst
AppStudio creates desktop apps using Electron.
I found this on the web which may help you get started:
How to Release an Electron App on the Microsoft Store (link)
Thanks for the guidance,my app new version has not been created,will try the steps then .best rdgs,tst
Using my own expertise,I have no confidence in implementing electron app via windows store.is it possible for nsb to builtin in nsb app studio.creating a new folder below as :’windows store’,with a must have listing(label and user text box). ofustations(can’t remember the real word) is forcingly implemented.clicking a button will display the windows store setup,for user to fill in.then the windows store based electron is executed.it would be good in nsb pro folio,as now,another great accomplishments in the readme.
next step would be electron at mac store.looking forward to another high fly in nsb app studio,tst
Here is a YouTube link u might be interested https://youtu.be/4D4YOaie24k?si=-yvc5I-W-qwL30uJ
It is possible to release your NSB App Studio Electron .exe to the Windows 11 Store, but it involves several technical steps beyond just building the application. This is because the Microsoft Store requires a specific package format called MSIX for desktop applications, and your standard Electron .exe must be converted.
Here is a beginner, step-by-step guide for this process:
Phase 1: Preparation and Microsoft Developer Account
1. Create Your Microsoft Developer Account
You’ll need a developer account to submit apps to the Microsoft Store.
* Go to the Microsoft Partner Center and sign up for an individual or company developer account. There is a one-time registration fee (e.g., $19 for an individual).
*
2. Reserve Your App Name
In the Partner Center, you must reserve a unique name for your application.
* In the Partner Center, navigate to Apps and games and click New product.
* Select MSIX or PWA app (even though you start with an EXE, the Store ultimately accepts an MSIX package, and this is the recommended path for desktop apps).
* Enter and reserve a unique name for your application.
3. Get Your Product Identity Details
Once the name is reserved, save the following information—you will need it for packaging.
* Go to Product Management \rightarrow Product Identity for your reserved app.
* Copy and save the Package/Identity/Name and Package/Identity/Publisher (Publisher Display Name) values.
4. Install the Windows SDK
You will need tools from the Windows Software Development Kit (SDK) to create the MSIX package.
* Download and install the Windows SDK that matches your Windows 11 version.
Phase 2: Packaging Your Electron App for the Store
The most common way to package an Electron app for the Windows Store is using the electron-windows-store tool or electron-builder configured for MSIX, combined with the Microsoft tools. Since you already have an Electron .exe from NSB App Studio, we’ll focus on the command-line tool which is often more straightforward for conversion.
1. Configure Your Electron Project
Before packaging, make sure your Electron project generated by NSB App Studio is finalized and includes necessary assets.
* Ensure you have icon images (PNG format) in various sizes (like 44x44, 150x150, 310x150) that meet the Microsoft Store’s requirements. These are often placed in a build/appx folder in your project.
*
* Make sure your built Electron executable (the .exe and all its dependencies, often in a folder like win-unpacked) is accessible.
2. Use electron-windows-store (Recommended Command-Line Method)
This tool simplifies converting your Electron app’s distributable folder into an MSIX package.
* Install the Tool: Open your project folder in the Command Prompt or PowerShell and install the tool:
npm install -g electron-windows-store
* Run the Command: Execute the tool, replacing the placeholders with your information (use PowerShell in Administrator mode).
electron-windows-store --input-directory C:\Path\To\Your\win-unpacked_Folder
--output-directory C:\Path\To\Output\Folder
--package-version 1.0.0.0
--package-name YourReservedName
--package-display-name “Your App Display Name”
--publisher-display-name “Your Publisher Display Name”
--identity-name YourIdentityName
--assets C:\Path\To\Your\Icon\Assets\Folder
* --input-directory: Path to the folder containing your final built Electron .exe (e.g., dist/win-unpacked).
* --package-name and --identity-name: Use the Package/Identity/Name from the Partner Center.
* --publisher-display-name: Use the Publisher Display Name from the Partner Center.
* --assets: Path to the folder containing your Store-required icon images.
* Result: This process will generate an MSIX package (.msix or .appx) in your specified output directory.
Phase 3: Submitting to the Windows Store
1. Start a New Submission
* In the Microsoft Partner Center, go to your reserved app and click Start Submission.
2. Complete Submission Details
You will need to fill out multiple sections:
* Packages: Upload the MSIX package you created in Phase 2. The Partner Center will perform a validation check.
* Pricing and Availability: Set the price, distribution markets, and release date.
* Properties: Define the category, subcategory, and whether your app supports different devices.
* Store Listings: Provide all the marketing materials for your app:
* Description: A compelling summary of your app’s features.
* Screenshots: Images of your app running on Windows 11.
* Trailers (Optional).
* Keywords and other promotional items.
* Submission Options: Provide notes for the certification testers if there are specific steps they need to follow.
3. Submit for Certification
* Once all sections are complete and marked with a green check, click Submit for certification.
Microsoft will review your app for policy compliance (which can take a few days). If approved, your app will be released to the Microsoft Store!
Would you like me to find more detailed information on configuring your NSB App Studio project for the required icon assets?
That’s an excellent question! The most challenging part of submitting an Electron app to the Microsoft Store is getting the icon assets correct, as the Store requires specific sizes and a defined naming convention for the final MSIX package.
Here is a step-by-step guide on the required assets and how to prepare your NSB App Studio Electron project.
Phase 4: Preparing Microsoft Store Icon Assets
The Microsoft Store submission requires a set of distinct images, mainly PNG files, for different display contexts (Start Menu, taskbar, the Store page itself, etc.). These are the assets that are specified when you run the electron-windows-store tool (using the --assets flag).
1. The Required Icons (Minimum Set)
You need to create a folder (e.g., AppXAssets) within your Electron project containing the following PNG image files. All icons must be full-bleed (no padding) and transparent if they are not meant to fill the entire tile background.
| Icon Name | Required Size (Pixels) | Usage Context |
|—|—|—|
| StoreLogo.png | 50x50 | The primary logo for the Microsoft Store page. |
| Square44x44Logo.png | 44x44 | Taskbar and All Apps list icon. |
| Square150x150Logo.png | 150x150 | Medium size Live Tile on the Start Menu. |
| Wide310x150Logo.png | 310x150 | Wide Live Tile on the Start Menu. |
> Tip: Microsoft recommends designing your icons at the highest resolution first (e.g., 400% scale) and then generating the smaller sizes from there to ensure crispness. The 150x150 logo, for instance, should ideally be designed at 600x600px and scaled down.
>
2. Best Practice: Additional Sizes (Recommended)
While the above set is the minimum, it’s best to include assets for different display scales to ensure your app looks good on all resolutions.
| Icon Name | Additional Recommended Sizes |
|—|—|
| Square44x44Logo.png | Square44x44Logo.scale-125.png (55x55), scale-150.png (66x66), scale-200.png (88x88), scale-400.png (176x176) |
| Square150x150Logo.png | Square150x150Logo.scale-400.png (600x600) |
| Wide310x150Logo.png | Wide310x150Logo.scale-400.png (1240x600) |
| StoreLogo.png | StoreLogo.scale-400.png (200x200) |
Phase 5: Configuring NSB App Studio (Project Icon)
Your NSB App Studio project already has an icon property that defines the standard icon for your application’s executable (.exe) and the application window itself.
1. Update the Main Icon in NSB App Studio
* In the Project Properties window of your NSB App Studio project, find the icon property.
* NSB App Studio recommends a PNG file that is at least 512x512 pixels for Electron builds.
* Specify the path to a high-resolution PNG file that you want to use as the main application icon. This is often used by the Electron packaging tool (like electron-builder or the internal NSB tool) to generate the standard Windows .ico file embedded in the final .exe.
2. The Relationship Between App Studio and the MSIX Package
* NSB App Studio primarily uses its internal settings (like the icon property) to generate the standard Electron executable and its contents (your win-unpacked folder).
* The Microsoft Store assets (Phase 4) are NOT automatically generated or handled by the NSB App Studio build process, as they are specific to the MSIX format.
* You must therefore manually create these specific, named PNG files (e.g., Square150x150Logo.png) and point the electron-windows-store command (Phase 2, Step 2) to the folder containing them using the --assets flag.
In summary:
* NSB App Studio icon property \rightarrow Controls the icon for the final .exe and the app window.
* Manually created PNG files \rightarrow Used by the electron-windows-store tool to create the MSIX package required for the Store listing.
Would you like to move on to the next step, which involves setting up the development environment (like Node.js and the Windows SDK) to run the electron-windows-store tool?
Yes, absolutely! Let’s get your environment set up to run the final packaging tool. This process requires a specific set of development tools on your Windows machine.
Phase 6: Setting up the Packaging Environment
The tool you need to convert your packaged Electron app into an MSIX file for the Microsoft Store is typically one of the Node.js modules built for this purpose, such as electron-windows-store or @electron-forge/maker-msix. Both rely on underlying Windows components.
1. Install Node.js and NPM
Since the packaging tool is an NPM module, you must have Node.js and its package manager (NPM) installed.
* Download and Install Node.js: Get the latest LTS (Long-Term Support) version from the official Node.js website.
* During installation, ensure the “Add to PATH” option is selected.
* Verify Installation: Open a new command prompt or PowerShell window and run these commands to confirm:
node -v
npm -v
(You should see the installed version numbers.)
2. Install the Windows 10 SDK
The Microsoft Store packaging process (MSIX) requires tools provided by the Windows Software Development Kit (SDK).
* Download the Windows 10 SDK: Get the latest version from the official Microsoft Developer website.
* Install Components: During the installation wizard, you must ensure you select the following required component:
* Windows Software Development Kit (usually selected by default)
* Windows Desktop App Converter (This is the underlying tool that the Electron module uses to create the MSIX package).
3. Install the Electron-to-MSIX Tool
The simplest way is to install the electron-windows-store command-line utility globally via NPM, which will be used in the next step to run the conversion command.
* Open an Elevated Command Prompt (Run as Administrator).
* Install the tool:
npm install -g electron-windows-store
Next Step
Once you have completed these environment setup steps, you’ll be ready to run the final command that converts your NSB App Studio’s Electron output into the official .msix package.
Would you like the full command and a breakdown of the final parameters required to generate your Microsoft Store-ready MSIX file?
Yes, here is the full command and a breakdown of the required parameters to generate your Microsoft Store-ready MSIX file using the electron-windows-store CLI.
Running the MSIX Packaging Command
You must run this command in an Elevated Command Prompt or PowerShell window (Run as Administrator) because it interacts with the Windows SDK and creates a code-signing certificate.
1. The Full Command Syntax
The command uses several flags to provide the necessary metadata for the Microsoft Store package:
electron-windows-store \
--input-directory C:\Path\To\YourApp\win-unpacked \
--output-directory C:\Path\For\Your\MSIX_Output \
--package-version 1.0.0.0 \
--package-name YourAppName \
--package-display-name ‘Your App Name’ \
--publisher-display-name ‘Your Company Name’ \
--identity-name ‘CN=Your Publisher ID’ \
--package-arch x64 \
--desktop-converter ‘C:\Path\To\DesktopAppConverter.ps1’
2. Breakdown of Required Parameters
The key to success is providing the correct paths and the Microsoft Store developer identity.
| Parameter | Description | Example Value | Where to Find It |
|—|—|—|—|
| --input-directory | Required. The path to the folder containing your packaged Electron application (the folder with your .exe file). This is typically generated by your Electron build tool (like electron-packager or electron-forge). | C:\Path\To\YourApp\win-unpacked | The output folder from the NSB App Studio’s build process. |
| --output-directory | Required. The path where the final .msix file will be created. | C:\Path\For\Your\MSIX_Output | Choose a clean, empty directory. |
| --package-version | Required. The version number for your app. Must be a four-part version (e.g., 1.0.0.0) to be valid for MSIX. | 1.0.0.0 | You define this, but ensure it’s in the correct format. |
| --package-name | Required. The internal, unique name for the app package (no spaces). | YourAppName | Use a simple, short name. |
| --package-display-name | Required. The user-friendly name that will appear in the Start Menu. | ‘Your App Name’ | Your app’s actual title. |
| --publisher-display-name | Required. The name of your company/publisher as registered on the Microsoft Partner Center. | ‘Your Company Name’ | Found in your Microsoft Partner Center account settings. |
| --identity-name | Required. Your unique Publisher ID (a string beginning with CN=…). This must match the ID from your Partner Center. | ‘CN=A1B2C3D4-E5F6-7890-ABCD-EF0123456789’ | In Microsoft Partner Center go to Account settings \rightarrow Organizational profile \rightarrow Legal info. This is the most crucial part for Store submission. |
| --package-arch | Required. The architecture of the packaged Electron app. | x64 | Match the architecture of the unpacked app (e.g., win-unpacked is usually x64). |
| --desktop-converter | Required. The path to the Desktop App Converter PowerShell script. | ‘C:\Program Files (x86)\Windows Kits\10\bin\10.0.22621.0\x64\DesktopAppConverter.ps1’ | Note: The exact version number in the path will depend on which Windows SDK you installed. You must verify this path on your machine. |
Handling the Code-Signing Certificate
The command above is set to create the final MSIX package. The first time you run the tool, it will likely ask a series of interactive questions related to creating a temporary local developer certificate for signing.
* Prompt: You need to install a development certificate… Would you like us to create one?
* Answer: Yes.
The tool will generate a self-signed developer certificate using your provided --identity-name and install it on your machine, which is required for Windows to run the app locally for testing. The final package for the Microsoft Store is signed automatically during this process.
Would you like to search your machine for the exact path to the DesktopAppConverter.ps1 script to ensure your command is 100% correct?
Yes, finding the exact path for the DesktopAppConverter.ps1 script is essential since it changes with every Windows SDK update!
Here is the recommended method to locate it using PowerShell.
Locating the Windows SDK Path
The DesktopAppConverter.ps1 script is usually located within the latest installed Windows SDK Binaries folder.
1. The Search Command
You can use the following PowerShell command to search for the file in the standard installation directory for Windows Kits:
Get-ChildItem -Path ‘C:\Program Files (x86)\Windows Kits\10\bin’ -Filter ‘DesktopAppConverter.ps1’ -Recurse -ErrorAction SilentlyContinue | Select-Object -ExpandProperty FullName
2. Example Path Format
The output of that command should give you a path that looks similar to this (the version number will vary):
> C:\Program Files (x86)\Windows Kits\10\bin\**10.0.22621.0**\x64\DesktopAppConverter.ps1
>
Pro Tip: Copy the resulting path directly from your PowerShell window—it will be the most accurate path for your setup.
Final Command with Placeholder
Once you have the path, you can insert it directly into the full command.
Use the path you copied to replace the placeholder <PATH_TO_DAC.PS1> in the final packaging command below.
electron-windows-store \
--input-directory C:\Path\To\YourApp\win-unpacked \
--output-directory C:\Path\For\Your\MSIX_Output \
--package-version 1.0.0.0 \
--package-name YourAppName \
--package-display-name ‘Your App Name’ \
--publisher-display-name ‘Your Company Name’ \
--identity-name ‘CN=Your Publisher ID’ \
--package-arch x64 \
--desktop-converter ‘C:\Program Files (x86)\Windows Kits\10\bin\10.0.xxxxx.0\x64\DesktopAppConverter.ps1’
Next Steps
* Run the PowerShell Search Command above.
* Copy the exact output path for DesktopAppConverter.ps1.
* Replace all placeholders (\Path\To\YourApp\win-unpacked, Your Publisher ID, etc.) in the final command.
* Execute the full command in an Elevated PowerShell window.
Would you like me to walk you through the process of finding your Publisher ID from the Microsoft Partner Center if you don’t have it handy?
That’s a great idea. The Publisher ID is the most critical piece of information, as it uniquely identifies you on the Microsoft Store and is required for signing the MSIX package.
Here are the steps to find your unique Publisher ID in the Microsoft Partner Center:
Locating Your Publisher ID in Partner Center
The Publisher ID is a long string that begins with CN= and is associated with your developer account. This is the exact value you must use for the --identity-name parameter in the electron-windows-store command.
* Sign In to Partner Center:
* Go to the Microsoft Partner Center dashboard.
* Sign in with the Microsoft Account that you used to create your developer account.
* Navigate to Account Settings:
* In the upper-right corner of the dashboard, find the Settings gear icon ().
* Click the gear icon and select Account settings.
* Find Your Identifiers:
* In the left-hand navigation menu, under the Organization profile section, click Identifiers.
* Locate the Publisher ID:
* On the Identifiers page, look for a section listing your various IDs (Seller ID, User ID, etc.).
* The value you need for MSIX packaging is the one referred to as the Publisher ID (or sometimes the Package/Identity/Publisher).
* It will be a string in the format of a Distinguished Name:
\* Format: CN=A1B2C3D4-E5F6-7890-ABCD-EF0123456789
Important Note:
The Publisher ID (e.g., CN=…) is used for the --identity-name parameter.
The Publisher Display Name (your company/name) is used for the --publisher-display-name parameter.
The two must be used correctly in the final command:
--publisher-display-name ‘Your Company Name’ \
--identity-name ‘CN=A1B2C3D4-E5F6-7890-ABCD-EF0123456789’
Once you have secured this Publisher ID, you will have all the necessary information to complete your electron-windows-store command.
Would you like me to put the entire finalized command (with placeholders for your paths and names) into a single block so you can copy and edit it?
Absolutely! Having all the parameters organized makes the final step much easier.
Here is the finalized command template, complete with all the required parameters, using placeholders for the values you retrieved. Make sure you are running this in an Elevated PowerShell or Command Prompt (Run as Administrator).
The Final electron-windows-store Command
Use this single block of code, replacing the values in with your actual data:
electron-windows-store \
--input-directory <C:\Path\To\YourApp\win-unpacked> \
--output-directory <C:\Path\For\Your\MSIX_Output> \
--package-version 1.0.0.0 \
--package-name \
--package-display-name ‘’ \
--publisher-display-name ‘’ \
--identity-name '<CN=Your Publishe