Ett foredrag for elever ved Nordahl Grieg VGS om hvordan man lager mobile applikasjoner. Dette er en enkel innføring i tanker man bør gjøre seg før man setter i gang med selve utviklingen.

1. Hvordan lage apper
Thomas Skavhellen
Sixty.no

2. Apper fra A-Å
• Hvem er Sixty
• Hva er en App
• Hvilke enheter skal man støtte
• Native eller Web app
• Prosessen bak en app
• De gode app ideene

4. Forretningsområder
• Design og utvikling for digitale medier
• Webutvikling & Webdesign
• Publiseringsløsninger (Silverstripe)
• Interaktiv design for TV
• Apps (iPhone, Android og nettbrett)
• 3D og animasjon

5. Det handler om å være
tilstede på alle flatene

8. Kjent for
TV Design

10. Den Gyldne Hane
Beste Applikasjon

11. Rallarvegen

12. Hva er en app?

13. Programvare som må være skrevet i
det språket til den spesifikke
plattformen den skal brukes på.

15. Mobil Apps

16. Hvilke plattform skal appen din støtte?

17. Netcom salgstall, April 2013
1. Apple iPhone 5, iOS
2. Samsung Galaxy S III, Android
3. Apple iPhone 4, iOS
4. Apple iPhone 4S, iOS
5. Sony Xperia Z, Android
6. Samsung Galaxy S III Mini, Android
7. Samsung Galaxy S3 LTE, Android
8. Samsung Galaxy Note II, Android
9. Samsung Galaxy S4, Android
10. Sony Experia V, Android

19. labs.finn.no

20. labs.finn.no

21. Oppsummering
• iOS og Android er de to største plattformene
• I utlandet er Android størst (Flest brukere)
• Her hjemme er iOS størst (en stund til)

22. Native app eller Web App
(eller begge?)

23. Ulike måter å utvikle på
• Native apps
-
Skriver appen i språket spesifikt for enheten den skal brukes på. (iOS, Android,
Windows)
• Web apps
-
Skriver appen i webspråket tilpasset mobil (HTML, CSS, Javascript) kan bruke et
rammeverk for å pakke den inn som en native app. (http://www.appshed.com)
• Hybryd apps
-
Skriver appen native men kan inneholde innhold fra web.

24. Native vs Webapp
•
Raskere apps, laster innhold internt
og ikke fra web
•
Tilgang til alle telefonfunksjoner
som kamera, kompass osv.
•
Føles som en app og ikke en
webside
•
For krevende applikasjoner, der
look and feel er viktigst.
•
•
•
Lettere å komme i gang.
•
For enkle applikasjoner som ikke krever
så mye av telefonen.
Støtter alle telefoner med en kode
Trenger mange plugins for å få til SMS,
Push meldinger, print, in-app kjøp. Gjør
appen tregere.

25. Prosessen bak en app

27. Slik jobber vi
Intromøte
Workshop
Wireframe
Design
Prototype
Muligheter/prioriteringer
Utvikling
Testing
Tilbud
Revidering
Lansering

28. Wireframes
• Wireframes er ikke endelig design, kun skisser /
plantegning.
• Tegn appen på papir eller pc/mac før du begynner å
designe.
• Finn ut hvor mange skjermbilder du skal lage.
• Har du alle knapper du trenger?
• Peker alle knapper til en side eller funksjon?
• Få med alle dialogbokser (Ja/Nei bokser)

30. Prototype
• Test ut alle wireframes uten å programmere
• Kan teste wireframes eller mer ferdig design
• Du får en «ferdig» app og kan klikke deg rundt i appen
med telefonen din.
• Sjekker om du har fått med deg alt eller om appen
fungerer slik du har tenkt uten å programmere.

33. Ressurser
Wireframe software
• http://www.justinmind.com
Prototype software
• https://popapp.in

34. Design
• iOS og Android oppfører seg på forskjellige måter, må
derfor designes på forskjellige måter.
• Android telefoner har noen knapper (tilbake knapp) iOS har
ingen.
• iPhone har 2 forskjellige skjermstørrelser å forholde seg til.
iPhone 4 og iPhone 5. Android har veldig mange.
• Se på populære apper, hvordan ser de ut, stjel og lær.

37. Ressurser
iOS Patterns
•
http://pttrns.com
iOS Skjermstørrelser
•
http://ivomynttinen.com/blog/the-ios-design-cheat-sheet-volume-2/
Android Patterns
•
http://www.android-app-patterns.com
iOS Skjermstørrelser
•
http://developer.android.com/guide/practices/screens_support.html

38. Tenk gjennom dette..
• Hvem skal bruke appen? (Målgruppen)
• Hva skal appen gjøre? (Løser den et problem)
• Er appen morsom? (Morsomme apper blir delt)
• Er appen din bedre enn konkurrentene?
• Er det mye interaktivitet i appen? (Brukes den ofte?)
• Har du et bra forklarende ikon?

39. Før du utvikler
• Lag en markedsplan, hvordan skal appen tjene penger?
• Sett opp en appkonto (Google Play og/eller AppStore)
• Tegn applikasjonen på papir (Prototype)
• Hvem gjør hva? (Design, Utvikling, Markedsføring)
• Du er klar for å utvikle
• Sett i gang markedsføringsplanen
• Lanser!

40. Eksempler på en
dårlig app ide.

44. Eksempler på
gode app ide.

47. Takk