1

EstimatingEffortforCross-platformWebApplicationDevelopment

AbstractTheubiquityofeverfasterInternetconnectionandthedemocratizationofInternetofThings(IoT) devices have significantly contributed to the proliferation of web applications. Suchapplications transcend software and hardware boundaries allowing user interaction ininnovativewaysthatwereunheardjustadecadeago.Modernwebapplicationsareawareoftheir surroundings through the use of Global Positioning System (GPS), gyroscope andaccelerometersensors;arehumanfriendlyandcommunicatenaturallyusinggesture,voiceandtouch;understandiftheuser isaccessingtheapplicationwhiledrivingacar,sittingathomeorjoggingoutdoors.Understandingtheparticularsofdifferentplatformsandthelimitationsfromamultiverseofdevices requires discipline, technical knowhow and toil. It requires methodology thatcomprises the tools tocorrect identify, classifyandcalculateeffort.Thispaperproposesabetter model for cost and time estimation for web applications, as well as discussingcharacteristics that are often unaccounted using established effort estimation methods.Special focus isplacedoncross-platformandusercontextrequirements,thispaperarguesthatthecostandtimespentonthesetwoareasareoftenunderestimatedduetothelackofacompleteframeworkinthecurrentliterature.Three established effort estimation methods are compared;Web Model (WEBMO), CostEstimation, Benchmarking and Risk Analysis for Web (Web-COBRA) and Object OrientedMethodFunctionPointsforWeb(OOmFPWeb).UsingOOmFPWebasthebasemethodologythispaperdemonstrateshowitcanbeextendedtoaccountforcross-platformrequirementsbyaddinganewmodelintoOOmFPWebframework.ThismodeliscalledPlatformModelandisusedtoquantifycross-platformeffortintomeasurableunits.

KeywordsEffort Estimation, Mobile Applications, Internet of Things, Object Orientation, SoftwareMeasurement

2

Contents1.Introduction2.UniqueChallengesofWebApplicationProjects

2.1Disambiguation 2.2Cross-platformavailability 2.3BrowserFragmentation 2.4UserInteraction 2.5GraphicalUserInterface 2.6Hardwareconstrains 2.7Networkconstrains 2.8Storageconstrains 2.9.Webapplicationdevelopmenteffort3.Reviewofavailablewebeffortestimationmethods 3.1Reviewedmethod:WEBMO 3.2Reviewedmethod:Web-COBRA 3.3Reviewedmethod:OOmFPWeb4.ProposedSolution 4.1DefiningtheChosenModel 4.1.1IdentifyingFunctionalRequirements 4.1.2TheOOmFPWebConceptualModels 4.1.3ThePlatformModel 4.2MeasuringFunctionalRequirements 4.2.1Identifyingapplicationboundaryandscope 4.2.2IdentifyingdataandTransactioncandidatefunctions 4.2.3Countingdataandtransactionfunctions5.ApplyingtheChosenModel 5.1DefiningaHypotheticalWebApplication 5.2IdentifyingApplicationBoundary 5.3IdentifyingTransactionFunctions 5.4IdentifyingDataFunctions 5.4.1IdentifyingObjectModelUnits 5.4.2IdentifyingDynamicModelUnits 5.4.3IdentifyingFunctionalModelUnits 5.4.4IdentifyingNavigationandPresentationModelUnits 5.4.5IdentifyingPlatformModelUnits 5.5CountingDataandTransactionFunctions6.ConclusionandFurtherWorkAppendixReferences

3

3

1.IntroductionItishardtoestimatethetotalnumberofInternetconnecteddeviceswithabrowserandtheabilitytoaccesswebapplications.Ericssonestimatesthattherewillbeby2021around28billionconnecteddevices[1],manyofthosedeviceswillbeabletoaccessapplicationsviaawebbrowser.AstheIoTecosystemmaturesanddiversifies,thewayweinteractwiththosedeviceswillalsoevolve.Wealreadyseetodayatrendintheuseofvoicecontrols[2]wheretheusercaninteractwithawebapplicationusingonlyvoicecommands.Theglobaltrendtowardsmoreconnecteddeviceswilllikelycorrespondtoariseincomplexityfor web application development, which should increase in parallel to the number ofplatforms that offer Internet access via web browser. These new applications compelmethodology that takes in consideration web software cross-platform characteristics andoffernewtoolsthatcanquantifythecomplexityofimplementation.Availablesoftwareeffortestimationmethodswere conceived decades before the popularization ofmobile and IoTdevices, consequently thosemethodshavenotbeen initiallydesignedwithmodern cross-platformrequirementsinmind.Thispaperarguesthatwebapplicationsrequireadifferenteffort estimation method, a method that can translate cross-platform and user contextrequirementsintonumericalquantifiableunits.Cross-platformrequirementsareallthelogicalevaluations,storage,ordatapresentation,thatarenecessarytoenableanapplicationbeaccessedondifferentplatforms.Thispaperarguesthat those requirements are unique to modern web software, and that available effortestimation methods are unable to comprehensively account for those peculiarities andlimitations.Usercontextrequirementsareallthelogicalevaluationsthesoftwareperformsto understandwhat the user is doingwhile interactingwith the application. This contextawareness can then be used to personalize how the software interacts and displaysinformation.Thispaperarguesthatcontextawarenessismostlyoverlookedbythecurrentliteratureandthatcontextartefactunitsareunaccounted.Hence,themainobjectiveofthispaperistopresentaproposalforanestimationmodelforweb applications, as well as discuss the characteristics that are unaccounted for usingavailableeffortestimationmethods.Chapter2discussesindetailsthetechnicalrequirementsandlimitationswebapplicationprojectsneedtoovercomewhencreatingcross-platformandcontextawaresoftware.Chapter3evaluates threeeffortestimationmethods,ReiferWebDevelopment:EstimatingQuick-to-MarketSoftware[17],Ruheetal.CostEstimationforWebApplications[18],andAbrahãoetal.EvaluatingaFunctionalSizeMeasurementMethodforWeb Applications: An Empirical Analysis [4]. Chapter 4 introduces the PlatformModel toOOmFPWeb effort estimation framework. Chapter 5 demonstrates how to apply the newOOmFPWebframeworkusingahypotheticalwebapplication.Finally, inchapter6,arethefinalconsiderationsandconclusionsofthispaper.

4

2.UniqueChallengesofWebApplicationProjectsInthischapter,someofthemorechallengingrequirementsofwebapplicationprojectswillbe discussed.Many of these requirements did not existed a decade ago, they reflect thepresentconsumermarketweresoftwareisomnipresent,andinteractioncanhappeninmanyforms from countless devices. Each section concentrates on a specific cross-platformdevelopment challenge that highlights the difficulties software developers and projectmanagersmustovercomewhenestimatingdevelopmenteffort.The potential of building once and deploying everywhere independent of hardware oroperationsystem(OS)allowingorganizationstodirectlyreachcustomersisthedrivingbenefitof web applications. Although web applications currently underperform devices nativeapplications, the lower cost and cross-platform availability might prove essential fororganizationstryingtosupportlargenumberofcustomerswithoutwritingplatform-specificimplementationsoftheirapplication[6].Thepopularityofwebapplicationshascontinuouslygrowththroughtheyears.AccordingtoaglobalonlinesurveycommissionedbySencha(2015)with120 senior leaders inNorthAmericaandWesternEurope, there isa shift away fromnativeapplicationdevelopmentas27%oforganizationsplan tomove fromnative towebtechnologies[7].Whilecross-platformsoftwarehasclearbenefits,thedevelopmentanddeliverychallengesare more unclear due to the speed technology evolves. Existing platforms and futureplatformsthatwillbecreatedintheupcomingyears,requireamultitudeofplatform-specificsoftware optimizations. A well-designed cross-platform application, takes into accounthardware and software limitationswhile offering an optimal user experience (UX) that istailoredforeachplatform.Mobiledeviceshavedistinctiveparticularitiesliketouchscreenandlimiteddisplayresolution,whileSmartTVshaveentireoppositecharacteristics.

2.1DisambiguationThewebapplicationtermisoftenbroadlyusedtocategorizeallapplicationsthatareavailableviatheInternet.Thispaperdistinguishesbetweentwogroupsofweb-basedapplications,thefirst called web applications, and the second cloud applications. Web applications areexclusivelydesignedtobeaccessedviawebbrowsermakingthenplatformindependentandfullyself-containedinsideabrowserwindow.Thetechnologyusedisacombinationofserver-sideandfront-sidescripting.Intheserver-side,programminglanguageslikePHP,C#,RubyorJavaarecommonlyused,whileinthefront-sidethetechnologiesappliedareacombinationof Javascript,HTMLandCSS.Thewebbrowseractsasathinclientperforming lightweightcomputation, just-in-time compilation (JIT), and information presentation. Complexcomputationisperformedbythewebserverorseveralwebservers,thususinglesshardwareand software computation from the end user device. Using this architecture, the webapplicationcanbeavailabletoabroadernumberofdeviceswithhardwarelimitationssuchlowprocessingpower,limitedmemory,andrestrictedlocalstorage.

5

Figure1:WebApplicationArchitecture

