Basic Micro-Controller Unit Connections (Part I)

There are many tutorials on the web that teach you how to program various circuits with Micro Controller Units (MCU) such as the Arduino (www.arduino.cc), Texas Instruments MSP430 (www.ti.com/launchpad) and Microchip PIC Microcontrollers (www.microchip.com). However if you want to design your own circuit, here’s a short guide as to how you can make some basic circuits for your MCU.’

 

1. Power Supply and Programming Circuit

One of the first things that you need to do is connect the power supply and the programming circuit to your MCU. If you are using a  MCU that comes with a programming board such as the Arduino and the Texas Launchpad you can skip this step. If not, I recommend that you read the datasheet for your MCU before connecting any wires from the MCU to a power supply or to a computer. There are many tutorials and YouTube videos online that will help you make these connections.

You will also need to install a programming software and system drivers for your programmer. You can find information regarding this from the place where you obtained your programming board or circuit.

 

2. Buttons and switches

Buttons and Switches are digital devices that can only send either a logical high or low to your MCU. It is possible to connect your button directly to your MCU input pin and one of the power rails. When the button is pressed the Logical High value will be recorded on the MCU input, however when the button is not pressed the input pin is floating around. This means that neither a High voltage or a Low voltage is given to the input pin. The value recorded by the MCU at this instance will be altered by natural factors like electrical interference.

To overcome this problem push buttons and switches are wired with either a pull up or a pull down resistor as shown in the image below. These resistors are used to connect the input of the MCU to either the High or the Low voltage when the button is not pressed. The value of the resistor should be relatively large (10kΩ). This is similar to a potential divider where the resistor representing the button swaps between infinite resistance and zero resistance.

Many MCU’s have a built in pull up or pull down resistor which can be enabled when programming the pin configuration of the MCU. When this is to be selected, the push button or switch can be wired directly from the main power supply to the pin.

 

3. Sensors

Most sensors are similar to similar to a variable resistor. They change their internal resistance depending on what they sense. For example the resistance of a Light Dependant Resistors (LDR) reduces when light falls on the it.

Sensors such as LDR, photo resistors, temperature sensors, and other similar input devices are connected as follows which is similar to the wiring to the button

In this situation a potential divider is formed between the fixed resistor and the sensor. The voltage as a result of the potential divider is read by your MCU. Unlike a button, the sensor is a analogue device. It should be connected to a analogue pin on your MCU to receive the complete range of values.

It is possible to connect the sensor to a digital pin. If you do this you will only receive a High or a Low input depending on the state of the sensor. I advice you to to refer to the datasheet of the MCU to find out how much voltage is required by a digital pin to register as a High or Low voltage.

 

4. Light Emitting Diodes (LED)

LED’s are one of the basic output devices. They are diodes which allow current to flow in only one direction. Before connecting an LED you must know how much voltage is needed by the LED for optimal glow and the rated current.

LED’s are connected via a resistor as shown in the figure below. The resistor that needs to be added in series with LED is to limit the current flowing through the LED. This is needed because of the LED’s I-V curve. According to the I-V curve, after a certain voltage drop the LED will allow almost infinite current to flow through it. This will draw all the current from your MCU and cause the batteries to drain much quickly. It may also blow out your LED.

The resistance of the resistor to be added can be calculated as follows.

• Reduce the voltage drop over the LED (Ex. 2.2V) from the supply voltage (Ex. 5V) to find the voltage drop over the Resistor (5 – 2.2 = 2.8V)
• Using Ohms law (V = IR) calculate how much resistance is needed to draw a current less than the rated current of the LED (Ex. 20mA). Remember than in a series circuit the same current flows through all the connected components (R = (2.8/0.02)Ω).

7 segment displays are connected similar to LEDs. They have an input pin which requires a positive voltage and 8 output pins which are connected to the cathode of each the LEDs on the segments.

Bi-colour LEDs are also similar. It contains three pins where one of the pins are the power supply and the other two are the cathodes for each colour.

