INTRODUCTION
In the first part, we will learn how to use the LEDs and make a flashing heart!
![](https://makecode.trafficmanager.cn/blob/7c747185fef1b4f8069beb3c5c2820a5503c64a0/static/mb/projects/flashing-heart/sim.gif)
COMPONENTS LIST:
- Micro:bit Mainboard
- USB cable
The following steps are based on Windows OS. It can be used as a reference for other operating systems.
STEP 1: Open MakeCode
Visit the MakeCode page from the following link: https://makecode.microbit.org/
![](https://image.dfrobot.com/image//Blog/AIK2/03.png)
STEP 2: Connect micro: bit to computer
Micro: bit connects to computer via the USB cable. The power indicator on the back side of the micro: bit will light up when connected.
![](https://image.dfrobot.com/image//Blog/AIK2/04.png)
Before programming, we should make sure that the mainboard is recognized by the computer.
When micro: bit is connected, a “MICROBIT” directory will show up in “My Computer.”
![](https://image.dfrobot.com/image//Blog/AIK2/05.png)
STEP 3: Start a New Project
Before starting a new project, we will need to first get familiar with the programming interface.
![](https://image.dfrobot.com/image//Blog/AIK2/06.png)
Simulation window: simulates the operating status of micro: bit. During the process of programming, you can always check how your program looks like the through the window.
Function area: Where you can find all the function blocks, including input, output, loop, logic, etc..
Programming area: Dragged the blocks from “Function area”, stack them up and build your program here.
Click “Project” at the top of the simulation window
![](https://image.dfrobot.com/image//Blog/AIK2/07.png)
Then, click “New Project.”
![](https://image.dfrobot.com/image//Blog/AIK2/08.png)
Then you will see its editing interface as follows:
MAKECODE编辑界面图片
Place the show leds block in the forever block and draw a heart.
![An animation that shows how to drag a block and paint a heart](https://makecode.trafficmanager.cn/blob/29f08908a686406f6522ef210de8b17a201e1e18/static/mb/projects/flashing-heart/showleds.gif)
Place more show leds
blocks to create your own animation.
![](https://osoyoo.com/wp-content/uploads/2018/09/4.png)
STEP 4: Download the program and upload to micro: bit
When we have finished our program, we can now download it from the website and uploaded to micro: bit. We can also rename the project and save it in the browser. The project will stay in “my stuff ”.
![](https://image.dfrobot.com/image//Blog/AIK2/09.png)
Before downloading, we can check the simulated results in the simulation window. The buttons in the lower part of the simulation window can be used to control the analog micro:bit
![](https://image.dfrobot.com/image//Blog/AIK2/010.png)
Click “Download” in the lower part of the simulation window and select “Save As” in the pop-up dialog box.
![](https://image.dfrobot.com/image//Blog/AIK2/011.png)
![](https://image.dfrobot.com/image//Blog/AIK2/012.png)
Choose to save the “.hex” file to “MICROBIT Disk” and click “Save
![](https://image.dfrobot.com/image//Blog/AIK2/013.png)
During the process of downloading, the power indicator on the back of micro: bit will blink. When completed, it will stop flashing and keep on going.
Running Result
Look at the virtual micro:bit, you should see the heart and your drawing blink on the screen.
![Heart shape in the LEDs](https://makecode.trafficmanager.cn/blob/7c747185fef1b4f8069beb3c5c2820a5503c64a0/static/mb/projects/flashing-heart/show-leds.gif)
Now you are all good for basic setups. Remember to visit our website to check out more micro: bit projects. Please also leave a comment if there you have question or new idea to share.