Cloudapplicationshavesimilarcharacteristicsaswebapplicationsandcanprovidethesamefeatures. Anyhow cloud applications offermore advanced services such asmulti-tenancy.They canbeequally accessedviaawebbrowseroranyotherapplicationusingHypertextTransferProtocol(HTTP).Cloudapplicationsdonotnecessaryhaveafront-sidegraphicaluserinterface (GUI), instead data Input and output (I/O) is performed via an applicationprogramminginterface(API).2.2Cross-platformavailabilityCross-platformavailabilityisthebiggestdifferentiatorbetweentraditionalsoftwareandwebsoftware. To achieve seamless user experience on multiple devices the developer mustovercomeseriesofplatformspecifichardwareandsoftwarelimitations.Hemustunderstandthedifferentcontextstheuserinteractswiththeapplication,andthen,dynamicallytailortheexperienceaccordingtothedevice.Anexhaustivelistofalldifferentplatformsabletoaccesswebapplicationsviawebbrowserwouldbecumbersometocompilebecausenewdevicesarecontinuouslybeingreleasedintotheconsumermarket.Table1illustrateshowdiversetheconnecteddeviceecosystemis[5],themore popular devices aremobile phones, tablets and desktops. Anyhow as hardwarecomponent costs decrease and Internet connection becomes common place, webapplicationswillexponentiallybeusedfromotherplatforms.Whilewebsoftwareispromptlyavailableonanydevicethroughawebbrowser,ithasalsouniquechallenges.Handlingthepeculiaritiesof eachdevice canbe complexand time-consuming.Developersneed to testdifferent devices, understand distinctive packaging details, evaluate diverse networkperformance,optimizeI/O,andthecontextinwhichtheapplicationisused.

6

Table1.ExistingplatformsthatofferawebbrowserPlatform Network Input/outputDesktopcomputers

WiFi, Ethernet, 2G, 3G, 4G,LTE

keyboard, pointing device, voice, gesture,touchscreen

Mobilephones WiFi,2G,3G,4G,LTE touchscreen,voiceTablets WiFi,2G,3G,4G,LTE touchscreen,voiceSmartTVs WiFi,Ethernet keyboard,pointingdevice,voiceGameConsoles WiFi,Ethernet Keyboard,voiceWristwatches WiFi,Bluetooth,2G,3G,4G,

LTEtouchscreen,voice

Ebookreaders WiFi,2G,3G,4G,LTE touchscreenDigitalcameras WiFi touchscreenCars WIFI,3G,4G,LTE touchscreen,voiceHomeappliances WiFi,Ethernet touchscreen,voiceSmartglasses WiFi,Bluetooth gesture,voice,touch

Software developers will gradually rely more on methodology that correctly takes inconsideration cross-platform requirements, even if the application only target a specificplatform.Theend-user isnotalwaysawarethatawebapplicationhasbeendesignedandoptimizedonly fora limitedsetofdevices.He isunawareofdevelopmentcomplexityandprobableassumesthattheapplicationworksonanydevice.Iftheuserinteractswiththewebapplicationfromadevicethatwasnottestedbythedeveloper,theuserexperiencecanbesuboptimalastheapplicationmayfailtocorrectpresentinformationthatshouldfitthedevicescreenoronlyofferskeyboardinputwherevoiceinputwouldbeideal.2.3BrowserFragmentationThebrowsermainpurposeistopresentwebresources[9],whencombiningtheseresourcesa developer creates a web application. The browser abstracts the complexities of theoperationsystem(OS)whileprovidingastandardizedplatformforthewebapplicationtobeaccessed.Theabilityofcreatingsoftwareforoneplatformandusingonmultipleplatformsismorecosteffective[6],butnoteasilyachieved.Writingportableapplicationsthataccuratelyworkacrossplatformsisevenmorechallengingduetomultiplebrowservendorsandversions.Differentbrowserscompiletheapplicationslightestdifferent[8]duetovariationsinrenderingengines, and even different versions of the same engine can lead to different results. AsAugust2016,thereare9popularbrowsersglobally[Figure2].ThebrowsermarketleaderisGoogleChromethatondesktopalonehas4differentpopularversions[Figure3].

7

Figure2.Top9browsersonAugust2016ondesktop,mobile,tabletandconsole(Source:statcounter)

Figure3.DesktopbrowserversionmarketshareonAugust2016(Source:netmarketshare)

Web browsers andweb standards are constantly evolving. The latest versions ofmodernbrowsers offer very consistent support for web standards [10]. Anyhow while webapplicationsarehostedremotelyserver-sideandaredynamicallyupgradedwithoutend-useraction,thebrowserapplicationitselfdoesrequiretheusertomanuallyupgradethelocallyinstalledsoftware.Becauseofthismanualrequirement,iscommontofindoutdatedversionsofavendorbrowserbeingused.Webdevelopersarewellawareofsuchshortcomingsandapplydifferenttechniquestomitigatetheproblem.OneofthosetoolsisawebapplicationthatscoresdifferentbrowsersimplementationofHTML5technologiestoamaximumof555

8

points[Figure4].FromlookingatthescoringboardisclearthatnotallvendorsandbrowserversionsofferthesamesupportforHTML5,thetestdoesprovideabreakdowndetailofallevaluatedfeatures,anyhowunderstandinghowallthesevariableswillaffectaspecificwebapplicationoftenrequirestrialanderror.Figure4.DesktopbrowserHTML5supportcomparisononNov2016(Source:html5test)

2.4UserInteractionInteraction with web applications often happens in a broader context than traditionalapplications. While traditional on-premise software has a well-defined user target and isconfined to a specific platform, web applications are used in a wider context by manyplatforms.Agoodwaytovisualizethismulticontext interactionisby imaginingacalendarapplication that can be accessed from a smart watch during outdoor running, or from adesktopcomputerwhensittingathome.Whilerunning,theuserhasnoaccesstoakeyboardandthesmallscreenresolutioninthewatchmakesitunpracticalfortyping,theuserinsteadinteractswiththeapplicationusingvoicecommands.Anyhowwhenthesameapplicationisaccessedfromhomeonadesktopcomputer,theinteractionisperformedusingmouseandkeyboard. Only by implementing both I/O mechanisms the application can be fully userfriendlyanddeliveranoptimalexperience.ModernbrowsersandthelatestwebstandardsprovideavarietyofAPIscapableofcollectingdifferentuserinputs,thisdataisthentransmittedtothewebapplicationthatcandynamicallydetectthedevicetypeandoptimaloutputmechanism.ThelatestversionofHTML5gathersdata from a broad array of sensors present on mobile or non-mobile devices includingcompasses,gyroscopesandaccelerometers[11].Anapplicationthatoffersmultipletypesofinteractionrequiresthedevelopertocarefullyevaluatetheplatforms,thebrowsersandthecontextinwhichtheend-useraccessesitsservices.Becausenotallbrowsersofferexactlythesametechnologyparity[Figure5]extratestingandtroubleshootingisoftenrequired.

9

Figure5.HTML5APIDeviceOrientation&DeviceMotioneventsonNovember2016(Source:caniuse)

Where:greenerthecolorhighestthesupport,andredmeansnosupport.

2.5GraphicalUserInterfaceDevelopinguserfriendlywebapplicationsrequirescarefulplanningduetothefragmentedmobiletechnologylandscapewheredevicecapabilitiessuchasscreensize,inputtypesanddisplayfunctionalitiescanvarydramaticallyfromvendortovendor[12].Therearedifferentwaystodesignwebapplicationinterfaces,thesimplestapproachwouldbeenablingthewebapplicationUItoberesponsive.Graphicalelementswoulddynamicallyscaleandresizetothedevice screen resolution, that approach works similar to the way traditional softwareoperates. The secondmost expensive approach, is in creatingmultiple interfaces that areoptimized toeachplatformwhere theapplication isbeingused.PopularwebapplicationsoftencombineresizingondesktopandaredesignedUIonmobiledevices.Device screen sizes vary greatly between platforms [Figure 6]. Tablets andmobile phonescreensalsorotateaccordingtothewaytheuserishandlingthedevice,onthesecases,extratesting is also required to guarantee GUI elements adjust according on both vertical andhorizontalpositions.Mobiledevicesarealsoknowntobeslowandoftentakemoretimetoload web software [13], those differences in performance can be mitigated by creatingmultiple assets that are optimized for some of the most common screen resolutions.Hardware intensive UI elements such images, animations and video are transcode intomultipleversionsrangingfromlowtohighquality,thenlogicinthewebapplicationassociatesthe correct asset resolution to a specific device. In the case of a Smart TV assets can bepresentedinfullhighdefinition(HD),whileonamobilephoneimagesarerescaleddowntoalowerresolution.

10

Figure6.Differencesinscreensizeacrossplatforms

2.6HardwareconstrainsAconnecteddevicehardwareperformancecanplayasignificantpartonhowwebapplicationsperform,speciallyregardingthecomponentsassociatedwiththerenderingandprocessingofinformation. Studies have demonstrated that more powerful hardware reduces browserdelaysbyacceleratingOSservicesandnetworkstack[13].Webapplicationstargetingbroaderconsumermarketpenetrationmustconsiderhowpageloadingtimeswillpotentiallyaffecttheuserexperience.Consumerstolerablewaitingtimeforinformation is approximately two seconds [15], testing and adjustments of the webapplicationcomponentsmayberequiredtostaybelowtheacceptedwaitingthreshold.Thoseadjustmentsmaychangedependingondevicehardware.Inmobiledevicesalonethereisasignificant difference in performance [Figure 7].When addingmore platforms, e.g. Smartwatch,SmartTVandautomobilethecomplexityincorrectestimatinghowawebapplicationperformsincreasesexponentially.

11

Figure7.DifferencesinJavaScriptengineperformancebetweenmobilephones.Benchmarkperformed on Google Chrome and Internet Explorer browser. Higher is faster. (source:GoogleOctane)

Thelifecycleofaconnecteddevicealsoneedcarefulconsideration.Consumerexpectanceisthatmostelectronicswilllastanaverageof5years,anyhowexpectancyisdifferentbetweenproducts. Flat panel TVs have the longest expected life, reaching 7.4 years, whilemobilephones have the shortest life expectancy at 4.7 years [14]. This disparity in the paceconsumersupgradetonewerdeviceseventuallyleadstosomeplatformsbeingmuchfasterandusingnewertechnology.

2.7NetworkconstrainsWebapplicationsperformancearehighlydependentonnetwork speedas the applicationcomponentsarehostedinthecloud.Underliningtechnologysuch3G,4GorDSLsignificantlyimpactuserexperience.Differences innetwork latencycan leadtoapplication issuessuchtimeout of critical components and asynchronous failures. Tomitigate these issues,whendesigningwebapplicationsisimportanttohavegoodmeansformeasuringexistinglatenciesas well as simulating new latencies throughout all parts of development. Developers arerequired to spend considerable time trying to reproduce bandwidth and web applicationperformancebottlenecksondiversenetworktechnologies.Networkperformancenotonlydiffersbetweendevices,butalsobygeographiclocation.InEuropean countries alone there is a pronounced difference in Internet speeds, from thefastest average connection in Sweden scoring17.4Mb/s to Italybeing the slowestwith aspeedaverageof6.5Mb/s[Figure8].

0 1000 2000 3000 4000 5000 6000 7000 8000

LGGFlex2

AppleiPhone6Plus

SamsungGalaxyS6

HTCOneM9

MotorolaMotoX

SonyXperiaZ3Compact

LGG2

AzusZenfone5

NokiaLumia930

MicrosoftLumia640

12

Figure8.AkamaiQ32015rankings–Europe.Higherisfaster.(source:Akamai[stateoftheinternet]Q32015report)

2.8StorageconstrainsAswebapplicationsbecomemoresophisticated, information in the formofpersonaldata(consumer-driven)andbigdata(enterprise-driven)needstobesecurehandledandstored.Muchofthisdataisstoredinthecloudandaccessedondemandfromtheapplication.Anyhowpartofthisdataneedtobestoredlocallybythebrowser.Storinglocallynon-sensitivedatahelpsreduceInternetdatausage,andinsomecases,significantlyimproveperformance.UsingHTML5persistentstorageAPIscanbeparticularlyhelpfulwhendealingwithmobileInternet.MobilephonecontractsinmanycountrieshaverestrictedamountofInternetdatatransfer,wirelessmobiletechnologiessuch3Gor4Garelimitedandexpensive.PrevioustoHTML5developerswerelimitedbythelackofAPIsforpersistentstorage.Todaythosetoolsareavailable,oneofthemostbroadlyusedtechnologies iscalledWebStorage.WebStoragehasapersistentstoragecomponentcalledLocalStorage,andtemporarystoragecalledSessionStoragewhichwillbeclearedafter thebrowsingsessionexpires.AllmodernbrowsershaveimplementedHTML5andWebStoragestandards,buttheallowedamountofpersistent storage varies [Figure 9]. Inconsistencies in data storage limits need carefulevaluationandtestingonmultiplebrowsers,andevenwithinthesamebrowserondifferentversionsthestoragethresholdvary.

0 2 4 6 8 10 12 14 16 18 20

Sweden

Switzerland

Finland

Denmark

UnitedKingdom

Ireland

Austria

Hungary

Portugal

Russia

Italy

AveragespeedMb/s

13

Figure9.AvailableLocalStorageondifferentbrowsers.(source:[16]Kitamura,Eiji)Browser Version AvailablestorageChrome 40 10MBChromeMobile 40 10MBAndroidBrowser 4.3 2MBFirefox 34 10MBFirefoxMobile 34 10MBInternetExplorer 9-11 10MBOpera 27 10MBFirefox 34 10MBFirefoxMobile 34 10MBSafari 6-8 5MBSafariMobile 6-8 10MB

2.9.WebapplicationdevelopmenteffortThereareclearlyseveraldifferencesandobstacleswhendevelopingcross-platformsoftware,some of those challenges can be mitigated by effective planning while others are moreambiguous.Challengessuchcontinuouslytestingoneapplicationonmultipleplatforms,eachcontaining multiple devices, and each device containing unique software and hardwarespecifics;presentsenormouschallengeswhentryingtoestimateeffort,timeandcosts.Thereis a myriad of methodologies and tools currently available that help better plan andadministratethosechallenges.Someestablishedmethodshaveevolvedtoincorporatemobiledevicesintoplanning,anyhowasconsumermarketrelentlesslymaturesfromdesktoptoIoTandbeyond,thosemethodologiesarefailingtokeeppace.Effort estimation Methodologies that have evolved to accommodate web applicationrequirementswillbediscussedinthenextchapter,thosepublicationsdevelopedbydifferentauthorsprovidestheframeworkthispaperwillusetohighlightthecurrentshortcomesanduseasfoundationforanimprovedmethodology.

14

3.ReviewofavailablewebeffortestimationmethodsAnumberofpapershavebeenpublishedregardingthenecessitytoupgradetraditionaleffortestimation methods for modern web-based software. This chapter discusses threepublications that better fulfils the addressed problem. The selection was based on threecriteria:thepaperhasbeencitedonmultiplepeer-reviewedpublications, it isbuiltuponarecognizedstandard,andembracewebapplicationcharacteristics.Among the selected papers, the most cited publication was Reifer Web Development:EstimatingQuick-to-MarketSoftware[17],ithasbeencited233times.Thesecondmostcitedpaper was Ruhe et al. Cost Estimation forWeb Applications [18] with 123. The paper byAbrahãoetal.EvaluatingaFunctionalSizeMeasurementMethodforWebApplications:AnEmpiricalAnalysis[4]wasonlycited27times,butscoredhighontheothertwocriteria.Beingbuilt upona recognized standard is of paramount importance to assurequality andreliability. Both ReiferWEBMO and Abrahão et al. OOmFPWeb measure systems are anextensionofAlbrechtFunctionPoints[3].Afunctionpointisa“unitofmeasurement”usedtocomputeafunctionalsizemeasurement(FSM)ofsoftware.FunctionPointisoneofthemostwidelyadoptedmethodsandoffernumerousISO/IECstandards.ThemostwidelyusedFSMmethod is the International Function Point Users Group (IFPUG) Function Point AnalysiscertifiedasISO/IEC20926:2009[19].Ruheetal.Web-COBRAdoesnotappeartobeprovidedbyanyISOcertifiedorganization.Thelastcriterionisthatthemeasuresystemembraceswebapplicationcharacteristics[Table2]. These characteristics are based on Reifer (2000) paper, but still valid today, the onlyaddition is the cross-platform category. All methods scored equally in the 9 categories,anyhowallmethodsfailedthecross-platformcategory.ReiferWebObjectswascustombuiltto dealwith these characteristics,while both Ruhe et al.Web-COBRA and Abrahão et al.OOmFPWebmethodsciteReiferworkanddeveloptheirpublicationstodealwiththesamechallenges.

15

Table2.Characteristicsofwebdevelopmentprojects.(source:Reifer[17]pp.2) WEBMO Web-COBRA OOmFPWebPrimaryobjectiveisbringingqualityproductstomarketasquicklyaspossible

Yes Yes Yes

Typical project size is small(3-5 teammembers)

Yes Yes Yes

Typicaltimelineis3-6months Yes Yes YesDevelopment approach employed is rapidapplication development, gluing buildingblockstogether,prototyping

Yes Yes Yes

Primary engineering technologies used arecomponent-based methods, 4th and 5thgeneration languages (html, Java, etc.)visualization(motion,animation),etc.

Yes Yes Yes

Processesemployedisadhoc Yes Yes YesProducts developed are object-basedsystems, many reusable components(shoppingcarts,etc.),fewexternalinterfaces,relativelysimple

Yes Yes Yes

People involved are Graphic designers, lessexperiencedsoftwareengineers

Yes Yes Yes

Cross-platform. Take into account thecontext and device where that theapplicationisbeingused

No No No

3.1Reviewedmethod:WEBMOThe WEBMO measurement system was developed by Donald J. Reifer in 2000 from hispersonalexperienceintraditionalandwebsoftwareprojects.WEBMOenhancesanearlierused algorithmic software model called The Constructive Cost Model (COCOMO II) andintroducesanewmetriccalledWebObjects.TheCOCOMOIImodelusesSourceLineofCode(SLOC)asitsunderliningsizemetric,whileWebObjectscomputessizebytakingintoaccounteachelementthatmakeupawebapplication.WebObjectsareamodificationofFunctionPoint counting tailored for Intranets and Internet environments, it combines the fivetraditionalFunctionalPointpredictors(internallogicalfiles,externalinterfacefiles,externalinputs,externaloutputs,externalinquires)plusfourweb-specificpredictors(numberofXML,HTML, and query lines, number of multimedia files, number of scripts, number of Webbuildingblocks)intoasinglesizemetric.TheWEBMOcostmodel doesnot requireprecise knowledge aboutof cost drivers duringdevelopmentprocess,insteadgenericcostdriverscanbedefinedinordertoestimateintheearlyphaseofthedevelopment.Astheprojectsprogressesandinfluentialfeaturesmature,thosearethenbetterdefinedinthecostmodel.Themainadvantagesofthismodelaretheuse of a mathematical formula for effort prediction and the presence of an extension

16

mechanismallowingfortheadditionofnewtypesofoperandsandoperators[4].WebMOmathematicalformulaisdefinedasfollow:

WEBMOisagoodattemptofpredictingeffortandcostofweb-basedapplications,anyhowwhenitwasfirstconceivedtheconsumerdeviceecosystemwasverylimited.Backintheyear2000webapplicationswererestrictedbytechnologyandInternetconnection.Between2000-2015, global Internet penetration grew 7-fold from 6.5% to 43% and mobile broadbandincreased12-foldsince2007[21].WebObjects,theunderliningmetricofWEBMO,islimitedbyimplementationtechnologyandthefactthatitcannotbeappliedintheearlystagesofthewebapplicationdevelopmentlifecycle.Reifermodelhasdemonstratedbenefitswhenapplied intonon-complexwebhypermediasystems[17],anyhowthosesystemsareeasiertopredictthanwebapplications,becausewebhypermediasystemsareusuallymuchsmallerintermsoftheexpendeddevelopmenteffortandtheuserdonothavetheabilitytoaffectthestateofthesystemonthewebserver[18].Webapplicationrequirementstodaylookexceptionallydifferentandmorecomplexthan15yearsagowhendesktopPCwasthesoloplatform.WEBMOdatedformuladoesnotofferaclear mechanism for adding multiplatform operands or handle the complexity of webapplications.

3.2Reviewedmethod:Web-COBRAWeb-COBRA is an adaptation to the Web domain of the COBRA (COst estimation,BenchmarkingandRiskAnalysis)methoddevelopedbyL.C.Briand,K.ElEmam,F.Bomariusin1998.TocreateaCOBRAmodelthemethodcombinesexpertsknowledgeandpastprojectdata,gatheredinacontrolledway,thenusethisinformationtoadjusttheestimationscomingfromamodelthatexploitsasizemeasureascostdriver[22].InordertoobtainaCOBRAmodel,thepersoncalculatingtheeffort,needinformationaboutthree project factors. First, the project characteristics such as project type, applicationdomain,andsoon.Second,thesizemeasurecalculatedinaconsistentwayamongallprojects.Andthird,thecostdriversdescribingtheresourcesexpectedtoinfluencethedevelopmenteffort.Basedonthesethreefactorsfromthecasualmodel,acostmeasurementisextractedforthecurrentprojectdevelopment.Web-COBRAmathematicalformulaisdefinedestimatingthemagnitudeofrelativeerror(MRE)asapercentageoftheactualeffortforaproject[18]:

17

Inaddition,thereisapredictionlevel(Pred).Thismeasureisaproportionofobservationsforagivenlevelofaccuracy:

Web-COBRA greatest advantages is the use of COBRA method for the web domain bycombining expert knowledge with data from a small number of projects to develop costestimationmodels.Unfortunately, empirical data on the effectiveness ofWeb-COBRAhasonlybeenassessedtoalimiteddatasetof12webapplications.Ruheetal.Web-COBRAmodelhasimprovedonReifer’sWEBMObyconcentratingitsempiricalresearchonmorecomplexweb applications. It also takes advantages of Reifer Web Objects to predict a project’sdevelopmenteffortusingacompositeestimationmethodthatutilizesexpertknowledgeanda limited amount of past project data.AnyhowWeb-COBRAalso fail to take into accountmultiplatform requirementsbecause in2003when themodelwasdeveloped,mobile andotherIoTdeviceswerescarcelyavailableintheconsumermarket.3.3Reviewedmethod:OOmFPWebAbrahãoetal.OOmFPWebmeasuremodelisthemorerecentmethodfromthe3reviewed,itwaspublished in 2004 andwasbasedon a laboratory experimentwhichevaluatesOO-MethodFunctionPoints for theWeb.Themethodwasdesigned toconformto the IFPUG(InternationalFunctionPointUsersGroup)countingrulesforFPA(IFPUG,1999)andintendedto be usedwithin the context ofweb-based systems.OOmFPWeb provides ameasure offunctionalsizeforwebapplicationsthatareproducedusingObject-OrientedWebSolutions(OOWS)(Pastoretal.,2001),thismethodintegratesnavigationalandpresentationaldesignwithaclassicalOOconceptualmodellingapproach.OOmFPWebworksbygeneratingavaluebasedontheamountoffunctionalityawebsystemprovidestoauser.Themethodevaluatesfunctionality of web systems based on user-defined requirements encapsulated in theconceptual model of web application projects. This is a breakthrough from Reifer 2000WEBMOmodel that rather is based solely on implementation artefacts created once theapplicationhasbeenfullydeveloped[24].EmpiricallyevaluationofOOmFPWebcomesfroma2009studyperformedbyS.AbrahãoandG.Poels[23],theanalysesbasedonfourdatasetsfromafamilyofexperimentsconductedinSpain,ArgentinaandAustriademonstratethemethodefficiencywhencomparedtoexistingindustry practices. The method was also perceived as easy to use and useful by theparticipants [23], even if OOmFPWeb is believed to consumemore time than establishedFunctionalPointAnalyses(FPA)[24].Unfortunately,becauseOOmFPWebisanewprocedurethatisnotyetwidelyusedinpractice,theauthorsconductedtheirresearchonanartificiallaboratorysettingusingstudentparticipantsratherthanpractitioners.

18

TheOOmFPWebfunctionalsizemeasurementrequirestwostepsofabstraction,calledtheidentificationstepandthemeasurementstep.Intheidentificationstepaconceptualschemais built based on defined user requirement specifications (Data, Process, Behaviour,NavigationandPresentation).Inthemeasurementstepallrelevantidentifiedelementsoftheweb application are defined as Base Functional Component (BFC) types, as in the ISO/IECstandard for functional sizemeasurement [25].Next, the functional sizeofeach identifiedBFCsisquantifiedbyratingtheircomplexityandtranslatingthisratingintoaFunctionPointsvalue.Finally,thefunctionalsizevaluesoftheBFCsaresummedtoobtainthefunctionalsizevalueoftheWebapplication[23].

Figure10.TheOOmFPWebmeasurementprocedure(source:Abrahãoetal.2004)

OOmFPWeb effort measuring representation offers greater visual cues and step-by-stepproceduresifcomparedtoWEBMOorWEB-COBRA,itsfiveconceptualmodelsencapsulateeachrequirementdomainintoameasurableunitofFunctionPointsvaluesthatfacilitatethecounting of effort units. Anyhow OOmFPWeb also fail to describe multiplatformrequirements.ThemethodPresentationModelonlydescribestheuserinteractionswiththeapplication’swebinterface,butitassumesthatthecontextandthedeviceareimmutable.Modernwebapplicationsarebuiltusinga responsive interface,were theUIadapts to theinteractioncontext (running, sitting,driving, so forth)andplatformcharacteristics (phone,SmartTV,Smartwatch).

19

4.ProposedSolutionIn the previous chapter, three different methods have been compared based on specificcriteria[Table2].OneofthesemethodsOOmFPWebhavebeenselectedastheoptimalmodelforcomplexweb-basedsystems.ThemainbenefitofusingtheOOmFPWebmethodologyisthatitoffersamodularconceptualstructurethatusesUML-compliantdiagramstodescribethedifferentviewsofanOOwebapplication.Thismodulardecoupledframeworkallowseasieradditionofnewmodulesthatcanberetrofittedwithouthavingtoamendtheremainingdomains.Additionalmodelscanthen enhance the original framework while reusing the methodology established tools,mathematicalformulasandcountingrules.InOOmFPWebthemeasurementoffunctionalsizeismadeattheconceptualschemalevel,soasaconsequence,theapplicationdevelopmentisindependentofimplementationchoices.Thatmethodologycharacteristic,fitswellwithcross-platform development concepts were newer platforms and technologies are continuallyevolving.BecauseOOmFPWeb lacksbuilt-incross-platformsupport, thispaperwill suggestawayofextendingtheoriginalmethodbyaddinganewconceptualmodelcalledthePlatformModel,this new model will complement the other existing models by calculating cross-platformeffort. The Platform Model encapsulates web application context and platform-specificrequirements that are unique for each platform [Table 3]. Modern multiplatform webapplicationstypicallyrequireextraSourceLineofCodes(SLOC)andQualityAssurance(Q&A)testing thansingleplatformsapplications, thoserequirementswillbecaptured in thenewproposedPlatformModel.Table3:CharacteristicsBreakdownbyPlatform.Platform Context Connection *Example Display

ResolutionI/O

Phone Walking,Commuting

WIFI,2G,3G,4G,LTE

480x320 Touch, gesture,voice

Tablet Sittingathome,Commuting

WIFI,2G,3G,4G,LTE

768x1024 Touch, gesture,voice

SmartWatch Running,walking

WIFI, Bluetooth,2G,3G,4G,LTE

390X312 Touch, gesture,voice

SmartTV Sittingathome WIFI,Ethernet 1920x080 keyboard,pointing device,voice

SmartCar Driving WIFI,3G,4G,LTE 1280x400 Touch, pointingdevice,voice

Desktop Sittingathome,attheoffice

WIFI, Ethernet,2G,3G,4G,LTE

1680x1050 keyboard,pointing device,voice

*Displayresolutionamongdevicevendorsdiffersgreatly,theselectexamplesbelongtosomeofthemostpopulardevicescurrentlyavailableItheconsumermarket.

20

TheultimategoalwhileextendingOOmFPWebforcross-platformapplicationsisinkeepingitbackward compatible with the original framework created by Abrahão et al, so the newproposedmethodcanremaincompatiblewithFunctionPoints(ISO/IEC)andbenefitfromitsoriginalmethodologyforidentificationandmeasurementunits.