Multiple LED’s can be connected in many ways: Two LEDs can be connected as follows where one LED will light up and the other one will switch off depending on the output of the MCU pin

If you need to control many LEDs with only a few pins on your MCU please read about Multiplexing and Charlieplexing. I will explain these circuits on another part of this tutorial.

 

On a Final Note

This is only the first part of the Basic Micro controller unit connections tutorial. Other parts will uploaded soon

If you are someone who is always working with electronic circuits, I have found a very useful Mobile app named “ElectroDroid” by lero . There is a free and pro version. You can use it to look up resistor colour codes and SMD values, calculate theoretical values for different circuits and many more.

If you thing this post needs more improvement please let me know by commenting below. If you think this post is useful, bookmark it or share it with someone who might need it.

Thank you for reading.

“The Everything Box”

I always wanted to work on a home automation project as it is very interesting and challenging to design a circuit to control most electrical appliances in a house. It’s not possible to mess around with the electricals in my room which I stay for rent. So I decided to make an automated box. I call it “The Everything Box”.

The Everything Box will house various circuits designed for different tasks. The circuits are not limited to the inside of the box. Some of them will be wired out of the box to control appliances such as desk lamps etc. Some of the circuits that I have decided to put in the box are:

• Automated Desk Lamp and other lights
• Back up power Circuit
• Automated cooling fan to maintain temperature
• Data logging
• Music Player
• More circuits will be added in the future

To get started with the project I took an old shoe box that was lying around. I cut some holes for the basic items such as the fan and buttons and painted the box in shiny black.

 

The box currently has the switches shown, a cooling fan, a number pad and a blue el wire running along the inside top of the box to illuminate the circuits when the box is opened. I will post updates on this blog when I add new circuits to The Everything Box.

Let me know what you think of this project and also let me know of some new suggestions for the circuits in the comments below. Thank you for reading.

Basic HTML Codes Everyone Should Know

I found an old book in which I have written HTML codes that I used when I got started with web designing. So let me share the most basic codes that everyone should know to get started.

Creating an HTML Page

There are many software's that can be used to create HTML pages. For example using Adobe Dreamviewer you can type and make your webpage easily without having to worry about the code. Dreamviewer will automatically create the code for you. However if you want to learn how to use these codes and create a webpage manually all you need is a basic text editor like Windows Notepad. All you will need to do is to write your code in the text editor and save it as a .html file (example.html). You can then view your webpage by opening your file in a browser or re-edit by opening it with a text editor.

Header

<html>

This tag is used to tell the browser that the following code is HTML. The entire code for the web page is written in between <html> and </html> tags.
Note: Almost 90% of the tags needs to be closed when opened. Tags are opened by entering the name in between triangle brackets and they are closed by adding another tag at the end with a ‘/’ followed by the name of the tag. For example: <example> … </example>.

<head>

The head tag is used to access the head of the webpage.

<title>

The title tag is used to give the name of the web page or any other description on the title bar of the web page.
Example:

<html>
<head>
<title> Jonnytronics Webpage Example </title>
</head>
</html>

Body

<body>

This tag gives access to the body of the webpage. Almost all tags have different properties and they can be accessed by naming the property inside the tag.

Background Colour

Any colour can be used as a background colour on a webpage. This is done by the following property
<body bgcolor = “…”>
example: <body bgcolor = “#C0C0C0”> OR <body bgcolor = “Silver”>
The colour can be written in English or in Hexadecimal. Some example colours are given below.

• Aqua - #00FFFF
• Black - #000000
• Blue - #0000FF
• Grey - #808080
• Green - #008000
• Lime - #00FF00
• Maroon - #800000
• Navy - #000080
• Olive - #808000
• Purple - #800080
• Red -#FF0000
• Silver - #C0C0C0
• Teal - #008080
• White - #FFFFFF
• Yellow - #FFFF00

 Background Picture

