User interface

Overview

CSIDE provides a clean and intuitive user interface; every feature and function is just a few clicks away. The main display has three panels: Scenes and Projects, the Editor Window, and the Tabs Panel.

In the leftmost panel are one or more Game Projects, each with its own group of named scene files. New projects can be created from scratch, or imported from existing game files.

The individual scene files can be moved or copied between different projects by dragging and dropping them. The list order for scenes or projects can be rearranged in the same way.

Selecting a scene file displays its contents in the Code Editor, which is in the centre panel. The Code Editor is a fully functional text editor; it features automatic spell checking (US or UK, plus a User Dictionary), handy code highlighting, multiple hotkeys for ease of use, and a powerful Smart Indentation function to streamline your game scripting.

The tabs in the rightmost panel give you one-click access to various program features. The first is the all-important Game Tab, for running, testing, and fine-tuning your project during game development. Then there are Issues, for debugging your game; User Settings, for personalising CSIDE for your use; Help and Information; the User Dictionary; and Example Projects and Templates, including templates with tutorials in ChoiceScript.

Beneath the Code Editor is the CSIDE Console (click the >_ icon to open/close), a versatile monitoring and debugging tool with a variety of uses. It works closely with the Game Tab panel to help you track down elusive bugs, or test and balance your code.

And that's only the tip of the iceberg! But not to worry; CSIDE is designed from the ground up to be exactly as helpful and unobtrusive as you need it to be. If anything sounds daunting, you can ignore it and stick to the Code Editor and Game Tab for your first game. Use what is comfortable for you, and feel free to come back and try out other features at a later date.

Usability Tips

CSIDE's user interface has been designed with today's widescreen monitors in mind. However, for smaller screens, you can hide the Scenes and Projects (leftmost panel) and Tab Topics (rightmost panel) via sliders. Just use the <-> buttons above the respective top corners of the Code Editor window.

Desktop Versions Only: Double-clicking the CSIDE main header bar toggles between your normal window size and position, and maximised (Windows) or full screen (Mac). For extended periods of intensive work, you may find it more comfortable to resize the CSIDE window and position it in the middle of your screen.

You can hide the Tabs Panel, the Scenes and Projects Panel, or both while you're focusing on the editor window. Then, when you're ready to run a play-test game or you need to switch scenes or access another tab, you can easily toggle back to full screen/maximised mode and slide open the relevant panel. You can also press Escape to toggle back and forth from the panel view and a Code Editor window only view.

Next Topic: Setting Up