4.1DefiningtheChosenModelUsingOOmFPWebastheblueprintfortheproposednewmethod,effortestimationisdoneintwosteps.Thefirst,isbyidentifyingallfunctionalrequirementsofawebapplication.Thoserequirementsareclassified into fiveoriginalmodels createdbyPastoretal.,2001 (ObjectModel,DynamicModel,FunctionalModel,NavigationalModelandPresentationModel)plusanewmodel introduced in thispaper calledPlatformModel. The second step iswhenallrelevantidentifiedelementsofthewebapplicationaremeasuredandquantified.Mostoftheoriginal conceptual framework [26] remains unchanged, except by the addition of thePlatformModelintotheIdentificationstep[Figure11].Figure11:OOWSConceptualModelsPlusPlatformModel(source:O.PastorandS.Abrahão,2001)

4.1.1IdentifyingFunctionalRequirementsIntheidentificationsteptheelementsthataddfunctionalsizetotheprojectareidentified.Theresultofthisfirststepisanabstractmodeloftherelevantelementsforfunctionalsizemeasurement,thismodelisdescribedaccordingtotheFSMmeta-modelthatusesunitsofmeasurementtocounttheidentifiedelements.AsOOmFPWebisanextensionofFSMmethodforOOwebapplications,mappingrulesmustbedefinedforthedifferentperspectivesofanOOsystem.TheseperspectivesandtheircorrespondingOO-Methodconceptualmodelviews

21

arecategorizedas:ObjectModel,DynamicModel,FunctionalModel,NavigationModel,andPlatformModel.ThePlatformModelencapsulatesallrequirementsthatarespecifictocross-platform functionality and user context [Table 3]. It is defined at the same level as otherconceptualmodels,andbecauseOOmFPWebisamodularframework,thenewconceptualmodelcanbeaddedwithouthavingtoamendtheothermodels.4.1.2TheOOmFPWebConceptualModelsEachOOmFPWebconceptualmodel identifiesaspecifictypeofdevelopmenteffort.Thesearethecomponentsthatconsumewebapplicationdevelopmenttimeandbudged.

• TheObjectModel defines the data that ismaintained by the application and thecomputations that the application performs, those are characterized by classesrepresentationwithsharedevents,agentrelationships,inheritancesandaggregationhierarchies[AppendixA.1].

• TheDynamicModel captures the behaviour of inter-objectswithin an application,thosearecharacterizedbyevents,actions, transactions,preconditionsandcontrol-conditions[AppendixA.2].

• TheFunctionalModelcapturesthesemanticsattachedtoanychangeofstate,thosearecharacterizedbythecomputationsthattheapplicationperformsalongwithobjectstatechanges[AppendixA.3].

• TheFunctionalModelcapturesthesemanticsattachedtoanychangeofstate,thosearecharacterizedbythecomputationsthattheapplicationperformsalongwithobjectstatechanges[AppendixA.4].

• ThePresentationModelcapturesthesemanticsofhowauserinteractswithawebapplication, those are characterized by data input, manipulation of the webenvironmentandthewayinformationispresented[AppendixA.5].

The OOmFPWeb conceptual models provide a good framework to help identify webapplication requirements, most functional requirements are captured in one of the fiveconceptualmodelsabove.AnyhowOOmFPWebdoesnotexplicitlydealswithmoreabstractconceptslikecross-platformandusercontext,forthoserequirementsthispaperintroducesanewmodelcalledPlatformModel.

• ThePlatformModel captures the semantics of how the application interactswithdifferentplatformsandwithindifferentcontexts,thosearecharacterizedbydifferentI/Ofunctionalities,informationpresentation,networktechnologiesandthecontextinwhichtheapplicationisbeingused.

4.1.3ThePlatformModelThePlatformModelabstractionexpressesthelogicalprocessingawebapplicationperformswhenusedondiversecontextsandplatforms,cross-platformandusercontextrequirementsaretranslatedintoUML-likenotationsandquantifiedusingOOmFPWebcountingrules.

22

Cross-platformrequirementsareall the logicalevaluations,storageanddatapresentation,thatarenecessarytoenableanapplicationbeaccessedonmultipleplatforms:

• Testingandmitigatingnetworkissues,e.g.improvingtimeouts,presentingonscreenfeedbackifacomponenttakeslongtimetoload,andsoforth.

• Testingandmitigatingdevice specific limitations, e.g. limited storage,no cookieorlocaldatapersistency,limitedscreendensity,andsoforth.

Usercontextrequirementsareallthelogicalevaluationsthesoftwareperformstounderstandwhattheuserisdoingwhileinteractingwiththeapplication:

• Different I/O for improvinguser-experience,e.g. voice inputona smartwatchandkeyboardmouseonalaptopcomputer.

• Different information presentation, e.g. limiting information presentation to aminimumonasmalldevicescreen,butdisplayinganyextra informationona largescreen.

Figure12illustrateshowtheuserisroutedtoadifferent(optimized)landingpagebasedondevicedetection,iftheapplicationonlyrescalestheUIforthespecificdevice(watch,tabletordesktop) thetextmaybetoosmall to readonthewatch. In thiscase, thedeveloper isrequiredtocarefullydesigntheamountofinformationdisplayedoneachdevicescreen.Thetime and cost spent on such cross-platform requirement is encapsulated in the PlatformModel. These logical procedures illustrate the effort units that are necessary to translatehuman requirements based on theplatform (smart TV, Connected Car, and so forth) andcontext (sittingon the sofa, driving, running, and so forth) intoprogramming instructions.Those instructionsare theessentialmechanisms thatallowwebapplicationsdeliveringanoptimaluserexperienceonmultipleplatforms.Figure12:PlatformModelRepresentation

23

4.2MeasuringFunctionalRequirementsInthemeasurementsteptheelementscaptured ineachconceptualmodel(ObjectModel,DynamicModel,FunctionalModel,NavigationalModelandPresentationModelandPlatformModel)areidentified.Asaconsequence,thefunctionalsizeofaWebapplicationiscalculatedintheproblemspacebymappingtheidentifiedprimitivesofObject-OrientedWebSolutions(Pastoretal.,2001)intoFunctionPointAnalysis(Albrecht,1979)countingrules.Calculatingthe functional size of a web application takes several steps that are breakdown intoidentificationandcounting.4.2.1IdentifyingapplicationboundaryandscopeThese are the borders between the web application being measured and the externalapplicationsoruserdomain.TheAgentsthatareoutsidetheapplicationandtheconceptualmodels define the application functionality. The global view of the application can berepresentedbyanavigationalmap,theapplicationboundarycorrespondstoallnavigationalmapsrepresentedintheNavigationalModel.Figure13:ApplicationBoundaryMap(source:Abrahãoetal,2004)

Where: ILFsaretheinternallogicalfiles

EIFsaretheexternalinterfacefilesEIsarethedatatheuserentersintothesystemEOsarethedatathesystempresentstotheuserEQsaretheinputqueryresponsesfromothersystems

Theapplicationboundarydefinesthebordersofwhatisbeingmeasured(systeminner-worksandexternalsinterfaceswithothersystems),whilethescopedefinesthefunctionalitywhichwillbeincludedinaparticularmeasurement.Figure13definestheapplicationboundaryaseveryfunctionalityinsidethecircle,whilethescopeincludesalltheinformationdefinedinthesixconceptualschemaviews(ObjectModel,DynamicModel,FunctionalModel,NavigationalModel,PresentationModelandPlatformModel).

24

4.2.2IdentifyingdataandTransactioncandidatefunctionsDatacandidatefunctionsexpressinnumericaltermstheeffortrequiredtodefineandstoresystem data, while transaction candidate functions express in numerical terms the effortrequiredtomanagethesystemdata.OOmFPWebmethodwasdesignedtoconformtotheIFPUG(InternationalFunctionPointUsersGroup)countingrules[AppendixA.6],thoserulesassignnumericalvalues toexpress the functional sizeof thewebapplicationcomponents.Onceallelementsareidentifiedandquantified,thetotaleffortsizecanbecalculated.4.2.3CountingdataandtransactionfunctionsOOmFPWeb provides mathematical formulas for calculating both Data and TransactionFunctions [Appendix A.9, A.10]. The result of those calculations provides the amount offunctionality that the web application delivers, therefore using this value as an effortestimation.

25

5.ApplyingtheChosenModelApplying the extended version of OOmFPWeb follows the same steps as the originalmethodologywith the addition of the PlatformModel. To better illustrate this process ahypotheticalcross-platformwebapplicationisdefined,theapplicationisasimplevideoplayerthathighlightssomespecificplatformrequirementsdefinedintheapplicationboundary.

5.1DefiningaHypotheticalWebApplicationAs an example of amodern cross-platformweb application a simple HTML5 video playerapplicationisdefined.TheW3CHTML5standardabstractsmostofplaybackcomplexitiesinitsAPI,sothatmakestheHTML5<video>element[27]anidealcandidatetohighlightonlyplatformandusecontextrequirements.Figure13:SimpleVideoPlayerUserInterfaceMock-up

