12/9/2016

MOBILEAPPPROJECT

MOBILEAPPPROJECT
Workinginapairorgroup,youarenowgoingtodevelopamobileappofyourown!
Youmayhavesomeideasalready,butsoftwareisnormallydesignedbygoingthroughaseriesof
stages:
1.
2.
3.
4.
5.
6.
7.

Analyze
Design
Implement
Test
Document
Evaluate
Maintain

OrADanceInTheDarkEveryMidnight!
Letsconsiderwhateachofthesestagesmeanswithinmobileappdevelopment.
1.

ANALYZE

Identifyaproblemorneedyourappisgoingtoaddress.Thinkaboutitspossibleusers.Itsoftenbest
tochoosesomethingthatinterestsyouoryoucareabout.
2.

DESIGN

Designyourappintwostages:
2.1 Makeasketchoftheinterface
Thisissometimesknownasawireframeandisthebestwaytogetaclearideaofhowyourappwill
work.
2.2 Designyourcodebycreatingalgorithms
DONOTjuststarttotrycodingwithoutdesigningitfirst!Remembertheancientprogrammersproverb:
Hoursofcodingcansaveminutesofdesign
3.

IMPLEMENT

Createyourappsscreenandcomponents,thencreatethecodethatcorrespondstoyouralgorithms.
Remembertocommentyourcodesothatitmakessensetootherdevelopersandyou,whenyou
comebacktofixbugsoraddnewfeaturesnextyear!
4.

TEST

Testyourapptomakesureitworks.
Giveittootherusersandnotetheircomments.
Fixanybugsthatarediscovered.

5.

DOCUMENT

Adesktopapplicationcomeswithdocumentationinstructionsonhowtoinstallanduseit.
However,amobileappshouldneedlittleornodocumentation.Oftentheonlydocumentationissome
simpleinstructions,eitherontheappitself,oronitspageonanappstore.Youmustthereforemake
yourappasintuitive(obvioushowtouse)aspossible.
Animportantpartofdocumentationisensuringthatcommentsareincludedwithcode,althoughthis
shouldbedoneduringcoding.

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

1/8

12/9/2016

MOBILEAPPPROJECT

6.

EVALUATE

Whenyouvefinishedthetask,makeanhonestassessmentofhowyoudid.Somequestionsthatyou
mightaskinclude:

Didtheappturnoutasplanned?
Whatmistakesdidyoumakeontheway?
Ifyouweretostartagainfromthebeginning,whatwouldyoudodifferently?
Arethereanyfeaturesthatyouthinkwouldmakeitbetter?

Thisisavitalstageindevelopmentbecauseitisonlybyansweringthesequestionsthatdevelopers
canimprovetheirskillsandfutureapps.
7.

MAINTAIN

Maintenanceistheprocessofupdatingyourapp.Therearethreemaintypesofmaintenance:

Fixingbugsthatwerentdiscoveredduringtesting

Addingnewfeatures

AdaptingyourapptoworkonnewdevicesAgoodexampleofthisiscreatingatabletversionof
anapporiginallywrittenforsmartphones.
Nowletsgothroughthesestagestocreateyourownmobileapp!
*Required

STUDENTINFORMATION
1.LASTNAME/FIRSTNAME*

2.GROUPNUMBER*

3.PROJECTNAME*

1.ANALYZE
4.Workinginpairsorsmallgroups,brainstormthreeideasforyourapp.Asyoudoso,think
abouteachappspossibleusersandtheneeditsgoingtofulfill.Thinkofhowitmightlink
inwithothersubjectareasyourestudying.*

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

2/8

12/9/2016

MOBILEAPPPROJECT

5.Nowdiscussyourideas.Onceyouhaveagreedontheappyouaregoingtodevelop,write
downafullerdescriptionofwhatitwilldo.Includeanymobilefeaturesitwilluse.*

2.DESIGN
6.2.1DESIGN(INTERFACE)Makeasketchof
yourappsinterface.Yoursketchshouldbe
labeledtoshowwhateachcomponentdoes.
(PASTETHELINK)*

7.2.2DESIGN(CODE)Designthealgorithmsfor
yourcode:Thinkaboutthestepseach
componentfromyourscreendesignwillhave
toperform.WritetheminEnglish.Use
procedureswhereappropriate.Remember,
wheneveryouhaveaclearsubtaskinyour
app,youshouldcreateaproceduretodothis.
Thisisespeciallytrueifyouwilluseitmore
thanonce!(PASTETHELINK)*

3.IMPLEMENT
8.Nowcreateyourapp!Createthecomponents
inthedesigner.Remembertogivethem
sensiblenames.Thencreatethecodeinthe
blockseditorRemembertoincludecomments
inyourcodeandmakesureyouhaveyour
algorithminfrontofyou!(PASTETHELINK)*

4.TEST
9.Testyourapptomakesureitworks.Letyourclassmatestestittooandnotetheircomments:
*

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

3/8

12/9/2016

MOBILEAPPPROJECT