<body background = “….jpg”>
Use this tag to add a picture as the background for your web page.
Note: The address to the picture can be given relevant to the location of the webpage or the full address to the image can be given.

Text Colour

The text colour for a webpage can be given by the following tag. The colour can can be chosen by typing the name of the colour or its hexadecimal value as in the table above.
<body text = “…”>

Page Margin

The page margin for a webpage can be set by the following tag. The amount of space for the margin is given by pixels or a percentage of the webpage.
<body leftmargin = “…”>

Example:
<html>
<head>
<title> Jonnytronics Webpage Example </title>
</head>
<body bgcolor = "Blue" text = "White", leftmargin = "100">
This is the body of the web page </body>
</html>

Headings

There are 6 different headings in html. <h1> is that first heading (or the heading with the largest font) while <h6> is the smallest size.

• <h1> - 36px
• <h2> - 24px
• <h3> - 21px
• <h4> - 18px
• <h5> - 16px
• <h6> - 14px

Headings can also be given different attributes such as align and colour.
For example:
<h1 align = “center”, color = “blue”> Jonnytronics </h1>

It is important to note that when the heading tag is closed, the browser will automatically move to the next like. Therefore there is no need to use a tag to move to the next line.

Line Break

This tag is similar to pressing the enter key when writing a normal document. Using this tag you can move to the next line and continue typing
The tag is written as <br> and there is no need to close this tag.

Paragraph

It is possible to write a continuous paragraph inside the tags <p> and </p>. Once the paragraph is grouped in between the tag properties can be given to the entire paragraph as a whole.

Comments

Just as in any other programming language, HTML too has comments. anything written inside the comment tags will not appear in the webpage. They are mainly used to give the reader of the bare code to understand what is going on in that section.

They can be written as <!--- your comment --->
Example:
<html>
<head> <title> Jonnytronics Webpage Example </title> </head>
<body bgcolor = "Blue" text = "White", leftmargin = "100">
This is the body of the web page
<h1 align = "left"> Heading 1 </h1>
<h2 align = "center"> Heading 2 </h2>
<h3 align = "right"> Heading 3 </h3>
<h4> Heading 4 </h4>

<p align = "right">This is a paragraph. The entire paragraph is right justified. Any properties given to the paragraph tag will affect the entire paragraph </p>

This is not written in a paragraph. <br> <!--- This does not appear in the web page --->

<br> Line break
</body>
</html>

Horizontal Line

The <hr> code draws a horizontal line across the webpage. The tag is like the <br> tag, it does not have a close tag.
This properties of this tag can be controlled by align, colour, width, size (this is thickness), etc. The width can be given in pixels or as a percentage of the webpage. The size is the thickness of the line and it is given in pixels.

<hr align = "center", color = "red", size = "1", width = "60%">

Formatting

<font>

The font tag can be used to change the font of the text enclosed if the font is different from the font used for the entire webpage.
The properties used for this font are: face, colour and size.
<font face = "Times new roman", color = "green, size = "35"> Example </font>

Other Formatting

• <b> or <strong> - Text enclosed becomes bold
• <big> - Text is big. If the tag is repeatedly used inside each other the size becomes bigger.
• <small> - Similar to the <big> tag but makes the size smaller instead
• <i> or <em> - Text enclosed becomes italic
• <u> - Text enclosed becomes underlined
• <s> or <strike> - Text enclosed are strike through
• <sup> - Text enclosed are superscript
• <sub> - Text enclosed are subscript
• <center> - Text enclosed are centred

Division Tag

This tag is used to create different segments on the webpage. The tag is written as <div>. It accepts only position attribute to position itself on the webpage.

Anchor

An anchor tag is used to create a link within another word. the tag is written as <a> and it accepts the attribute href to embed the link

<a href = "www.johnsamarasinghe.blogspot.co.uk"> Click here to go to my website </a>

Frames

