Review, Pseudocode, Flow Charting, and Storyboarding.

34
Programming Review, Pseudocode, Flow Charting, and Storyboarding

Transcript of Review, Pseudocode, Flow Charting, and Storyboarding.

Page 1: Review, Pseudocode, Flow Charting, and Storyboarding.

Programming

Review, Pseudocode, Flow Charting, and Storyboarding

Page 2: Review, Pseudocode, Flow Charting, and Storyboarding.

Objectives

• What will you be able to do after this presentation?– Create Pseudocode for a task– Create a flowchart from pseudocode– Understand and define the terms: program,

compile vs. interpret, loop, variable, function, syntax, code, debug, IF THEN ELSE

Page 3: Review, Pseudocode, Flow Charting, and Storyboarding.

What is a Program?

• Instructions given to a computer to complete a task

• Instructions need to be given in a language the computer can understand

• Two methods are used to translate computer languages into Binary

Page 4: Review, Pseudocode, Flow Charting, and Storyboarding.

Compile vs. Interpret

• Compiling must occur before the code is run

• Interpreted code is translated line by line as it is executed

• Some languages use Machine code and others use code that looks like english

Page 5: Review, Pseudocode, Flow Charting, and Storyboarding.

Machine Code

• 0x 60 00 00 80 0x A4 00 00 00 0x 60 01 00 84 0x A4 01 01 00 0x 60 02 00 00 0x 60 03 00 04 0x 60 04 00 00 0x 60 05 00 01 0x 08 00 00 02 0x 20 00 00 03 0x 20 04 04 05 0x 11 20 04 01

Page 6: Review, Pseudocode, Flow Charting, and Storyboarding.