10.Describebugsthatwerefound(byyouorbytesters)andhowyoufixedthem:*

5.DOCUMENT
11.Letsimaginethatyouregoingtosellyourapponanappstore.Writedownabrief
descriptionofyourappsmainfeaturesandhowtousethem.Rememberyouretryingto
getpeopletobuyyourapp!*

6.EVALUATE
12.Howdidtheappturnoutcomparedtohowyouoriginallyplannedit?Rememberyoure
tryingtogetpeopletobuyyourapp!*

13.Whatmistakesdidyoumakeontheway?*

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

4/8

12/9/2016

MOBILEAPPPROJECT

14.Ifyouweretostartagainfromthebeginning,whatwouldyoudodifferently?*

15.Whatadditionalfeatureswouldmakeyourappbetter?*

7.MAINTAIN
16.Nowimaginethatyouhavetoadaptyourapptomakeitworkonatabletcomputer.What
changeswouldyoumake?*

HowtoCreateVideoTutorials
1.WriteaScript

Writefrom100to300words.Youusuallyspeakabout100wordsaminute,andvideosareideally
threeminutes.

Writethescriptasconversationallyaspossible.

Readitoutloudseveraltimesasyouwalkthrougheachofthesteps.

Highlightinyellowtheplacesinthescriptrequiringaction.

Transcribeyourscriptonanotepaddocumentandchangetheextension.txtto.srt.

NOTEPADSCRIPT

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

5/8

12/9/2016

MOBILEAPPPROJECT

SOMESTRUCTURESFORWRITINGYOURSCRIPT

2.PreparetheSimulation

Recordthescreenactions
Takefakedataandastabletestenvironmenttosetupyoursimulations
Runthroughthetasksandsetupanykindofinformation,events,orothersampledatayouwantto

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

6/8

12/9/2016

MOBILEAPPPROJECT

show.

Makesurethesimulationworksandissomethingyoucandemonstrateinasimpleway.

Practiceitseveraltimestomakesureyourscriptmatchesalltheactionsyouwilltake.

3.RecordtheSimulationandNarration

Resizetheviewportonyourbrowserto1280x720thesedimensionswillallowyourvideoto
displayasHD.
WithChrome,youcanaddanextensioncalledWindowResizertoresizeyourbrowser.

Putyourscriptononemonitorandrecordthesimulationonanothermonitor

Trytobeconversationalandnatural.It'simportanttokeepyourscriptfluid.

Focusongettingclean,smoothscreenactions.

Dragyourmousenormallyandtrynottomovethemousearoundwhileyoutalk

Neverwiggleyourmousetoemphasizeapoint.

Ifyoustutterormispronounceaword,don'tworryaboutit.
Justmakesurethetimingofyouractionsmatchesthetimingofyourvoice.

4.RerecordtheAudio

Openyourrecordedprojectupandseparateouttheaudio.

Export(or"Share"inCamtasia)thefileasaudio(Wavformat),andthenopentheaudioupin
Audacity
(orsomeotheraudioeditor).

Playtheaudioagainandmakesureyourscriptmatchestheaudioverbatim.

Playtheaudioagainandinsertnumberswhereyoupause.
Ifyoupause3secondsafteranaction,type3inthatspace.Formatallofthesenumbersinredso
theystandout.

Nowcreateanewtrack

Speakconfidently,andmixupyourpacingtosoundmorenatural.

5.PostprocesstheSimulation

Listentotheaudiowiththesimulationandremoveanylong,unnecessarypausesormomentsof
inaction.

Addcalloutswherenecessary,suchaswhenyouwanttocallattentiontosomeobjectonthe
screen.

Addatwosecondtitleslidethatdescribesthepurposeofthevideo.

6.PublishandIntegratetheVideo

RenderthevideotoanMP4formatanduploadittoyourserver.

Uploadyour1280x720MP4videotoYouTube,itrendersthevideoautomaticallyinHD.

Takethescriptyouused,andsimplyuploaditinthecaptionssectionofthevideo.

Ifyouwanttohardcodesubtitlesonyourvideotutorial(toshareitwithoutuploadingtoaserver),
youcanuse
PocketDivXEncoder

POCKETDIVXENCODER

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

7/8

12/9/2016

MOBILEAPPPROJECT

OPTIONAL:PublishingAppstoGooglePlay(AppInventor2)
IFYOUWANTTOUPLOADANDPUBLISHYOURAPPGOTOGOOGLEPLAYCONSOLE
DEVELOPER
FORMOREINFORMATION,CLICKONTHEFOLLOWINGLINKS:
http://appinventor.mit.edu/explore/ai2/googleplay.html
https://support.google.com/googleplay/androiddeveloper/answer/113469?
hl=en&topic=2365624&ctx=topic

FINALPAPERANDTUTORIAL
17.PASTEYOURFINALPAPERLINK

18.PASTEYOURVIDEOTUTORIALLINK

Poweredby

https://docs.google.com/forms/d/1PBeug3NqhNrYBlaQw9wXRzVxyAIbxfGx0WghDGgd29g/edit

8/8