Thesimplevideoplayerpresentsashortlistofrequirements[Table4]thatbasedonplatformdetection perform different logical instructions. The control bar should be hidden whenopeningtheplayeronaphonebecauseGoogleAndroidandAppleiOS,thetwomostpopularsmartphoneOSvendorsinthemarket,bydefaultaddtheirowncontrolbaroverthevideobeingplayed.Thetitleandauthordescriptionshouldbehiddenonmobileduetothelimitedscreensize,thisisnotanissueondesktoportablets.Onadesktopcomputer,thevideoshouldstartbydefaultinHighDefinition(HD),butnotonatabletorphonebecauseitmayconsumetoomuchoftheuserInternetmobiledata.Finally,onaphonetheusershouldbeablefast-forwardthevideobyshakingthedevice,anyhowsuchuserinputisnotavailableontabletanddesktopcomputer.Table4:SimpleVideoPlayerRequirementsperPlatformRequirements Tablet Phone DesktopDisplaycustomcontrolbar(play,pauseandscrollbarbuttons) yes no yesDisplaytitleandauthortextmenu yes no yesStartplaybackusingHDmediafile no no yesEnableshaketofast-forward no yes no

26

5.2IdentifyingApplicationBoundaryThefunctionalitiesinsidetheprojectboundaryareallthelogicalfunctionsnecessarytoselectandplaybackvideoassetsfromaContentDeliveryNetwork(CDN),queryassetmetadatafroma database, present the userwith asset information and amenu interface for user inputcommands [Figure 14]. In addition to these logical functions there is platform specificfunctionalitiessuchplatformdetection,assetselectionbasedonplatformand informationpresentationbasedonplatform.Figure14:SimpleVideoPlayerBoundary

Where: ILFsaretheinternallogicalfiles

EIFsaretheexternalinterfacefilesEIsarethedatatheuserentersintothesystemEOsarethedatathesystempresentstotheuserEQsaretheinputqueryresponsesfromothersystems

5.3IdentifyingTransactionFunctionsThesimplevideoplayerperformsadatatransactionseverytimetheuserinteractwiththewebinterface[Figure14].UsingFSMmeasurementrulestotranslatefunctionalrequirementsintomeasurement units, below are the functional components required to perform eachtransaction,thesehavebeensimplifiedto1actionand1attributechange.[pressplaybutton]EI

• 1DETforanaction• 1FTRforstatechangeofattributevalue

[displaysongtitle&author]EO• 1DETforanaction• 1FTRforstatechangeofattributevalue

[querysongtitle&author]EIandEO• 1DETforanaction• 1FTRforstatechangeofattributevalue

27

[downloadvideoasset]EQ• 1DETforanaction• 1FTRforstatechangeofattributevalue

5.4IdentifyingDataFunctionsData and transaction candidate functions elements are the building blocks of FSMmeasurementmodel.Inthisstage,measurementunitsareappliedtoeachrequirementoftheapplicationbybreakingitdownintosmallerfunctionalcomponentsandidentifyingeachunitasObject,Dynamic,Functional,Navigation,PresentationorPlatformeffortunits.5.4.1IdentifyingObjectModelUnitsThesimplevideoplayer logic iscontainedwithinthreeclasses,oneClassnamedControllerwhereall theprocessing logic isencapsulated,oneClass calledViewwhereall theoutputrepresentationofinformationisencapsulated,andoneClasscalledModelthatmanagesthedataanddatalogicsoftheapplication[Figure15].ThesimpleplayerViewClassinitiateothersub-classesthatbuiltthevisualcomponentsdisplayedonthescreen,anyhowforthepurposeofthisexampleweassumetheseclassesarereadilyavailableoutsideourboundaryscope.Figure15:SimpleVideoPlayerClassRepresentation

BasedonthesimplevideoplayerClassRepresentationsabovewecanuseFSMmeasurementrulestotranslatefunctionalrequirementsintomeasurementunitsasbelow.Class:

• [Model]1RETfortheclass• [View]1RETfortheclass• [Controller]1RETfortheclass• [Model.title]1DETfordata-valuedattributeoftheclass• [Model.author]1DETfordata-valuedattributeoftheclass

28

• [Model.platformName]1DETfordata-valuedattributeoftheclass• [Model.mediaName]1DETfordata-valuedattributeoftheclass• [View.textMenu]1DETfordata-valuedattributeoftheclass

ClassService:• [View.model]1FTRforclassreference• [Controller.model]1FTRforclassreference• [Controller.view]1FTRforclassreference• [View.playButton]1FTRforclassreference• [View.pauseButton]1FTRforclassreference• [View.progressBar]1FTRforclassreference

5.4.2IdentifyingDynamicModelUnitsThesimplevideoplayerhastwologicalstatetransitions,thefirst isdetectingtheplatformtypewheretheapplicationisbeingloaded,whilethesecondevaluatethebestmediatypefortheidentifiedplatform[Figure16].Figure16:SimpleVideoPlayerplatformdetectionandmediaplaybackdiagrams

Based on the simple video player diagram representations above we can use FSMmeasurementrulestotranslatefunctionalrequirementsintomeasurementunitsasbelow.

• 1FTR[Controller.detectPlatform()]foracontrolcondition• 1FTR[Controller.playMedia()]foracontrolcondition

29

5.4.3IdentifyingFunctionalModelUnitsThesimplevideoplayerkeeptrackofhowmanytimesamediahavebeenplayed,thischangein state happens every time event onComplete is dispatched by incrementing variableplayCountwithoneunit[Figure17].Figure17:SimpleVideoPlayerplaybackcountdiagram

Based on the simple video player diagram representations above we can use FSMmeasurementrulestotranslatefunctionalrequirementsintomeasurementunitsasbelow.

• 1FTR[Controller.playCount]forstatechangeofattributevalue5.4.4IdentifyingNavigationandPresentationModelUnitsThesimplevideoplayeruserinterfaceadjuststotheunderlingplatform,thatallowssomeofits I/O components to adjust according to the context in which the user is accessing theapplicationandselectmoreuser-friendlyinteractionmechanisms[Figure18].Figure18:SimpleVideoPlayerfast-forwardactiondiagram

Based on the simple video player diagram representations above we can use FSMmeasurementrulestotranslatefunctionalrequirementsintomeasurementunitsasbelow.

30

• 1DETforclickaction• 1DETforshakeaction• 1DETforpressaction

5.4.5IdentifyingPlatformModelUnitsThesimplevideoplayerapplicationmustsupportthreedifferentplatforms,anddynamicallyselect the best mechanisms for each platform and interaction context. That means thedeveloperneed to test and troubleshoot theapplicationoneachplatformanddesign theapplicationaccordingtothebestpracticesforeachone.

• 2extraDET[Controller.detectPlatform()]1foreachplatformthatistheresultofanIFcondition

• 2 extraDET [Controller.playMedia()] 1 for each platform that is the result of an IFcondition

• 2extraDETperusercontextaccessingtheapplication(usercanbebothmovingusingamobiledeviceorstationaryusingdesktopcomputer)

• 1extraDET[Model.platfromName]forarecordthatdealswithspecificsofaplatform5.5CountingDataandTransactionFunctionsThe amount of data handled by the application logical files and transactional functionsdeterminestheamountoffunctionalitythatthesoftwaredelivers,henceitsfunctionalsize.Calculatingthesimplevideoplayertotalfunctionalsizetakestwosteps,firstcountalldataandtransactioneffortunits,secondlyapplyOOmFPWebcalculationformula.Table5:SimpleVideoPlayerDataFunctionMeasureUnitsDataFunctions DETs RETs FTRsObjectModel 5 3 6DynamicModel 2FunctionalModel 1NavigationandPresentationModel 3 PlatformModel 7 Total 15 3 9Applyingtheweightsdescribedinthetable5theobtainedfunctionalsizefordatafunctionsis:OOmFPD=(DETs+RETs)+FTRsOOmFPD=18+9OOmFPD=27

31

Table6:SimpleVideoPlayerTransactionalFunctionMeasureUnitsTransactionFunctions DETs RETs FTRsILFs 1 1EIFs 1 1EIs 1 1EOs 1 1EQs 1 1Total 5 0 5Bymeasuringallweights[Table6],theobtainedfunctionalsizefortransactionfunctionsis:OOmFPT=(DETs+RETs)+FTRsOOmFPT=5+5OOmFPT=10

Lastly, the partial functional sizes obtained by the data and transactional functionscalculationsaresummedtoobtainthefunctionalsizevalueofthesystem.Therefore,thetotalfunctionalsizeforthesimplevideoplayerwebapplicationis37.WithouttheadditionofthePlatformModeleffortunitstoaccountfortestingandtroubleshootingondifferentdevicesthefinalfunctionalsizewouldbeunderestimatedby7units.ByaddingthePlatformModeltotheremainingOOmFPWebframework,cross-platformanduser context functional requirements were explicitly defined beforehand. That forces thedevelopertothinkaboutthoseabstractrequirementsanduseUML-likenotationthatcanbequantifiedusingOOmFPWebmeasurementunits.WithoutthePlatformModel,someofthoserequirementsmay still be captured in the remainingmodels, even if thosemodelsdonotspecificallydealwithcross-platformandusercontextcharacteristics.Nevertheless,becausenoneoftheremainingmodelsexplicitlydefinerulesforidentifyingcross-platformandusercontext,somerequirementsmaybeunaccountedandeventuallydeliveraninaccuratetimeandcostestimation.

32

