wiki:ITERATION_10/Release/UserDocumentation/AnIntroductionToSophie/01InterfaceBasics
Last modified 13 years ago Last modified on 07/13/09 23:40:08

Error: Macro BackLinksMenu(None) failed
compressed data is corrupt

Part 1: The Basics of the Sophie Interface

When you start up Sophie, it will look something like this:

source:/trunk/sophie2-platform/doc/userdoc-images/RELEASE_8/SophieTutorial1.png

That red rectangle in the middle of the Sophie window is the book desktop. The book desktop appears behind all books that are open in Sophie; it works just like a normal book and it can be used as a scratchpad to try things out or to keep media that you're going to use later.

To the left, right, and below the book desktop are Sophie's flaps, tabs, and palettes. There are top, bottom, and right flaps; inside each flap are different tabs, and inside each tab are palettes. These contain different parts of Sophie's functionality; we'll go into specific things that the palettes do as this tutorial progresses, but for now you should just know that they're there.

The bottom flap is a little different from the other flaps, in that it is only used for working with timelines. Right now, Sophie starts up with this flap open. With this book, we're not going to work with timelines, so let's close that flap. At the bottom of the Sophie window, you'll see a little tab marked "1:Bottom Flap". Click that and the flap will be hidden:

source:/trunk/sophie2-platform/doc/userdoc-images/RELEASE_8/SophieTutorial2.png

The tab isn't gone forever - if you want, you can get the flap back by clicking that tab again. You can click on the tab of any flap, tab, or palette in Sophie to hide it.

A major part of Sophie's interface is in its use of halos and HUDs. Halos are the little icons that appear on the Sophie workspace. You can see three of them around the edges of the book desktop: a little paint bucket and a "plus" sign in the upper left corner and a two-headed arrow in the bottom right corner. If you move your mouse over them, a tooltip will appear to tell you what they do.

There are two basic kinds of halos in Sophie. The first kind can be used directly - by clicking or dragging. The second kind opens a HUD (short for head's up display) which offers you more controls. The idea of halos is to have as much functionality as possible close to where you are in Sophie, so you have to work less. This interface takes a little bit of time to get used to, but once you figure out the basics of it, you'll be able to do complicated things very quickly.

Here's a quick example. The halo in the bottom right corner of the book desktop - the one with the arrows - is the book resize halo, which is a halo you use directly. If you move your mouse over this halo, it says "Drag to resize the page", which is what it does. Drag this halo so the short wide rectangle becomes a tall, thin rectangle, like this:

source:/trunk/sophie2-platform/doc/userdoc-images/RELEASE_8/SophieTutorial3.png

Not so hard. Now let's try the second kind of halo: one that opens a HUD. If you move your mouse over the halo in the top left corner - the one with the paint bucket - it says "Change the border and background". Click on this halo. What you'll see is the border and background HUD, which looks like this:

source:/trunk/sophie2-platform/doc/userdoc-images/RELEASE_8/SophieTutorial4.png

This HUD contains controls for the borders and backgrounds of pages. You can make it go away by clicking the paint bucket halo, which is right above it. Try that. Then open it again, and look at what's in it. The top half of the HUD contains information about the page's border: the top, bottom, left, and right borders are all set to "10". "Border color" has a red square next to it. These are, in fact, the settings of the border of the book desktop: it's a red border that's 10 pixels thick.

The HUD not only tells us this, it also lets us change these settings. If you put another value into the fields for the border width - say "1" or "0" - you'll see the border instantly shrink or disappear. (You might not notice it for the top border because the HUD is hiding it, but these changes are instantaneous.) You can also change the color of the border: to do this, click on the red square to open the color picker, which looks like this:

source:/trunk/sophie2-platform/doc/userdoc-images/RELEASE_8/SophieTutorial5.png

If you choose another color and click OK, the color will be changed. You can keep making these changes as long as you have the HUD open. When you're done, just click the paint bucket halo to close the HUD. HUDs aren't quite like regular windows: you can leave them open while you do other things and come back to them. Now your book desktop will look something like this:

source:/trunk/sophie2-platform/doc/userdoc-images/RELEASE_8/SophieTutorial6.png

Now that you understand some of the basics of the Sophie interface, we can start making books!

Comments

Expand this to include the bug reporting window - just pull it up as a last step & shoot off a bug report as a demo.