Whittier STEM Fair 2016 CARLI PECORARO’S ANDROID APP PROJECT

What I want to do for my project. For my project I wanted to make an App that you can use to draw pictures. Also, I wanted to be able to share my drawings with my friends.

Challenges & Solutions Challenge: I don’t know how to program Apps. Solution: My dad found an App, called MIT App Inventor, that makes it easy to build other Apps with an easy programming language called Blockly. Challenge: Figuring out how to use the App builder. Solution: Online video tutorials and my dad’s help.

App Building Steps 1.Write user stories that describe what the App user can do with the App. 2.Pick the buttons and other components and figure out where you want them to go on the App screen. 3.Set the properties of the components to make them look the way you want them to look. 4.Program the buttons and other components with pseudo-code then program it with Blockly. 5.Sometimes you need to go back and add a new component in order to get your programing to work. 6.Play around with it and figure out new stuff to build. 7.Repeat.

Iteration #1 – Let’s draw. 1.User stories: a) The user can draw squiggly lines and dots that are red. b) The user can erase the drawing. 2.Components a) Red Button b) Drawing Canvas c) Accelerometer 3.Pseudo-code: a) When Red Button is clicked set the Canvas paint color property to red. b) When Canvas is touched draw a dot. c) When Canvas is dragged draw a squiggly line. d) When the accelerometer shakes clear the Canvas.

Iteration #2 – Baby steps. 1.User stories: a) The user can draw with pink. 2.Components a) Pink Button 3.Pseudo-code: a) When Pink Button is clicked set the Canvas paint color property to pink.

Iteration #3 – Big girl steps. 1.User stories: a) The user can draw with purple and light blue. b) The user can save their drawing. 2.Components a) Purple button. b) Light blue button. c) Save button. 3.Pseudo-code: a) When Purple Button is clicked set the Canvas paint color to purple. b) When the Light blue button is clicked set the Canvas paint color to light blue. c) When the save button is clicked save the drawing to the device.

Iteration #4 –Sharing is caring and games are fun. 1.User stories: a) The user can switch between tic-tac-toe, hangman, and free drawing. b) The user can change the background when free drawing. c) The user can share their drawing with friends. 2.Components a) Background, Mode, and Share button. b) Sharing, Image Picker, and Notifier components. 3.Variables a) Mode & Background – store the current mode and background. 4.Pseudo-code: a) When the mode button is clicked set the Canvas background to the next mode image. b) When the background button is clicked ask the user to choose a background with the image picker or clear the background.. c) When the share button is clicked activate the sharing component.

Programming Concepts I Learned. User stories – stories that describe what the user can do with the App. Pseudo code – when you describe your program in regular English. Components – things that trigger and handle events like buttons and the canvas. Events – shaking, button click, dragging. Variables – containers that store things you want your App to remember.

Links Demo video: My App’s Installer for Android devices: Fyb0pWZWM2SWZr/view?usp=sharing MIT App Inventor Project Files: usp=sharing MIT App Inventor: