Let me introduce you...

What in the world is this? - you'll probably ask when you first visit this website.
This is going to become an interactive electronics tutorial. If i will finish it, of course.

Interactive electronics tutorial? What's that? See, when you do want to learn something, it's always better to see it in action than just read tons of text 'bout it. The same is true fofr electronics. It's really hard to understand the difference between p-n-p an n-p-n transistors when you did not even seen them before! For example, i did not understand that difference until i started this project Smiley-razz

p-n-p? Transistor? Too many difficult words! Just click in the menu "Let's start" above and dive into the world of electronics!

Oh, there's something missing...

Yeah, this project is in an early development yet. I even do not know if i will be able to finish it! Still, this is only my coursework. A very, very pretty coursework Smiley-lol So, don't be upset! If i'll find the reason to add something to this project - i'll surely do it! Have fun! Smiley-wink

What's gonna be clicked next?

Well, i see some strange pictures and light rectangle. So, what's next? That rectangle is a scheme sheet. It is the right place to create a schemes - a set of connected symbols, intertwined into a diabolic picture called (electronic) circuit. It shows the heretics called "engineers", which part should be connected to which parts and how the device will work at all.

The rectangle with odd pictures above the sheet is the toolbar. It will become your mostly used part of the site (taking into account the fact you want to experiment mostly). It is divided into three parts:
Now let's try to do something... Errr... How? There are no tricks. User Interface (aka UI) is aimed to be as easy and user-friendly as possible. So, here's the list on how things are done:
Add a component to the sheet
Click on the component's icon
Drag the component over the sheet
Press your left mouse button over the component. Do not unpress it yet! Move it with the component selected to the place you want. And now, unpress the left mouse button.
Select the component
Click left mouse button over the component on the sheet. When the dashed rectangle appears around the component - it is selected.
Rotate the component
Select the component and click the rotate button Arrow-circle-225 in the toolbar above the sheet.
Connect two components
Move your mouse to the pin you want to connect with. The pin is a medium red circle near the component's symbol. When you've stopped your mouse cursor over the pin, the blue circle will appear around that pin showing that you selected that pin
Pin-hover
Now, press your left mouse button keeping mouse cursor over the pin, do not unpress it yet and move a bit away from the pin - the blue dashed line will appear coming out of the selected pin and showing that you are trying to connect that pin to some other pin
Pin-drag
Move the cursor, keeping your left mouse button down to the pin you want connect to until the blue circle appears around that other pin. Only then you can release your left mouse button.
Pin-connect
The connection line will appear. It will automaticly create some bends.
Connection-line-created
Edit connection
Move your mouse to the connection line you want to edit. The connection line is the bended line which connects two component' pins. Usually it has dark color like black. Click on the connection line to select it.
Connection-line-select
The red rectangles will appear. They are base points. They determine where the connection line should follow. Connected together one-to-one and to the component' pins, they form a connection line. You can drag them to change the connection line
Base-point-drag
Connection line will be updated immediatly - it is a bit hard for your browser but more pretty. Yet it could be configured (simply run MooChip.lightMode = true within your JS console).
Base-point-drop
You can create base points double-clicking on the connection line.
Base-point-create
Base points are removed with double-clicking on them.
Base-point-remove
Remove single connection
First of all, select the connection line you want to remove.
Connection-line-select
Then simply click the Remove button Cross-script - and viola!
Connection-line-remove
Remove component and its connections
Select the component and click the remove button Cross-script in the toolbar.
Circuit-sample
Component-remove
Cancel selection
Click somewhere on the sheet where no connection lines, pins or components are located.
Circuit-sample
Run the simulation
Connect DC Source component to the other components of your sheet and click the run the full circuit simulation button Arrow-repeat in the toolbar. Components which were invoked in the simulation will be highlighted with light-blue color
Full-circuit-step
Step the simulation by one iteration
Click the step simulation button Arrow-repeat-once in the toolbar
Simple-step
Reset simulations
Click the reset execution button Arrow-circle-double in the toolbar. Any invoked component will become uninvoked.
Circuit-reset