6.ConclusionandFurtherWork Thispaperhasproposedabettermodelforcostandtimeestimationforwebapplications.Ithas discussed the characteristics (cross-platform and user context) that are oftenunaccountedusingestablishedeffortestimationmethods.IthasalsodemonstratedhowtheOOmFPWeb conceptual framework can be extended by adding a new model called thePlatformModel.Thisnewmodelisusedtocaptureandquantifythesemissingrequirements,thereforeprovidingabettereffortestimationresultthantheoriginalmethodology.Thispaperconcludesthatmodernwebapplicationsbydefault inherit theneedtoprovidecross-platformandcontextfunctionalities.Theuserexpectstheapplicationtointeractandpresentitsdataaccordingtotheplatformbestpracticesandincontext,failingtodosomayresultinapooruser-experience.Modernmethodologiesabletofullyestimatedallthehiddencomplexitiesofwebsoftwareareuncommonanddifficulttograsp,thuswebdevelopersmaypreferusingtheirowninstincttoguesseffortinsteadofcorrectlyestimatingit.Finally,asIoTconnected devices grow in popularity and the way people interact with those devicesdiversify,effortestimationcomplexitywillalso increasemakingeffortguessingevenmoreunfit.FurtherdevelopmentandrefiningofthePlatformModelforOOmFPWebmethodisneeded,specificallyby testing thecompletemethodologyusinga realwebproject. In theexamplepresentedinChapter5manycomponentsandrealworldcomplexitieshavebeenomittedorlarge simplified, thus applying themodel into a real complex systemmay expose gaps ormismatchesinsomeoftheassumptionsthispapermakes.

33

AppendixA

A.1ObjectModelRepresentationsTheObjectModel abstraction expresses the logical data thatmust bemaintained by theapplication; insert newdata, update data and remove obsolete data.Whereas the legacyviewsrepresentlogicaldatathatareonlyreferencedbytheapplication.LogicaldatareferstothedataasknownbytheOOsystem,itdoesnotrefertothephysicalrepresentationofthedata as stored on storage media. Figure 19 illustrates ClassName and its complex datacomputation relationships expressed as attributes reader_code, book_code and date;methods loanandreturn; relationshipswithClassBookandClassReader;andotheragentrelationshipsthatcombinedoutlinestheapplicationcomputations.Figure 19:ObjectModel Representationof Class Relationships (source:O. Pastor and S.Abrahão,2001)

ThecomponentsoftheObjectModelare:

• Thesignatureofaclassincludingattributes,methodsandproperties:o IntegrityConstrains (staticanddynamic)withstateconditions thatmustbe

satisfiedo Valuationsthatstatehowattributesarechangedbyeventoccurrenceso Derivationsthatrelatesomeattribute’svaluestootherso Preconditionsthatdeterminewhenaneventcanbeactivatedo Triggersthatintroduceinternalactivity

• Inheritance:o Specialization deals with descendent inheritance or derivation of children

classesfromaparentclass

34

o Generalization deals with ascendant inheritance or generation of parentclassescollectingcommonpropertiesofpredefinedclasses

• Specialization:o Permanentwhenanobjectbelongsalsotoagivenspecializedclassassoonas

theobjectiscreated.o Temporalwhenanobjectactas thecorrespondingspecializedclasswhena

rolecreationoccurs• LegacyViewforpre-existingsoftwaresystems

o Filterplacedonaclasso Aggregationrelationshipswithaclass

A.2DynamicModelRepresentationsTheDynamicModelabstractionexpressestheapplicationcomponentsdynamicinteractions,those are represented in terms of conceptual visual diagrams that illustrates how thesemechanismsinterconnect.ThereforrevealingtheintricaciesofOOapplicationsinteractionsintoquantifiablecomponents.Figure20illustratesthesequenceinteractionbetweenEnterCodeandReleaseDoorbyevaluatingtheCodevalue,hencetriggeringthecorrecttransaction.Figure20:DynamicModelRepresentationasaStateDiagram(source:Wikipedia,2016)

ThecomponentsoftheDynamicModelare:

• StateTransactionDiagramo Sequenceofeventsperformedbyobjectabstracts

• ObjectInteractionDiagramo Interactionsbetweenobjectsusingtriggersandglobalinteractions

35

A.3FunctionalModelRepresentationsTheFunctionalModelabstractionexpressestheOOsystemstatechanges.Figure21illustratesthesechangesintheClassreaderattributebook_numberwerethestatechangecanbeeitherincreasedordecreasedbyone.Figure21:FunctionalModelRepresentationofStateChangeofaClassAttribute(source:O.PastorandS.Abrahão,2001)

A.4NavigationalModelRepresentationsTheNavigationalModelabstractionexpressesthenavigationalcomponentsdesignedintheapplication.Those components canhencebe classified, converted intoFSMmeasurementunitsandquantified.Figure22illustratesthetwonavigationalstepsauserwouldrequiretonavigatefromHometoHowtoOrdersection,thereforethesetwostepsaretranslatedintotwoFSMmeasurementunits.Figure23illustratesthetwopointsofviewausermayhave,therefore two more FSM measurement units are counted. The components of theNavigationalModelare:

• Navigational Map that represents the global view of the web application for anaudience

Figure22:NavigationalMap(source:O.PastorandS.Abrahão,2001)

• NavigationalContextisthepointofviewthatauserhasonamoment

36

Figure23:NavigationalContext(source:O.PastorandS.Abrahão,2001)

• NavigationalLinkallowsnavigationfromonecontexttoanother• NavigationalClassaretheattributesandmethodsofaclassspecifiedintheObject

ModelFigure24:NavigationalClass(source:O.PastorandS.Abrahão,2001)

• Context Relationships indicates the navigation direction, relationship and contextbetweentheclasses

Figure25:ContextRelationships(source:O.PastorandS.Abrahão,2001)

• ContextDependencyRelationshipprovidesadditionalinformationinthecurrentnodewithoutindicatinganyfurthernavigation

37

Figure26:ContextualDependency(source:O.PastorandS.Abrahão,2001)

A.5PresentationModelRepresentationsThePresentationModelabstractionexpressestheuserinteractionpatternswiththesysteminterface. Figure 27 illustrates the steps a mobile phone user would take to access thecomponent menu by swapping to the right. One interaction step translates to one FSMmeasurementunit.OnadesktopcomputerwheretheUIisoptimizedforlargerscreensandtheuseofpointingdeviceandkeyboard,thesestepswouldbedifferent,thereforeproducingmoreFSMmeasurementunits.Figure27:UserInteractionPatters(source:Wikipedia,2016)

A.6OOmFPWebMeasurementRulesNumerical values are used to the express the functional size of the web applicationcomponents.Themappingof the software systemtonumerical values isaccomplishedbymeasuring the data and transaction functions according to FSM measurement rules.MeasurementunitsaredefinedasDataElementTypes(DET),RecordElementTypes(RET),andFile Types Referenced (FTR). DETs correspond to attributes in the object classes and RETscorrespondtoobjectclasses,whileFTRsaredatafunctionreferencedduringtheexecutionofatransactionalfunction[23].

38

ObjectModel:• Class:

• 1DETforeachdata-valuedattributeoftheclass• 1DET for eachattribute in the IFof a classor legacy view referred tobya

univaluedaggregationrelationship• 1DETforeachattributeintheIFofthesuperclassesofaclass• 1RETfortheclass• 1RETforeachmultivaluedaggregationrelationship

• LegacyView:• 1DETforeachnon-derivedattributeofthelegacyview• 1DETforeachattributeintheIFtheclassrelatedtobyaunivaluedaggregation• 1RETforthelegacyview

• ClassService:• 1DETforeachdata-valuedargumentoftheservice• 1DETforthecapabilitytosendmessages• 1DETfortheaction(Accept/Cancel)oftheserviceexecution• 1FTRfortheclass• 1 FTR for each new class referenced in the object-valued argument of the

service• Ifavaluebydefaultisdefined,countoneFTRfornewclassreferencedinthe

formula• Iftheserviceisadestroyevent,countoneFTRforeachnewclassaccessedin

thecascadeformula• Iftheserviceisatransaction,countoneFTRforeachclassreferencedinthe

transactionformula• Ifa specializationbycondition isdefined,countoneFTR foreachnewclass

accessedinthespecializationformula• Ifaspecializationbyeventisdefined(carrier/liberatorevent),countoneFTR

foreachnewclassforwhichtheeventisacarrier/liberator• Ifintegrityconstraintsaredefined,countoneFTRfornewclassreferencedin

theformula• LegacyViewService

• 1DETforeachdata-valuedargumentoftheservice• 1DETforthecapabilitytosendmessages• 1DETfortheaction(Accept/Cancel)oftheserviceexecution.• 1FTRforthelegacyview• Ifpreconditionsaredefined,1FTRforeachnewclassreferencedintheformula

ofapreconditiondefinition• Ifintegrityconstraintsaredefined,countoneFTRfornewclassreferencedin

theformulaDynamicModel:

• 1FTRforeachnewclassreferencedintheformulaofacontrolcondition,definedinthestatetransitiondiagram

• 1FTRforeachnewclassreferencedintheformulaofatriggerdefinition,definedintheinteractiondiagram

39

• 1FTRforeachnewclassreferencedintheformulaofapreconditiondefinition,definedinthestatetransitiondiagram

FunctionalModel:• 1FTRforeachnewclassreferencedintheformulaofavaluationdefinition• 1FTRfornewclassreferencedintheformulaofacontrolconditionassociatedtothe

valuations.NavigationModelandPresentationModel:

• 1DETforeachattributeinthedisplayset• 1DETforeachofferedaction• 1DETforeachofferednavigation• 1DETforthesystemcapacitytodisplaymessages• 1FTRforeachclassorlegacyviewinthedisplayset

PlatformModel:• 1extraDETperplatformforeachIFconditionthatdealswithspecificsofaplatform• 1extraDETperplatformforeachIFconditionthatdealswithusercontext• 1extraDETperplatformforeachrecordthatdealswithspecificsofaplatform• 1extraDETperplatformforeachrecordthatdealswithspecificsofusercontext

