椙山女学園大学
Development of Teaching Material on the Web
for Computer Programming Education and its
Evaluation
journal or
publication title
Journal of the School of Culture-Information
Studies
number
4
page range
75-89
year
2005-03-31
Development of Teaching Material
Onthel町eb forComp㍊terProgramming
Education and il;s Evaluation
ToyoshiroNAKASHIMA ChiekoMATSUYAMA
1．Introduction
Inuniversitycomputerprogrammingclasses，mathematicaltypeteachingmaterialsarewidely
used．Itisoftenobservedthatthistypeofteachingmaterialmakessornestudentsthinkprogram− mingis difficult and theylose theirinterestin studyingprogramming．Therefore，it has been pointed outthattheuseofnon−mathematicaltype materialmightbebetterl〉．In the authors
PrOgrammingpracticeciass，Studentscreateanimationasprogrammingpracticebecausethistype Of practice willmake studentsinterestedinlearning programming．This type of animation
creationpracticeiswellreceivedbystudents2ト4）
For the animation creation，We prOVide students with materials such as fundamcntals for
Creatingbasicanimation，eXplanations，thereofusageoftheinformation，basicanimationcreation method，its application andits programming examplein prirlted form（black and white）．
However，itisdifficultforstudentstoseetheactualcolorormotioninprintedmaterial，because
SOmeOftheanimationisonlyshownonthescreen anditisdiffictlltforthestudentstoactually reproduce the motion or examine the source code by themselves．In order to overcome those
problems，Wehavedevelopedteachingmaterialsonthewebandactua11yusedtheminprogram− mingpracticeclass．Inthispaper，Wegivethegeneraldescriptionofprogrammingpractice，the Objectiveofdevelopingteachingmaterialsontheweb andguidelinesforit，ageneraldescription Ofmaterialstheireffectivenessand problemswemayseeinthefuture．
2．TheGeneraldescriptionofprogrammingpractice
Juniorstudentsinsocialscienceclassesinouruniversitytaketheprogrammingpracticeclass asshowninTablel．Thisclassisconductedtwotimesaweek．Althoughthestudentsinthisclass havesomeexperienceinusingsomesoftwarelikeExcelorWord，theyhaveverylittleexperience in programming．Thecomputerlanguageusedin thisclassisClanguage，Whichiswidelyused regardlessofbusinessortechnicalapplicationfield．TheUltra−CProisusedbecauseitsupportsToyoshiroNAKASHIMA，ChiekoMATSUYAMA／DevelopmentofTeachingMaterialontheWeb
graphics andis easy forthe beginner to use・Asshownin Table2，the practice startswith
understandingthegeneralconceptofprogrammingand moves on to variables，COnditionals， loopinganditeration，function，array・Afterunderstandingthosefundamentals，Studentspractice usingsimpleexamplesandaregivenanimationcreationassignments． Afterthestudentsstudytheconceptofgraphics，howtousegraphicsfunctionandpractice animationcreationtwotimes（threehourseach），thecreationoftheiroriginalanimationisgiven asafinalassignment・Studentscreatetheirownanimationwithinninehours（2classesx3）． Table E Generaldescriptionofpractice Numberofstudents 40juniorstudents Totalhoursspent 2classes（oneandhalfhourseach）perweek TA（TeachingAsisstant） 3persons Languageused Ultra−CPro（1ifeboard）ontheWindowsenvironment
Contents of practice fundamentalofClanguage，graphics，animationcreation Programminggeneral，uSageOflanguageprocessing，
Table2 Generaldescriptionofpractice Howtocarryoutpractice，Whatisprogramming，algorithmtoprogram 1 andprogramtoalgorithmrelation，prOgramminglanguage，WhatisC 1anguage，howtouseUltra−C 2 HowtouseUltra−C，fundamentalsofClanguage，COnStantandvariable 3 Variable，datatype，displayonthescreen． 4 Inputfromkeyboard，OperatOr 5 Operator 6 Conditionals，loopinganditel・ation
7 How to build function
8 Classandscopeformemorizationofdata，array（value）
9 Array（character），SummaryOfClanguage，graphicsexplanation，Submit
Ofassignment（printsubject，animationcreation） 10 Graphics（exampleofanimation）
田 Practiceworkonassignment
12 Practice work on assignment 13 Practice work on assignment
14 Presentationoffinishedassignment，fillinginaquestionnarireforthis practice
Journa‡ofthe SchoolofCuEture−lnformation Studies，Vol．4，2004
3．Developmentofteachingmaterialsonthewebandguidelines
for this
3．10bjectiveofdeveloplngteaChingmaterialsontheweb
We have already made clearin our previouspaper2ト4）that animation creation usedin this
programmingpracticeclassmadestudentsinterestedinlearningprogramming，andithelpsthe Studentstounderstandtheprogrammingprocessandwhatprogrammingis．Becausetheteaching materialsusedtoexplaingraphicsfunctionwereoriginallyprovidedbyUltra−Candrearrangedby theauthors，aSShowninFig．1，theyareprovidedinblackandwhite．Theexplanationofbasic animationcreationanditsapplicationisalsoprovidedirlblackandwhite．Thereasonwhyblack／ whiteprintingisusedisbecausecolorprintingtakestimeandisexpensive．Althoughthiskindof teachingmaterialbased on printed materialhasthe advantageofeasyduplication and can be
referred to atanytirne，ithasthefollowingdisadvantages． ① Thecolor，Whichisanimportantfactorinanimationcreation，CannOtbedisplayed． ②Itisverydifficulttodisplaymotion，Whichistheobjectiveofanimationcreation． ③Itisverydifficulttomaketheprogramdealwiththemotiononewantstoreferto． ④Itisdifficulttoshowtherelationshipbetweentheprogramanditsrelatedmotion． ToresoIvetheseproblems，theauthorshavedevelopedteachingmaterialsallowingstudentsto displaycolorprintontheirownPC，referenceprogramrningexampleoractualmotionandcopy
and paste on their own PC．These teaching materials areintended to help students create animation．
3．2 Guide‡inesfordevelopmentofteaching materia暮 （1）Installationenvironment
Theteachingmaterialtobedevelopedismaterialontheweb．ThematerialisinstalledinPC
SerVer thatis shared by clientsin practice class．For the operating system and browser，the Window95andIE（InternetExplorer）Ver．5．00raboveareused．Thecomputerlanguageused
for development of teaching materialshould be HTML becauselink function can be easily
achieved andthislanguageiswidelyused．Becausetheenhancementisexpected，SOftwaresuch as homepage buildershould notbe used．Forthe portion HTML does not support，Javascript
Should be used．
（2）Thematerialmustovercometheproblemswhichtheprintedmaterialshaveandshouldbe
ToyoshiroNAKASHIMA，ChiekoMATSUYAMA／DevelopmentofTeachingMaterialontheWeb 3．3 Dr8WLine 直線を描く 【舎式】リOid D柑ⅦLine（別，Yl，把，Y2，色，論の積消，抜の噌） 【説明】始点座標（Xl，Yl）と終点座標（柁，佗）を紹ぶ走抜を描く 【引数】 削，Yl 始点成層 X2，Ⅶ … 終点虐潤 色 … 色のマクロ名、またはRGBを相克する（2．2．1を拳鰐） 抜の積絹 … 繰のマクロ名を指定する（2−2＿2を参乳賀） 抜の幅 … 数字を指定する（2．2．2を参握） 例3 いろいろなスタイルの這級を手品く 【フログラム副 群in（‖u如”即祁hi￠．h” void†伯in（） ‡ ロra止ine（†00，58，250，50，BLJICK，PSOい Dra止ine（100，80，250，￠0，8LflCH，pSOL】 i：ふ 1 2 ’ ’ ’ D D D D ︵リ ．．L し し 1．一一︼ 0 0 nU nV ▲〓■ ︵U S S ▲‖ゝ 相対吋村村村村村村 ①⑦③⑳①⑳￠⑳⑳ ＊ ＊ ＊ ＊ 米 ♯ ＊ 心小 ＊ ／ ノr．′／ ／ ノ′ ／ ／ ノ／ Dra止i幌（100，†柑，250，1柑，8L角CH， Dra止ineく川0，1軋 250，140，BL鏑CK， DraⅥLine（100，17（），250，17（），BL鏑CH， P P P． Dra仏Line（300，50，450，50，臥UE，D自SH，1）； Dra鳩Line（300，BO，戯0，80，GREE‖，D【lT，l）； Dra軋ine（300，110，亜0，110，RE恥 D免S＝DOT，り； Dra伍しine（380，1恥 砺ロ，l恥 V川LET，D角5日DOTDOT， ‡ 【瞬主謀】 ①”⑤ 黒，実線，太さ1…5の論をさ蒜きます．⑥ 音，職級，太さ1の挽、◎ 綿‥怠抜，太さ 1の抜、⑳ 赤，一点錘級，太さ1の論、⑳ 紫，こ免訴級，太さ1の抜を描きます。 （…主：①∼⑳ 真抜以外の級の太さは、1を指定します．） Fig．1Printed materialsampIe
Journa10ftheSchooE ofCulture−Enformation Studies，Vol．4，2004
4．Developmentofteachingmaterialsontheweb
4．1 Basic structure FramestructurethroughoutthematerialhastwoframesasshowninFig．2．Theleftsideframe hastableofcontentsandrightsideframehasanexplanationordescription．Theleftsidefrarne alwayshastableofcontentsdisplayedbecauseitiseasytojumptothepageinthetableofcontentsandrelatedpagescanbeeasilyreferred．Throughoutthewebpage，backscreen pictureon the
descriptionpage andlayoutofthepageshaveaconsistencyofstyleforeasyuse，
4．2 0verallstructure
Becausethismaterialisintended to overcomethe disadvantagesfoundin printed materials，
thisrnaterialbasicallyfollowsthestyleofprintedmaterial．Basicgraphics，COlor，eXplanationsof function and anirnation creation methods are explained morein detail．Furthermore，mOre abundantcolorsareusedforeaseofuse．Fig．3showstheoverallstructureofthismaterial．As illustratedin Fig，3this materialconsists of basic figure，COlor and style of figure，animation，
PrOgrammingexampleandterminology． （りBasicfigure
Points thatmake up basicfigures，Straightlines，reCtangles（rectangles with round corners， polygon），androundishshapes（circles，ellipses，arCS，bowshapes，SeCtOrS）areexplainedandtext
drawingmethodswithgraphicfunctionsthatarenotexplainedinprintedmaterialareexplained．
Intheexplanation，thefunctionsandtheirusageareexplained．Becausethosefunctionsrequire
certain propertiesfor colorand style，the meaningofthe macro name related to the colorof a figurecanbereferencedwheneverrequired．
ToyoshiroNAKASH王MA，ChiekoMATSUYAMA／DevelopmentofTeachingMaterialontheWeb 1．Basic亀gllTe 卜Point トStraightline，khdoflhe トRectar将ular 卜Rectangularwithroundcorner 津01ygon 卜Ci∫Cle，Ellipse 卜Arc トBows‡1ape トSector LOUtpUt character 2．Colorandstyleorfigure トⅩ血dofcolor 卜Style JHatching 3，Animation トHowtocreateanimation トDesi卯 トCoding トDebug 卜Errormessage LTrace 4．Programexample 卜Exampleofbasic最gure LEightanimationexamplesdevelopedbyprevious− SChooトyearstudent 5．Descriptionofterminology Fig．3 0verallstructure （2）ThecoIorandstyleoffigure Becauselinesorfiguresveryoftenhavecolor，themacronamedescribesthecolorofafigure orstyleindetailsothatthecolorcanbeeasilyused． （3）Animation Notonlystaticgraphicscreationbutalsotheanimationcreationmethodisexplainedbyusing examples．Thecoordinatesoftheanimationplanning，design（includingcoding），basicprocedure likedebugging，anditerationthatisnecessarytomovepicturesareexplained・TheanimationGIF
isusedforsome animation−mOtion execution． （4）Theprogrammingexample
Thismaterialhasprogrammingexampleswithbasicfiguresasareferencetotheprogramming， andeightkindsofsourcecodewrittenbythestudentswhopracticedbeforewedevelopedthis materialwereintroduced．The basic figure examplesinclude many examples taken from the
programmingbookandrewrittenbyusinUltra−C．Thesekindsofexamplesincludesomethatare
difficulttomasterinthispracticeclass；thosearepreparedforthestudentswhowanttostudy moreadvancedtechniquessomethingwehopestudentswilllearninordertowritemorecompli−
Journa［of紬e SchooE ofCu往ure−Znformation Studies，Vol．4，2004
cated source codein the future． （5）Term拍otogy
Terminologyusedinprogrammingtextbooksorreferencebooksmakesfirsttimestudentswho
studyprogrammingintheuniversityconfused；theyhavenoideawhatitmeans．Fortheeaseof understanding terminology usedin programmingsuch as“algorithm”，“header file”，“random
numbers”areexplainedinplainsentences．Twenty−fourterminologyitemsareexplained．More
terms need to be added．
4．3 日owto useteaching materials on theweb
Theuseofthematerialisaseasy asbrowsingtheordinarywebpage．itcanbebrowsedby clickingwithamouse．Becausestudentscannotexecutetheprogrammingexampleontheweb
theycopysourcecodeandpasteitontheUltra−CProfileandexecuteit，
4．4 日owthe student has accessto七heteaching materialson the web
Because this materialis based on Ultra−C Pro graphics function to assist students to use graphicsfunction and create animation，this materialisintended to be used onlyin thesocial
scienceclassroom（calledOO5practiceroom）whereUltra◆CProisinsta11edandsoftwareiicense isobtained．Becauseofthis，thismaterialisstoredintheteaching−materialsfolderatthefileserver
that can be accessed by faculty and students．Before students studied how to use graphics functionforthecreationofbasicfiguresandhowtocreateanimationbyusingprintedmaterial andstarttheirassignment，thisteachingmaterialwaspresentedtothemandanexplanationwas glVentOthestudents．Afterthiswasdone，StudentscouldusethismaterialinOO5pclassroomeven afterpracticeclass，untiltheycompleted theirassignment．
5．Evaluation
5．1lnstallation environment Asstatedintheguidelines，thismaterialwasinstalledinthefileserverinthepracticeclassroom wherestudentspracticeprogramming，andthisserverisconnectedtoclientPCusedbystudents vialO−BaseT（10Mbps）throughahub．工twasconfirmedthatclientPCcouldaccessthismaterial byusingIEVer．5．Owithoutanyprobiemduringprogrammingpractice．ToyoshiroNAKASHIMA，ChiekoMATSUYAMA／DevelopmentofTeachingMaterialontheWeb
5．2 Evah」ation ofeffectiveness oftheteaching materials on theweb
（1）Evaluationofeffectivenessoftheteachingmaterialsonthewebbymeansofaquestionnaire
We conducted a survey on the last day of classes for the students who used this teaching
material，tOdeterminetheeffectivenessofit・Thecontentsofthesurveywere：howwellthe explanationswereunderstood，howeasilythismaterialcouldbeused，Whetherthismaterialwas helpfulornot．TheresultsofthesurveyareshowninTable3andFig・4・Fortyusefulresponses wereobtainedfromamongforty−OneStudents（97．6％）．
Table3 ResuEtofsurvey
Question Select Numberof ‡■n Ratio（％）
peSO
Webmaterial 2 5．0
Mostly web material 3 7．5
Whichteachingmate− 21 52．5
rialsdidyouusewhen
Creatinganimation？ Mostly printed material 7 17．5
Printedmaterial 7 17．5 Total 40 100 Easy to understand 23 57，5 Howwellwastheexpla− 12 30．0 nationoftheteaching 4 1 10．0 materialontheweb 0 0．0 understood？ Difficult 2．5 Total 40 100 Toomany 13 32．5 Fairlymany 5 12．5 Difficult to say 19 47．5 Quantityofcharacters Fairlyless 2 5．0 Less 1 2．5 Total 40 100 Easytoview 26 65．0 Fairlyeasytoview 8 20．0 Howeasilywasitviewed 5 12．5 on−SCreen？ Fairlydifficult 0 0．0 Difficult 2．5 Total 40 100 Helpful 30 75．0 Fairlyhelpful 4 10．0 Difficult to say 3 7．5 Wasthematerialhelpful？ Fairlynothelpful 2 5．0 Nothelpful 1 2．5 Total 40 100 82
Journa‡oftheSchoo‡ofCuEture−lnformationStudies，Vol．Lt，2004
①Howfrequentlythismaterialwasused
Table3showsthathalf−and−halfuseofbothprintedmaterialandwebmaterialwasthemost
common pattern（52．5％）．The35％of students（including17．5％of students using printed rnaterialand17．5％ofstudentsusingprintedmaterialfairlyoften）usedprintedmaterial．Onthe otherhand，the12．5％ofstudents（includingthosewhousedonlythismaterialandthosewho fairlyoftenusedthismaterial）usedthismaterial．Thisshowsthat85％ofstudentsintotalhave usedprintedmaterial，andmorethan65％ofstudentsusedthismaterialformorethanhalfoftheir needs．Inthisrespect，itisassumedthattheprintedmaterialiswellorganizedincompactform， andwebmaterialisreferredtosupplementarilytoovercometheshortcomingsofprintedmaterial． Itisclearthatwebmaterialisjustusedtosupplementprinted material．
②Howwe11theexplanationsoftheteachingmaterialsonthewebwereunderstood
As shownin Table3，regarding how weliexplanations were understood，87．5％of students
selected“Easy to understand”（including“Easy to understand”，57，5％，and“Fairly easy to understand”，30％，tOtaling87．5％）．Thosefiguresshowthatthestudentseasilyunderstandthis
matei・ial．
O Quantity oi characters
AsshowninTable3，regardingthequantityofcharacters，47．5％ofstudentsselected“Difficult tosay”，Ontheotherhand，“Toornany”totalled32．5％，and“Fairlymany”tota11ed12．5％，tOtalin 45％ofstudentsselected．Itseemsthatsomepageshad appropriatenumbcrofcharacters and SOme pageShad morethantheappropriatenumberofcharactersforthecontents．Itseemsthat
thisisbecausethosepagesweremixed up． ④Howeasilyviewed AsshowninTable3，“Easytoview”and“Fairlyeasytoview”responsestotalled85％inall． Thisshowsthatstudentsappreciatedtheeasinessofviewingmatcrial．
⑨Howhelpfulthematerialwas
Basic触ure Co】oroデ軸ure ‖owto create animat…on Design Coding Debug E汀OrmeSSage Trace Programexample Other Fig．4 ResultoritemsviewedToyoshiroNAKASHIMA，ChiekoMATSUYAMA／DevelopmentofTcachingMaterialontheWeb
AsshowninTable3，“Helpful”wastheresponseof75％ofstudentsand“Fairlyhelpful”10％， totaling85％．Itisclearthatthismaterialwashelpfulformostofthestudents．
O Items vievved
Fig．4shows the frequently vieweditems selectedin the questionnaire andlists themin
frequencyorder．AsshowninFig．4，themostfrequentlyvieweditemwasthecolorandstyleof figure（40％），thesecondoneistheexampleofprogramming，andthethirdoneistheanimation creationmethod（47．5％）andthefourthoneisbasicfigures（32．5％）．Thisshowsthatstudents
mostfrequentlyviewedthecolorandstyleofthefiguretheywanttocreate．
Asseeninthequestionnaire，thismaterialisappreciatedbythestudents，andtheyrecognize that this materialis helpfulfor animation creation，eaSy tO uSe and easy to understand．The
reasonswhystudentsappreciatedthismaterialare：
①Animationcreationisvisuallyunderstoodinrelationtoprogrammngexample・ ②Therelationbetweensourcecodeandanimationmovementiseasilyunderstood．
③wheneverstudentsneedtoviewsourcecode，theycanopenthesourcecode，COpyitandpaste
to see the animation movement．
Viewingmanyprogrammingsampleshelpedstudentsunderstandwhattheycan dowith the
programmingandputtogethertheirideas．Inthisrespect，itisclearthatteachingmaterialonthe webwashelpfulforthestudentstounderstandprogrammingandanimationcreation． （2）Comparisonbynumberofsourcecodesteps Toseehoweffectivethismaterialis，WeCOmparedthenumberofsourcecodestepsafterthis materialwasused andbeforethismaterialwasused．Thenumberofsourcecodestepsisawell knowncriteriontomeasurethesoftwareproductivity4），andweusethistoevaluatethevolumeof theprogramsstudentshavedeveloped，Thenumberofsourcestepsweusedheredoesnotinclude stepssuchasspaceline，（〉1ine，COmmentline．Table4showsthenumberofsourcecodesteps
before students used this materialand Table5shows the number of source code steps after
studentsusedthismaterial．Fig．5andFig．6showthedistributionmapofsourcecodestepsof Table4andTable5foreverytensteps．Table4andFig．5showthataveragenumberofsteps
beforethismaterialwasusedwasabout40stepsandvariesfrom7stepsto120steps．Thelargest
distributioncoversfrom20stepsto29stepsandithas28．9％，and97．4％ofalldistributionhasless
than80steps．Table5andFig．6showthataveragenumberofstepsintheschoolyearafterthis
materialwasintroduced was129steps，and this became threetimes of steps seen before this materialwasintroduced．The distribution ofsteps rangesfrom24to564and has widerrange comparedtothedistributionbeforethismaterialwasintroduced．
Overalldistributionshiftedtothesideshowingalargernumberofsteps．Itisalsoclearthat
beforethismaterialwasintroduced，97．4％coveredlessthan80steps，butafterthismaterialwas introduced，Only34．1％coveredless than80steps，While65．9％covered more than80steps．
Journa10ftheSchoorofCu江u「e・lnformationStudies，Vol．4，2004
Tab‡e4 List of LOC and FP，and characteristics before this materiai was introduced
Tab蔓e5 Listof LOC and FP，and characteristics afterthis materiaE wasintroduced No． LOC FP 23 2 39 4 3 16 4 4 40 3 5 17 3 6 43 8 7 7 2 8 76 7 9 71 2 10 120 15 76 ＝ 12 37 4 13 56 5 14 75 15 15 29 つ J 16 26 3 17 20 3 18 42 7 19 33 2 20 41 7 21 56 6 22 16 5 23 29 5 24 23 6 25 60 9 26 13 8 27 22 4 28 22 5 29 38 8 30 21 7 31 37 4 32 51 7 33 17 9 34 25 3 35 58 4 36 43 5 37 23 8 38 71 3 Average 39．8 5．8 Median 37 5．0 Distribution 555．6 9．9 Range 113 13 Minimum 7 2 Maximum 120 15 Mode 23 3 No． LOC FP 157 17 2 229 12 3 64 9 4 80 12 30 7 6 69 10 7 90 8 47 11 9 105 12 10 92 7 24 5 12 120 7 13 312 16 14 46 9 15 81 21 16 141 12 17 149 16 18 115 7 19 176 22 20 41 8 21 214 20 22 142 12 23 61 7 24 64 8 25 136 13 26 177 15 27 424 22 28 92 6 29 52 8 30 88 9 31 173 18 32 40 / 7 33 278 8 34 158 35 55 10 36 155 7 37 40 7 38 96 9 39 564 19 40 26 6 41 85 13 129．0
ToyoshiroNAKASHIMA，ChiekoMATSUYAMA／DevelopmcntofTeachingMaterialontheWeb
Regarding median，before this materialwasintroduced the median was37steps；after this materialwasintroducedthemedianincreasedto92steps，tWOpOintfivetimesmorethanbefore．
Asshownhere，afterthismaterialwasintroducedasubstantialincreaseinthenumberofsteps
occurred andthisrevealstheeffectivenessofthismaterial． 一・⊥ 0 9 8 7 ごU 5 4 3 ウ︼ 1 0 11 uこSJ︹︶ユ のN∽∼○銅∽ のー∽∼○−∽ の○の∼00∽ のの銅∼○のN の∞銅∼○∞銅 の卜銅∼○卜N のり朗∼○∽N の∽銅∼○∽銅 望品∼○廿N の∽銅∼○∽別 のNN、／○銅別 のl銅∼○−銅 のON︶t00N ののー∼○のl の∞−∼○∞l の卜−∼○卜t の瓜−∼○めl ≡こ∼こ〓 の∽l∼○∽− のNl∼○銅︷ ︹〓∼○〓 の01・／00− のの∼○の の∞∼○∞ の卜∼○卜 の￠∼○り のめ∼○∽ の寸∼○寸 のの∼○の のN∼ON のt∼○− の∼○ LOCFig・5 Distribution or the number of source code steps before this materialwasintroduced 9 8 7 6 5 4 3 ウ︼ 1 0 仁○∽hむd 票芯∼白茶 のN寸∼ON寸 のNの∼ONm のTの∼○︻m の○∽∼00m ののN∼10の別 の∞N∼○∞別 の卜N∼○卜N 票㌫∼○りN 仇蛤N∼○∽N 望品∼望品 のの銅、く○∽N のNN∼ONN のlN∼．〇−別 のON∼00N ののー∼○のー の∞−∼○∞l のトー∼○卜t の∽t∼○昭一 の寸l∼○寸T の叩l∼○のl のNT∼○銅− コ〓−︵こ〓 票ニー︵こごl のの∼○の の∞∼○00 の卜∼○卜 のり∼○り の∽∼○め の慨∼○慨 のの∼○の のN∼ON のーーl01 の∼○ LOC
Fig・6 Distributiol−Ofthe number orsourcecodesteps a丘erthis materialwas
introduced
Journalofthe Schoor ofCu眈re−Enformation Studies，Vol．4，2004
（3）ComparisonbyfullCtionpoint
To measurethe effectiveness ofthis material，We uSed the function points ofthe animation studentscreatedand comparedthosebeforeandthoseafterthisrnaterialwasintroduced．The functionpoint5ト8）isalsousedasameanstomeasuretheproductivityofsoftwaredevelopmentand itisdefinedinTable6．Weaddedupa11thefunctionpointsthatwereincludedintheanimation anddeterminedthetotalnumberoffunctionpointsfortheanimation．
Table4and5showthenumberofFP（FunctionPoint）definedinTable6andthecharacteris−
ticsobtainedbeforeandafterthismaterialwasintroduced．Fig．7and8showthedistributionof FP foreachschoolyear． Table4andFig．7showthattheaveragenumberofFPwas5・8，andtheirdistributionhada relativelywiderange（fromminimum2tomaximum15）．The18％ofallnumbersofFPis3and 92．1％ofallnumbersofFPislessthanlO．Ontheotherhand，Table5andFig，8showthatthe averagenumberofFPaftertheintroductionofthismaterialwasll・4，apprOXimatelytwotimesTable6 Definition offunction point
Function Description Onepictureasawholeiscountedashavingoncfunction． Drawpicture Backgroundpicturesarea11puttogetherandcountcdasonefunction；Painting withonecolorisalsodefilledashavingonefunction． Movementofpicture（includingpartofpicturc）isdefinedasonefunction． Movement Thechangeofdirectionofmotionisdefinedasonefunction． Changeofcolor ThechangeofcolorinbaclくgrOundorpictureisdefinedasonefunction． Multipleofpicturcs Multiplecopiesofthesamepicturearedefinedasonefunction． Order Picturessuccessivelydrawnaredefinedasoncfunction． Flash Flashsuchasblinl（ingstarisdefinedasonefunction． Thcpartialchangeofpicturcshapeorpartiallyaddingpictureisdefincdasone Partialchange function． Drawingpicture）Themultipleplacementofthesamcpictureisdefilledasone function，Called“multipleplacement”． Movementl）Movementofthesamepictureinthesamedirectionisdefinedas onefunction，Called“multiplemovements”（Ex．Incaseofrain，SnOWOr shootingstarmovement，multiplemovement＝2functions）． Regardlessofsourcecode，Whentheprocessisbelievedtobethesame，the movementsaretogetheraredefinedasonefunction． Movement2）Movementinbothdirectionsisdefinedasonefunction，Calledthe Notes “changeofdirectionoflllOtion”． Changeofcolor）RegardlessofthenumberofcolorsinvoIved，thechangeof colorisdefincdasonefunction（Ex．Fireworks）．Eachchangeofcolorin thesceneisdefinedasonefunction（Ex．Morning−＞noon−＞night．Springく＞ sulllmer−＞ねlト＞winter）． Others）Whentherandomprocessisemployed，byusingfunctio11SSuChas randomnumbers，itsdegreeisconsideredandsimplydefinedasonefunc一 tioncalled“randomnumberused”（Rainorsnowgetsonefunctionpoint， blinl（ingstargetsonefunctionpoint）．
ToyoshiroNAKASHIMA，Chiel（OMATSUYAMA／DevelopmentofTeachingMaterialontheWeb
5 4 3 2 1 0
Uこ℃L雲−
2 3 4 5 6 7 8 910111213141516171819 20 2122 FP
Fig．7 FPbefbrethis materialwasintroduced
5 4 3 ウ︼ 1 0 琵OShむd 2 3 4 5 6 7 8 910111213141516171819 20 2122 FP Fig．8 FP afterthismaterialwasintroduced thatnumberbeforeintroduction，andithadamuchwiderrange（fromminimum5tomaximum 22）withlargernumbersofminimumandmaximum．Overa11distributionshiftedtowardsalarger numberofFP．Beforeintroductionofthismaterial，92．1％hadlessthanlOFPnumbers，While afterintroductionthiswasreducedto46・3％withtheremaining53．6％havingmorethanlOFP
numbers．Median was alsoincreased tolO，Whichis two times that before this materialwas introduced．As shown here，itis clearthat afterintroduction of this materialintroduction FP
Journat ofthe SchooE ofCu‡tu「e−Enformation Studies，Vol．4，2004
greatlyincreased，Simpleanimationwasreplacedbycomplexanimation，andfigureswithmultiple
colorswereused．Itcanbethoughtthatintroductionofthismaterialhelpsstudentsbyallowing themtorefertothismaterialwhiletheyareconsideringorcreatinganimation，andthisleadsto
anincreasein FP of animation creation．It can be said then，inshort，that this shows the
effectiveness ofthis material．
Lookingatthesurveyresults，andacomparisonofsourcecodeforanimationcreation，itcan
besaidthatthisteachingmaterialontheweb contributestotheincreaseinFP andthevolume
of animation created．
6．Conclusion
The teaching materialwe have developed to help students understand difficultissuesin creatinganimationandmakeupfortheshortcomingsofprinted materialhasworked asitwas
intendedandachievedsubstantialresults．Wewishtoimprovethismaterialbyexamininghowthe
studentsareusingthismaterial，SOthatitwillbemoreeffectiveinthefuture．
Wewouldliketothank MsTakahashiforhersupport．
References
（1）M．Yasumura，et al：“A CaseStudyofComputerLiteracy Education”，IPSJ，Vol．32，No．12，PP．1310−1316
（1991）（inJapanese）
（2）C．Matsuyama，T．Nakashirna：“EffectsofMakingProgram−GeneratedAnimationin aPl・Ogl・ammingClass”，
Recordof2001Tol（aトsectionJointConfercnceofTheeightInstitutcsofElectricalandRelatcdEngineers，Pp．
305（2001）（irlJapanese）
（3）T．Nakashima，C．Matsuyama：“Assesments of a Programming Seminar and Effects of Malくing Program− GeneratedMovingPictures”，JournalofSugiyamaJogakuenUniversity，No．33，Pp．7−20（2002）（inJapanese） （4）T．Nakashima，C．Matsuyama：“An Attempt of Animation Creationin Computer Software Programming
EducationanditsEvaluation”，JournalofSugiyamaJogakuenUniversity，No．35，pp．7M17（2004〉 （5〉 R．S．Pressman：“SoftwareEngineering”，McGrawl寮Il，NewYork（1992）．
（6）AliBehforooz，FrederickJ．Hudson：“Software EngineerirlgFundamentals”，Oxford University Press，New
Yorlく（1996） （7〉 CapersJones：“AppliedSoftwareMeasurement”，McGraw−Hill，NewYork（1991） （8）K．Kodama：“PracticeforFunction PointMethod”，NihonnouritsuliyOukaiManagementCenter，Japan（1999） なかしま・とよしろう／文化情報学部教授 E−mail：nakasima＠sugiyama−u．aC．jp まつやま・ちえこ／文化情報学部助手 E−mail：Chiekom＠sugiyama−u．aC．jp