Frames are used to divide the webpage to view 2 or more webpages. The area is separated by <frameset> tag. Using this tag the number and the size of columns can be set in percentages using the attribute cols. The number of columns do not have to be stated. The width of all the columns can be written one after the other.

Each individual frame is given the source by adding the <frame> tag within the <frameset> tag. The <frame> tag does not have to be closed. It accepts the attribute src to point to the webpage that needs to be displayed. Please see the example to understand the structure

<frameset cols="30%,50%,20%">
<!---This means there are 3 columns--->
<frame src="example1.html">
<frame src="example2.html">
<frame src="example3.html">
</frameset>

The <frame> tag also accepts other attributes in addition to src.

• name – name of the frame
• scrolling – yes, no or auto
• frameborder – 1 or 0
• marginheight – height of top and bottom margins in pixels
• marginwidth – width of left and right margins in pixels

Media

Images

Images are added using the <img> tag. There is no need to close this tag. This tag accepts the following attributes

• src – location or image
• width – width of image
• height  - height of image
• border – 1 or 0 for presence of border
• align  - align of image
• vspace- vertical space
• hspace  - horizontal space
• alt – alternative text

<img src = "example.jpg", width = "180", height = "200", border = "1", align = "right", vspace = "0", hspace = "0", alt = "Example Image">

Video

Video can also be added using the <img> tag. It has the following attributes

• dysrc – location of video
• width and height
• border
• align
• vspace and hspace
• start  - set opening method as – File Open / Mouse Over
• loop – Number of times to repeat

<img dysrc = "example.avi", width = "180", height = "200", border = "1", align = "right", vspace = "0", hspace = "0", start = "File Open", loop = "10">

Embed

The <embed> tag can be used to embed flash files in to the webpage.
<object>
<embed src = "example.swf", height = "200", width = "200", alt = "Example Embed"> </embed>
</object>

Lists

Unordered lists

An unordered list is a list that has bullet points. This list is started by the tag <ul>. It accepts the attribute ‘type’ to insert the shape of the bullet point. The types are: square, circle, triangle and star

Once the list is started, each individual item on the list can be added by the <li> tag. This tag and the <ul> tag needs to be closed. It is also possible to change the bullet point in the middle of the list by adding the type attribute specific list item. The following item will return to the original type of the list.

<ul type = "square">
<li> Tea </li>
<li> Coffee </li>
<li> Water </li>
<li type = "circle"> Jug </li>
<li> Cup </li>
</ul>

Ordered lists

An ordered list is a numbered list. It has the tag <ol> and accepts the attributes type and start. Start is the starting point of the numbered list . The type can be given as the following:

• 1 - means 1, 2, 3, 4
• A - means A, B, C, D
• a - means a, b, c, d
• I - means I, II, III, IV
• i - means i, ii, iii, iv

Each item in the list is given in <li> tags and they have attributes: Value and type which can be used to change the normal count value of the list element

<ol type= "A", start = "2">
<li> Tea </li>
<li> Coffee </li>
<li value = "10"> Water </li>
<li> Jug </li>
<li type = "1"> Cup </li>
</ol>

Definition list

The tag for a definition list is <dl>. The definition terms within the definition are given by <dt> and the definition of the definition term is given by <dd>.

<dl>
<dt> Tea </dt>
<dd> A drink </dd>
<dt> Cake </dt>
<dd> A desert </dd> </dl>

Tables

A table is started by the <table> tag. This tag accepts the following attributes which are self explanatory or defined above.

• width and height (pixels or percentage)
• border (1 or 0)
• bordercolor
• cell padding
• cell spacing
• align
• valign
• backgroundcolor
• background (image)

A table row is created by the <tr> tag and it accepts the attribute height. Once a table row is created, it can be filled with table columns <td> which accepts the attribute width. For each column the data can be added in between their tags.

