Discuss Scratch

Locness
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

UPDATE:
These instructions are out-of-date and not confirmed to work anymore. They are preserved below for reference and archive purposes.
It is recommended you use TurboWarp Packager instead.

==================================

Thanks to SpeedDesign for his original .exe tutorial. This is basically a macOS adapted version.

First, use https://sheeptester.github.io/words-go-here/scratch3-htmlifier/ to get a single HTML file for your project. (thanks to sheep_maker for this tool) Wait, it can be long.
When you've got the downloaded file, ensure it is named “project.html”.

Then, head over to https://nwjs.io and download the “normal” version, and extract the given file. You should get this folder in the Finder :



Right-click “nwjs” and select Open. This is required to make sure macOS will open it.
When a popup appears, select Open. You should see something similar to this :



Now, close this window.
Move your downloaded project.html to the nwjs's folder. Now, open TextEdit (or any other text editor) and create a “package.json” file (with .json as extension), still in the same folder, with this inside it :

{
"name": "Your app or game name",
"main": "project.html"
}

If you're using TextEdit, make sure to go to Format > Convert to Text. If you get errors later that are related to this file (said “Manifest”), remove and manually put back the quotation marks.

Go back to your folder, and open a new window (File > New Finder Window).
Here, navigate to the same folder, and right-click “nwjs” and select “Show Package Contents”
Then navigate to Contents, then Resources. You should see this :



Go to File > New Folder, name your folder `app.nw` and open it.
Go back to your previous window, and drag-and drop the package.json and project.html files to the other window, in the “app.nw” folder (you can use the Cmd key to select both). Then you can close this window and go back to the first one.

Double-click “nwjs”. If everything has gone great, you should see your project working in its own window like this :



Now you can just rename nwjs to whatever you like, and that's it! You have your working app! You can put it in Applications, and you can do whatever you want with it.
NW.js requires you to share the “credits.html” file when you share your app.

Hope you liked this!

Last edited by Locness (Sept. 10, 2022 16:25:00)


I don't do stuff on Scratch anymore, sorry
Ddsad2d11
New to Scratch
4 posts

TUTORIAL : Convert sb3 to macOS .app

helped me a lot, thanks!
Nambaseking01
Scratcher
1000+ posts

TUTORIAL : Convert sb3 to macOS .app

Interesting, but I don't use a Mac.

Hey there! My name is Nammy. I'm a male Forum Helper and Scratch Wiki Editor.
Profile | Test Account | Talk with me here! | Griffpatch is quitting Scratch?!
--Explosion--
Scratcher
1000+ posts

TUTORIAL : Convert sb3 to macOS .app

Wow! Great guide! Thanks!

Last edited by kaj (Tomorrow 00:00:00)
✰✩✭✴★--Explosion--★✴✭✩✰
Forum helper | boy | platformers | 14yrs | guitar | website


Locness
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

herohamp wrote:

Why are you using nwjs over good ol electron?

1. It's what was used in the windows tutorial.
2. Electron requires you to setup node and npm, and uses mostly command line, where most people aren't comfortable with it.

I don't do stuff on Scratch anymore, sorry
Mobslyer92
Scratcher
22 posts

TUTORIAL : Convert sb3 to macOS .app

I think you should provide a tutorial to use electron for those interested because I, for one, and very comfortable using the command line.

Last edited by Mobslyer92 (April 20, 2020 12:42:46)


Hi, I'm Mobslyer92, check out my profile!
R4356th
Scratcher
1000+ posts

TUTORIAL : Convert sb3 to macOS .app

Great guide! Thanks! Can .apps be produced Windows?
My browser / operating system: Windows NT 10.0, Chrome 81.0.4044.113, No Flash version detected
Maximouse
Scratcher
1000+ posts

TUTORIAL : Convert sb3 to macOS .app

R4356th wrote:

Can .apps be produced Windows?
Probably yes, because they are technically just folders. But make sure that you download the macOS version of nw.js.


This is Maximouse's signature. Learn more about signatures.
Locness
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

You mean can .apps can run on Windows? Well, no, because the nwjs binary in it is compiled for macOS. If you want your app to be cross-platform, you'll have to manage Windows and macOS version sperately. Look at the beginning of the tutorial for the link to the Windows version tutorial.

I don't do stuff on Scratch anymore, sorry
Locness
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

Oh, @54356th you meant can you *make* these on Windows? Yes, you abosluetely can

I don't do stuff on Scratch anymore, sorry
pranavhaha
Scratcher
91 posts

TUTORIAL : Convert sb3 to macOS .app

use deskgap insted of nwjs it will save memory

Pranavhaha!
I like to make games and creative projects which help everyone

Some of my best games are here play it now!
grassland 360 platformer
Emoji clicker
Locness
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

Oh, I didn't know about DeskGap, thanks a lot @pranavhaha! Although I use nwjs here as it doesn't require the use of any command line

Last edited by Locness (Oct. 20, 2020 05:27:42)


I don't do stuff on Scratch anymore, sorry
wizardboy217
Scratcher
5 posts

TUTORIAL : Convert sb3 to macOS .app

hey locness, can you show an example of the code you put in? for example, i want to put scratchnapped by griffpatch. what will the json text look like?
Locness
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

{
"name": "Scratchnapped",
"main": "project.html"
}
Simple as that, wizardboy217

I don't do stuff on Scratch anymore, sorry
DanielKRPS315
Scratcher
26 posts

TUTORIAL : Convert sb3 to macOS .app

Doesn't work I'm on: My browser / operating system: MacOS Macintosh 11.1, Safari 14.0.2, No Flash version detected
And it says Failed to load extension
I did the Json like This:

{
“name”: “Timer”,
“main”: “Timer v1.html”
}

I did the exact thing

Last edited by DanielKRPS315 (Dec. 30, 2020 03:27:57)

Locness
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

DanielKRPS315, what project are you trying to convert? Also, if you created the JSON with TextEdit, make sure to check the quotes; TextEdit tends to often mess up quotes. Try disabling its “smart quotes” feature - may be called otherwise, I didn't use macOS since a long time.

I don't do stuff on Scratch anymore, sorry
qwertykid44
Scratcher
100+ posts

TUTORIAL : Convert sb3 to macOS .app

Interesting! I shall have to try this.

Qwertykid44: Currently transitioning.

I'm an INTP “Logician” personality with a passion for D&D. I'm largely retired in terms of attempting massive projects, but if you need something done, I do it or direct you to someone else who can do it.

Working on the DREAMCHILD collab.

Ace/Aroflux
She/Her
dilanoe
Scratcher
17 posts

TUTORIAL : Convert sb3 to macOS .app

YAY NOW I CAN SELL MY GAMES!!!!!!!!!!! WO HOO!!!!!!!!!
when green flag click 
Pay (10) bucks
dilanoe
Scratcher
17 posts

TUTORIAL : Convert sb3 to macOS .app

gotta make money some how

Powered by DjangoBB