A WebStorm indításakor az utolsó állapotot állítja vissza: ha volt megnyitott projekt, akkor közvetlenül azt látjuk a szerkesztőben. Első indításkor, valamint kilépés előtt bezárt projekt esetén az indítóképernyőt látjuk.

• A jobb oldali listán az utóbbi időben megnyitott projektek nevei láthatók.
• Amennyiben az egeret egy projekt nevére húzzuk, a jobb szélen megjelenik egy fogaskerék ikon, amire kattintva egy menü jelenik meg a lehetésges funkciókról (pl. projekt megnyitása, levétel a listáról, stb.).
• A jobb felső gombokkal indíthatunk új projektet, valamint megnyithatunk már létezőt. Akár VCS rendszerből közvetlenül is letölthetünk projektet.

A New Project gombra kattintva új projektet indíthatunk. A megjelenő dialógusablakban kiválaszthatjuk a projekt típusát (számos keretrendszert ismer és támogat a WebStorm), valamint meg kell adnunk a projekt elérési útvonalát.

A Three.js munkákhoz célszerű az üres projektsablont (Empty Project) választani.

A Location mezőben adjuk meg a projekt mappa elérési útvonalát. Létező mappát nem választhatunk, újat kell megadni. Célszerű az "untitled" helyett beszédesebb nevet választani.

Üres projekt esetén a Projekt nézetet kapjuk a bal oldali panelen.

Az üres projekt – nevéhez illően – nem tartalmaz semmit, nekünk kell létrehozni a szükséges struktúrát. Ezt legegyszerűbb a WebStormon kívül, fájlböngészővel végezni.

Ha a jegyzet példaprogramjait szeretnénk kipróbálni, az új projekt mappába a nyitóoldalról letölthető példaprogramtár tartalmát csomagoljuk ki ide.

Egyébként új projekt kezdésekor az alábbi lépéseket végezzük el.

• A projekt mappán belül hozzunk létre egy js nevű almappát! Célszerű lehet a mappanév végére odaírni, melyik Three.js verziót tartalmazzák a fájlok (pl. js-r143).
• Ide másoljuk be a Three.js build mappáját, ami tartalmazza a three.module.js fájlt.
• Szükség esetén hozzuk létre az examples/jsm almappát, azon belül pedig a controls, loaders, libs, helpers almappákat, és másoljuk be a Three.js examples/jsm almappáiból a szükséges kiegészítő fájlokat! Mivel a modulok csomagnevekkel hivatkoznak egymásra, így nem szükséges az eredeti mappaszerkezet megtartása, de az egyszerűbb áttekinthetőség miatt célszerű lehet.
• Összetettebb programok esetén további JavaScript források bemásolása is szükséges lehet!

Adjunk hozzá új HTML fájlt a projekthez a WebStorm segítségével.

• Kattintsunk jobb egérgombbal a projekt nevén a bal oldali Project panelen, és válasszuk a New > HTML File opciót.
• Adjunk neki nevet (pl. First.html), valamint HTML 5 típust válasszunk a listából.
• Írjuk meg a forráskódot, vagy másoljunk át egy már létező kódot!

Egy WebStorm projekt több HTML forráskódot is tartalmazhat, így egy projekten belül kezelhetjük a félév során előforduló példaprogramokat.

A mappastruktúra is megjelenik a projekt nézetben. Egy becsukott mappát a neve előtt szereplő > jel jelez. A jelre kattintva a tartalma "kinyílik".