<html>
<head>
<title> Jonnytronics Webpage Example </title>
</head>
<body>
<table align = "center", width = "60%", cellpadding = "0", cellspacing = "1" border = "1">
<tr>
<td align = "center"> Name </td>
<td align = "center"> Age </td> </tr>
<tr>
<td> John </td>
<td> 20 </td> </tr>
<tr>
<td> Matthew </td>
<td> 23 </td> </tr>
</table>
</body> </html>

Conclusion

I hope this small tutorial helped you in anyway if you are a complete beginner in HTML. If there are any mistakes that I may have mentioned in this article please let me know and I will immediately correct them. If you need advanced help please refer to other websites such as w3schools (http://www.w3schools.com/html/default.asp).

Thank you for reading

Lap Timer

I built this circuit to test the time taken for a line following buggy to complete one lap in a track that I created. Myself and my friend used this circuit to measure the best time taken.

The circuit consists of

• 2 push buttons to select which user is racing next
• LCD display to show the best time and the current time while the timer is running
• A power supply consisting of a 9V battery connected to two voltage dividers that step down the voltage to 5V and 3.3V.
• A sensor circuit fabricated by my friend which outputs a logic high when the sensor detects any object in front of it at a limited range.
  
  

To get started, I built the circuit with an Arduino Uno R3. After successfully making basic connections to the arduino and debugging my code I decided the make the circuit with a MSP430 to make it smaller and more portable.

The MSP430 operates at 3.3V but the LCD display needs more than that to record a logic high. To overcome this problem AND gates were used to increase the output to the LCD display connections increase to 4.5V.

If you want to create a similar circuit with an arduino all you have to do is the following.

• Read and be familiarised with the “Liquid Crystal” library that comes with the Arduino software.
• Make connections to the LCD display as shown in the library.
• Fix two switches and wire it to the arduino.
• Get a basic IR emitter and a receiver (It is easier to get a TCRT5000). Then wire the receiver same as the switches. Instead of connecting it straight to the arduino, connect it to a comparator and use a voltage regulator to control the output signal.
• If necessary use a Voltage regulator to drop the voltage from your source to 5V.

You can write your own program. but here is a copy of my program.

#include <LiquidCrystal.h> LiquidCrystal lcd(12, 11, 5, 4, 3, 2); int mode = 0; int racer1 = 500; int racer2 = 500; int i, x, y, z, time; int m = 0; void setup() { lcd.begin(16, 2); pinMode(9, INPUT); pinMode(10, INPUT); pinMode(8, INPUT); } void loop() { while (mode == 0){ x = digitalRead(9); y = digitalRead(10); if (x == 1){ mode = 1; } else if (y == 1){ mode = 2; } lcd.setCursor(0, 0); lcd.print("Racer 1"); lcd.setCursor(10, 0); lcd.print(john); lcd.setCursor(0, 1); lcd.print("Racer 2"); lcd.setCursor(10, 1); lcd.print(nigel); } while (mode == 1){ time = 0; m = 0; lcd.clear(); lcd.setCursor(0, 0); lcd.print("Racer 1"); lcd.setCursor(0, 1); while (m == 0){ z = digitalRead(8); if (z == 1){ m = 1; } } while (m == 1){ for(i = 0; i<20; i++){ delay(50); z = digitalRead(8); if (time > 3) if (z == 1){ m = 0; } } time++; lcd.setCursor(0, 1); lcd.print(time); } if (time < racer1){ racer1 = time; } mode = 0; lcd.clear(); } while (mode == 2){ time = 0; m = 0; lcd.clear(); lcd.setCursor(0, 0); lcd.print("Racer 2"); lcd.setCursor(0, 1); while (m == 0){ z = digitalRead(8); if (z == 1){ m = 1; } } while (m == 1){ for(i = 0; i<20; i++){ delay(50); z = digitalRead(8); if (time > 3) if (z == 1){ m = 0; } } time++; lcd.setCursor(0, 1); lcd.print(time); } if (time < racer2){ racer2= time; } mode = 0; lcd.clear(); } }  

 Here is a demonstration

A Workstation with SketchUp

I decided to test out Trimble SketchUp (Formerly Google SketchUp) (http://www.sketchup.com/). I made a small model of a workstation that I would like to have for my projects.

Let me take you through a few of the special features on my desk.

1. The Drawers

I added 6 different drawers with a lot of space such that I can organize all my electronic components and tools in different drawers.

2. The Computer

I got a little futuristic with the computer. It consists of a very large wall mounted display which is attached to another display laid horizontally of the desk. The second screen can act as both a regular screen or as a keyboard and mouse for navigation.

The CPU of the computer is built in to the table which can be accessed by opening the doors next to the drawers. Inside this more add-ons (like RAM and VGA) can be added or removed from the computer easily.

The USB outputs are placed horizontally on the desk next the screen for ease of access and neatness. The cables for speaker / headphones and microphone can be plugged in the sockets next the USB slots.

3. Component drawers

This is the area on the table  where I build my circuits. I need to be able to reach all my components with ease. The squares that are on the table are drawers that can be pulled out easily by pushing inwards. The third drawer is pulled out to demonstrate this. Once its pulled out necessary resistors, inductors, etc can be taken out from the individual compartments. Once pushed down the surface area on the table can be recovered.

The gray mat is an insulation mat surrounded by an RGB el wire that lights up the work area with suitable light.

Finally the white board on top is simply a whiteboard to white reminders or for any other use.

You can download my file from Rapidshare (http://rapidshare.com/files/539307659/John%20Workstation.skp)

Hope you enjoyed reading this article. You can try  Trimble SketchUp too by downloading from their website.

Using a regular LED as a basic LDR

(Many of you may already know this, but I didn’t. So I tested it out)

One of my friends told me that we can measure the amount of ambient light by reverse biasing a regular red LED. This didn’t seemed to be quite possible to me at start. So I wanted to see for myself as to how far we can use an LED as an LDR.

To test this hypothesis I set up the following apparatus using my National Instruments myDAQ.

The 2 wires are connected to the analogue input ports on the myDAQ unit such that the negative end of the LED is connected to the positive analog input and the positive end of the LED is connected to the negative analog input.

Using the oscilloscope I initially took the readings from different sources of light.

 

9 White LEDs held at around 3 inches from the red LED

This gave me a reading of about 443mV. The Voltage generated was not stationary. It moved up and down very slowly with a voltage of 1.93mV. Overall this was a very small swing. However I was surprised that there was a change in the reading. I continued with my next experiment.

 

9 UV Black Light LEDs held at around 3 inches from the red LED

The UV light gave the LED a much greater swing of around 1.245V.

 

1 Red LEDs held very close to the LED at test

The voltage change due to this was very insignificant. It was around 131mV. I replaced the forward biased Red LED with a yellow LED. This gave a swing of 109mV. Then I added another yellow LED to increase the change in voltage to 214mV. Adding another yellow LED increased the difference to 320mV.

 

Knowing that the reversed biased LED changes its voltage due to intensity I tested the voltage change while bringing my 9 white light LEDs closer and closer to the red LED.

I observed the following graph

 

A few Observations and Conclusions

• The Voltage swing obtained from a red LED connected in reverse bias is very small. (high inaccuracy)
• It takes a ling time for the voltage to rise up to its steady state voltage
• The voltage at steady state never really is steady. There is always some oscillation that is also very slow.
• Connecting up a red LED in reverse bias will behave quite similar to a LDR however there are many disadvantages to using this substitute.

 

To find out more about this just set it up yourself and have a go at it. You do not need a power source nor any resistors. All you need is a regular LED and a voltmeter, multimeter or any other voltage reading devices.

Thanks for reading.

Line Following Buggy Sensor Prototype

As a second year student at the University of Manchester my team and I had to create a line following buggy. To demonstrate to the lecturers the basics of detecting the line and applying the correct duty cycle for the PWM I made a simple sensor prototype.