ThePlatformModeladds1extraunitofefforttoallspecificsofcross-platformandinteractioncontext.Thoseextraunitsrepresenttheefforttotestandtroubleshootthesameapplicationondifferentplatforms.

A.7DatacandidatefunctionsDatafunctionsareclassifiedasDataElementTypes(DET)orRecordElementTypes(RET).ADET isaunique,non-repeatedfield,anyhowifone integervariableuser_name isstored inmultiplefieldsit isstillcountedasoneDET.ARETisasubgroupofdataelementswithinalogicalfile.Forinstance,inaHumanResourcesApplication,informationforanemployeeisadded by entering some general information. In addition to the general information, theemployee is a salaried or hourly paid employee. Then, two RETs are identified: salariedemployeeandhourlypaidemployee.RETscanbeoftwotypes,InternalLogicalFiles(ILFs)arethedatainternallymaintainedbythesystem,whileExternalInterfaceFiles(EIFs)arethedatareferencedinothersystems.

40

Figure28:DataFunctionCandidates(source:Abrahãoetal,2004)

Datacandidatefunctionsexpressinnumericaltermstheeffortrequiredtodefineandstoresystemdata.Figure28demonstratehowthevariablenamethatisstoredinmultiplefieldscountsasoneDET,whilequantityhastwoRETsasitreferstooneinternaldataelement(ILF)andoneexternaldataelement(EIF).

A.8TransactioncandidatefunctionsIdentify the logical files and functions that perform transactions using or altering existinginternalorexternaldata.Transactionalfunctionsareprocessesofuserinteractionwiththesystemthatcanmanifestinthreedifferentways:theuserentersdataintothesystem(EIs),thesystempresentsdatatotheuser (EOs),andan inputrequestsan immediateresponsefromthesystem(EQs)[23].

41

Figure29:TransactionFunctionCandidates(source:Abrahãoetal,2004)

Transactioncandidatefunctionsexpressinnumericaltermstheeffortrequiredtomanagethesystemdata.Figure29illustratesthethreeOOfunctionsnecessarytoinputthenamevariable(EI),presentnamevariabletotheuser(EO)anddispatcharesponseafteraninputrequest(EQ).

A.9DatafunctionsMathematicalFormulaOOmFPWebdatafunctionmathematicalformulaassignnumericalvaluestotheamountofdataprocessedinthewebapplication.Figure30:DataFunctionMathematicalFormula(source:Abrahãoetal,2004)

Where:

• OMdenotesanObjectModel• cisaclassinOM• lvisalegacyviewinOM

42

• DETs and RETs are elemental measurements that are calculated in the data functions todeterminetheircomplexity

A.10TransactionfunctionsMathematicalFormulaOOmFPWeb transaction function mathematical formula assign numerical values to thefunctionalityprovidedtotheusertoprocessdatainawebapplication.Figure31:TransactionFunctionMathematicalFormula(source:Abrahãoetal,2004)

Where:

• OMdenotesanObjectModel,PMdenotesthePresentationModel,NMdenotesNavigationaltheModel,andPLMdenotesPlatformModel

• misamethodoftheclassorlegacyview• ppisapresentationpatter• ncisanavigationcontext• DETsandFTRsareelementalmeasurementsthatarecalculatedinthetransactionalfunctions

todeterminetheircomplexity

43

References[1]EricssonAB(2015)“EricssonMobilityReport”[Online],Retrievedfrom:http://www.ericsson.com/res/docs/2015/mobility-report/ericsson-mobility-report-nov-2015.pdf,pp.10[2]MaryMeeker(2016)“2016InternetTrendsReport”[Online],Retrievedfrom:http://www.slideshare.net/kleinerperkins/2016-internet-trends-report,pp.117[3]A.J.Albrecht(1979)“Measuringapplicationdevelopmentproductivity”,Proc.IBMApplicationsDevelopmentSymp.pp.83[4]S.Abrahão,G.Poels,andO.Pastor(2004)“EvaluatingafunctionalsizemeasurementmethodforWebapplications:anempiricalanalysis”,inSoftwareMetrics,2004.Proceedings.10thInternationalSymposiumon,pp.358-369.[5]PawelPiejko(2015)“Whichtypesofdeviceshavebrowsers?”[Online],Retrievedfrom:https://deviceatlas.com/blog/which-devices-have-browsers[6]A.Juntunen,E.Jalonen,andS.Luukkainen(2013)“HTML5inMobileDevices–DriversandRestraints”,in201346thHawaiiInternationalConferenceonSystemSciences(HICSS),pp.1053–1062.[7]ForresterConsultingCommissionedBySencha(2015)“TheRiseOfWebTechnology-AddressingDevelopmentComplexityAndProductivityDemands”[Online],Retrievedfrom:http://pages.sencha.com/rs/374-WES-121/images/The%20Rise%20of%20Web%20Technology.pdf?mkt_tok=3RkMMJWWfF9wsRoiuqnPZKXonjHpfsX54%2BstXaGyhYkz2EFye%2BLIHETpodcMTsdiNq%2BTFAwTG5toziV8R7PCKM1338YQWhPj[8]E.KicimanandB.Livshits(2007)“AjaxScope:Aplatformforremotelymonitoringtheclient-sidebehaviorofWeb2.0applications”.InProc.21stSymp.onOperatingSys.Principles(SOSP’07),pages17–30.[9]TaliGarsielandPaulIrish(2011)“HowBrowsersWork:Behindthescenesofmodernwebbrowsers”[Online],Retrievedfrom:https://www.html5rocks.com/en/tutorials/internals/howbrowserswork/[10]TheWorldWideWebConsortium(W3C)(2013)“Optimizingcontentfordifferentbrowsers:theRIGHTway”[Online],Retrievedfrom:https://www.w3.org/community/webed/wiki/Optimizing_content_for_different_browsers:_the_RIGHT_way[11]TheWorldWideWebConsortium(W3C)(2016)“DeviceOrientationEventSpecification”[Online],Retrievedfrom:http://www.w3.org/TR/2016/CR-orientation-event-20160818/

44

[12]GustavoHartmann,GeoffStead,AsiDeGani(2012)“Cross-platformmobiledevelopment”.MedicalMobileDevelopmentProject:D4,pp.2.[13]ZhenWang,FelixXiaozhuLin,LinZhong,MansoorChishtie(2011)“WhyareWebBrowsersSlowonSmartphones?”HotMobile'11,Proceedingsofthe12thWorkshoponMobileComputingSystemsandApplicationspp.91-96.[14]ConsumerTechnologyAssociation(2014)“TheLifeExpectancyofElectronics”[Online]Retrievedfrom:https://www.cta.tech/News/Blog/Articles/2014/September/The-Life-Expectancy-of-Electronics.aspx[15]Nah,F.(2004)“Astudyontolerablewaitingtime:howlongareWebuserswillingtowait?”Behaviour&InformationTechnology,forthcoming.[16]E.Kitamura(2014)“Workingwithquotaonmobilebrowsers,Aresearchreportonbrowserstorage”[Online],Retrievedfrom:https://www.html5rocks.com/en/tutorials/offline/quota-research/[17]D.Reifer(2000)Web-Development:EstimatingQuick-Time-to-MarketSoftware.IEEEsoftware,vol.17,no.8,November/December2000,pp.57-64.[18]RuheM,JefferyR,WieczorekI(2003)“Costestimationforwebapplication”,ICSE2003:Proceedingsof25thInternationalConferenceonSoftwareEngineering.Oregon,USA,pp285–294.[19]IFPUG.FunctionPointCountingPracticesManual,Release4.1,InternationalFunctionPointUsersGroup,Westerville,Ohio,USA,1999.[20]D.Reifer(2002)“EstimatingWebDevelopmentCosts:ThereAreDifferences”,Crosstalk,pp.13-17[21]InternationalTelecommunicationUnion(2015)“ICTFacts&Figures:TheWorldin2015”[Online],Retrievedfrom:https://www.itu.int/en/ITU-D/Statistics/Documents/facts/ICTFactsFigures2015.pdf[22]S.DiMartino,F.Ferrucci,C.Gravino(2009)“AnEmpiricalStudyontheUseofWeb-COBRAandWebObjectstoEstimateWebApplicationDevelopmentEffort”,WebEngineering,Volume5648oftheseriesLectureNotesinComputerSciencepp213-220[23]S.AbrahãoandG.Poels(2009)“AfamilyofexperimentstoevaluateafunctionalsizemeasurementprocedureforWebapplications”,JournalofSystemsandSoftwareVolume82,Issue2,February2009,pp.253–269[24]V.GarcíaDíaz,J.ManuelCuevaLovelle,B.CristinaPelayoGarcía-Bustelo(2014)“HandbookofResearchonInnovationsinSystemsandSoftwareEngineering”,Volume1,InformationScienceReference,2014pp.315

45

[25]ISO,"ISO/IEC14143-1-InformationTechnology-Softwaremeasurement-FunctionalSizeMeasurement.Part1:DefinitionofConcepts",1998.[26]O.Pastor,S.Abrahão,andJ.Fons,[2001]"AnObject-OrientedApproachtoAutomateWebApplicationsDevelopment",Proc.of2ndInternationalConferenceonElectronicCommerceandWebTechnologies(EC-Web'01),Munich,Germany,LNCS2115,Springer-Verlag,pp.16-28.[27]TheWorldWideWebConsortium(W3C)(2016)“HTML/Elements/video”[Online]Retrievedfrom:https://www.w3.org/wiki/HTML/Elements/video