Clark Coders & Creators
March 5
Coding Micobits
Pong!
Click here to open a student copy of Pong
Objectives: We are going to modify the code to create a Pong game using our Microbit.
What numbers should we change the red cirles to best work for our Pong game?
Creating & Coding Apps
We will begin designing and coding apps using MIT App Inventor. Our app will have the ability to take pictures, and users will be able to draw on them.
🎨 Digital Doodle (Part 1) | MIT App Inventor Tutorial 🎨
Welcome to Part 1 of this three-part series on creating a Digital Doodle app using MIT App Inventor! This tutorial is perfect for beginners who want to explore app development and prototyping.
In this video, we'll go through:
✅ An introduction to MIT App Inventor
✅ Where to find the Digital Doodle tutorial
✅ Why this is a great tool for beginners
Click on the orange button on the top left that says "Create Apps!"
3. Create the Project name as "ClarkCamera"
4. You can change the Toolkit and Theme if you would like.
5. Drag the Button to your device.
6. Rename the Button to Take_a_Picture in the components.
7. Type Take a Picture in the text box on the bottom right of your properties.
8. Click the Drawing and Animation drawer in the Palette.
9. Drag the Canvas to your device.
10. Click the Layout drawer on the Palette.
11. Drag the HorizontalArrangement to your device.
12. Click the User Interface drawer on the Palette.
13. Drag 2 buttons into the Horizontal Arrangement.
14. Rename the buttons to different colors like Blue and Red.
15. Change the Text box on the bottom right to the color of your button like Blue and Red.
16. Add Background color like Blue and Red
17. Click the Media drawer on the Palette.
18. Drag the Camera to the white part of your device.
19. Click the Sensor drawer of the Palette.
20. Drag the AccelerometerSensor to the white part of your device.
🎨Welcome to Part 2 of our Digital Doodle app tutorial! 🎨
In the first video, we added components, and now it’s time to start coding using MIT App Inventor.
In this video, we'll cover:
✅ Switching from Designer View to Blocks View
✅ Adding functional code to bring our Digital Doodle app to life
✅ Understanding the basics of App Inventor’s block-based coding
Make sure to check out Part 1 if you haven’t already, and stay tuned for Part 3 where we’ll refine and enhance the app!
🎨 Digital Doodle (Part 3) | Testing & Finalizing the App 🎨
Welcome to the final part of our Digital Doodle app tutorial! In Part 1, we designed the app and added components. In Part 2, we coded it. Now, it's time to test and finalize our project!
In this video, we'll cover:
✅ Testing the Digital Doodle app on a device
✅ Connecting with MIT App Inventor’s AI Companion
✅ Debugging and making final improvements
By the end of this tutorial, you'll have a fully functional Digital Doodle app built using MIT App Inventor! 🎉