In this tutorial
You will learn how to...
- How to use this website.
- What a GUI actually is.
- What a GUI consists of.
Introduction 1 - Using the site.
This is the introduction, the first step along the path of GUI enlightenment. It's a good idea to explain the website and all it's little features before we go ahead and start using it.

This big red blob of shapes and colours at the bottom of each tutorial is the tutorial nav pane. It will let you jump back a tutorial, go forward one, jump back to the top of the tutorial or if you've got any comments, queries or questions on the tutorial there's a nice big 'Contact Me' so you can send me an e-mail.
All the widgets are listed to the left of the page. There is nothing stopping you jumping right in as all of the tutorials contain complete code examples of every widget. Just select a widget from the menu bar to the left. Just in case though, we've provided a quick-jump list to the right hand side of each tutorial entitled 'Required Lessons'

Also on the right hand side, above the required lessons box is the 'Code Style' box. If you don't like the default colour scheme of the code examples, or the text is a little small, use the codestyle box in the top right to change the appearance of the code you see in front of you.

At the top is a more general navigation bar. This can send you home, to the Picture Index, The Code-Viewer or if you are particularly interested, a little page about me.

If you know what you are looking for, but don't know the name, use the Picture Index in the top navigation bar to pick out the widget you wish to learn more about.
You can look at all the code on the site by using the code-viewer which is also on the top navigation bar. This is handy for quickly getting to code examples you've seen in the site.
All the code is easy to extract from the examples, and you are more than welcome to use the code in your own projects. If you have time, please send me a quick e-mail to tell me what you are doing and maybe a link to a screenshot you've taken of your finished application (don't e-mail me lots of .BMPs please! Find somewhere to host!)
To make sure you don't copy and paste the line numbers along with the code, just drag the box over the text from the start of the code....

Finally, in the tutorials, there are questions and exercises to help you along the way. These should be self explanatory....answer the questions and click the mark button.
Now you know how to use the website, we can move on to actually teaching you about GUIs. Good luck!