Java Codepublic class nineninebottlesofbeer {public static void main(String[] args) { //99 bottles of beer songbeer(99); } public static void beer( int bottles){ if(bottles > 0){ System.out.print(bottles +" bottles of beer on the wall, "); System.out.println(bottles +" bottles of beer, "); System.out.println("ya'take one down and ya' pass it around"); System.out.println((bottles -1)+" bottles of beer on the wall"); beer(bottles -1); }else{ System.out.println("No bottles of beer on the wall, no bottlesof beer "); System.out.println("ya'can't take one down, ya can't pass it around,"); System.out.println("'cause there is no more bottles of beer on the wall"); } }}

Page 7: Review, Pseudocode, Flow Charting, and Storyboarding.

Python Code

print ('Hmmm... You have 5 tickets to that new movie everyone wants to see.')print ('Whom should you invite to go with you?')movie_friends = []friend1 = input('Enter the first friends name ')friend2 = input('Enter the second friends name ')friend3 = input('Enter the third friends name ')friend4 = input('Enter the fourth friends name ')movie_friends.append(friend1)movie_friends.append(friend2)movie_friends.append(friend3)movie_friends.append(friend4)print ('The friends you are taking to the movie are.')print (*movie_friends,sep='\n')

Page 8: Review, Pseudocode, Flow Charting, and Storyboarding.

Creating a Program

• Decide what function we want our program to perform

• Break the function down into steps• Write the pseudocode (step by step

instructions in English)• Create a Flow Chart of the program• Layout the program(StoryBoarding)

Page 9: Review, Pseudocode, Flow Charting, and Storyboarding.

Program Creation Continued

• Translate the pseudocode into a programming language.

• Test and debug the program• Fix any bugs or errors

Page 10: Review, Pseudocode, Flow Charting, and Storyboarding.

What is Pseudocode?

• Step by Step Instructions• A recipe of sorts• It needs to follow the correct order• Think logically

Page 11: Review, Pseudocode, Flow Charting, and Storyboarding.

Pseudocode Sample

• Function: add two numbers• Pseudocode:

– Start – Get two numbers– Add them– Print the answer– End

Page 12: Review, Pseudocode, Flow Charting, and Storyboarding.

Flow Chart

• Flow Chart for pseudocode example

Start

Input 2numbers

Add them

Output answer

End

Page 13: Review, Pseudocode, Flow Charting, and Storyboarding.

Flow Chart Symbols

• START/END

• INPUT/OUTPUT

• PROCESS

• DECISION

Used at the beginning and end of each flowchart.

Shows when information/data comes into a program or is printed out.

Used to show calculations, storing of data in variables, and other “processes” that take place within a program.

Used to show that the program must decide whether something (usually a comparison between numbers) is true or false. YES and NO (or T/F) branches are usually shown.

Page 14: Review, Pseudocode, Flow Charting, and Storyboarding.

Pseudocode Sample Calculating Age

• Flowchart– Start – Get year born– Calculate age– Print age– If age > 50 print OLD

– End

Get yr

Calc age

Print age

Age>50?OLD Y

N

Start

End

Page 15: Review, Pseudocode, Flow Charting, and Storyboarding.

Elements of a Program

• All programming languages have certain features in common. For example:– Variables– Commands/Syntax (the way commands are

structured)– Loops– Decisions – Functions

• Each programming language has a different set of rules about these features.

Page 16: Review, Pseudocode, Flow Charting, and Storyboarding.

Variables

• Variables are part of almost every program.

• A variable is a “place to put data” and is usually represented by a letter or a word. (Think of a variable as a Tupperware container with a label on it.)

• Variable names cannot contain spaces.• Some programming languages have very

specific limits on variable names.

Page 17: Review, Pseudocode, Flow Charting, and Storyboarding.

Variables Continued

• Usually there are several ways to put information into a variable.

• The most common way is to use the equal sign (=).

• X = Y + 7 means take the value of Y, add 7, and put it into X.

• COUNT=COUNT + 2 means take the current value of COUNT, add 2 to it, and make it the new value of COUNT.

Page 18: Review, Pseudocode, Flow Charting, and Storyboarding.

More on Variables

• Variables may be classified as global or local.

• A global variable is one that can be shared by all parts of a program, including any functions or sub-programs.

• A local variable is one that is used only within a certain part of the program, for example, only in one function or sub-program.

Page 19: Review, Pseudocode, Flow Charting, and Storyboarding.

Syntax

• Programming languages are truly languages.

• They have rules about grammar, spelling, punctuation, etc.

• You need to learn the rules of a programming language, just as you learned to speak and write English.

Page 20: Review, Pseudocode, Flow Charting, and Storyboarding.

Loops

• A loop is a repetition of all or part of the commands in a program.

• A loop often has a counter (a variable) and continues to repeat a specified number of times.

• A loop may also continue until a certain condition is met (e.g., until the end of a file or until a number reaches a set limit)

Page 21: Review, Pseudocode, Flow Charting, and Storyboarding.

Decisions

• You saw a flowchart symbol for decisions.• A program often needs to decide whether

something is true or false in order to see which way to continue.

• Programs often use IF (or IF THEN or IF THEN ELSE) statements to show a decision.

Page 22: Review, Pseudocode, Flow Charting, and Storyboarding.

Decisions Continued

• An IF statement always has a condition to check, often a comparison between a variable and a number.

• The IF statement also must specify what to do if the condition/comparison is true.

• These instructions (for “true”) may come after the word THEN, or they may simply be listed.

Page 23: Review, Pseudocode, Flow Charting, and Storyboarding.

More on Decisions

• In an IF THEN statement, when the condition is false, the program simply ignores the THEN commands and continues to the next line.

• In an IF THEN ELSE statement, commands are given for both the true and false conditions.

Page 24: Review, Pseudocode, Flow Charting, and Storyboarding.

Functions

• In most programming languages, small sub-programs are used to perform some of the tasks.

• These may be called functions, subroutines, handlers, or other such terms.

• Functions often have names (e.g., getName or CALCTAX).

Page 25: Review, Pseudocode, Flow Charting, and Storyboarding.

Functions Continued

• A function generally gets information from the main program, performs some task, and returns information back to the program.

• Functions follow the same rules of syntax, etc. as the main program.

• JavaScript code is primarily made of a series of functions.

Page 26: Review, Pseudocode, Flow Charting, and Storyboarding.

Coding Tips

• Be sure the code is exact (spelling, capitals/lower case, punctuation, etc).

• Write part of the code, try it, then write more.

• Always comment your code

Page 27: Review, Pseudocode, Flow Charting, and Storyboarding.

Debugging

• To “debug” means to try a program, then fix any mistakes.

• Virtually no program works the first time you run it. There are just too many places to make errors.

• When you are debugging a program, look for spelling and punctuation errors.

• Fix one error at a time, then try the program again.

Page 28: Review, Pseudocode, Flow Charting, and Storyboarding.

Storyboarding Thoughts

• Who is my audience• How much real estate• Functionality• Layout• Usability

Page 29: Review, Pseudocode, Flow Charting, and Storyboarding.

Audience

• Determine who will be using the application

Page 30: Review, Pseudocode, Flow Charting, and Storyboarding.

Real Estate

• How much screen space does the application need?

• Will the application need to be mobile?

Page 31: Review, Pseudocode, Flow Charting, and Storyboarding.

Functionality

• What function will the application perform?• What kind of widgets will I need?

– Text boxes– Buttons– Text entries– Scroll bars– Output windows

Page 32: Review, Pseudocode, Flow Charting, and Storyboarding.

Layout

• How will the widgets be placed on the screen?

Page 33: Review, Pseudocode, Flow Charting, and Storyboarding.

Usability

• Is the application intuitive?• Does it lend it self to ease of use?

Page 34: Review, Pseudocode, Flow Charting, and Storyboarding.

Why Plan Design?

• Marketing• Process Roadmap• Employee Turnover• Debugging• Improvements